hookehuyr

fix 样式优化

...@@ -26,6 +26,7 @@ declare module '@vue/runtime-core' { ...@@ -26,6 +26,7 @@ declare module '@vue/runtime-core' {
26 NutRadio: typeof import('@nutui/nutui-taro')['Radio'] 26 NutRadio: typeof import('@nutui/nutui-taro')['Radio']
27 NutRadioGroup: typeof import('@nutui/nutui-taro')['RadioGroup'] 27 NutRadioGroup: typeof import('@nutui/nutui-taro')['RadioGroup']
28 NutRow: typeof import('@nutui/nutui-taro')['Row'] 28 NutRow: typeof import('@nutui/nutui-taro')['Row']
29 + NutSkeleton: typeof import('@nutui/nutui-taro')['Skeleton']
29 NutSwiper: typeof import('@nutui/nutui-taro')['Swiper'] 30 NutSwiper: typeof import('@nutui/nutui-taro')['Swiper']
30 NutSwiperItem: typeof import('@nutui/nutui-taro')['SwiperItem'] 31 NutSwiperItem: typeof import('@nutui/nutui-taro')['SwiperItem']
31 NutTabPane: typeof import('@nutui/nutui-taro')['TabPane'] 32 NutTabPane: typeof import('@nutui/nutui-taro')['TabPane']
......
...@@ -18,8 +18,8 @@ ...@@ -18,8 +18,8 @@
18 <nut-row> 18 <nut-row>
19 <nut-col span="18"> 19 <nut-col span="18">
20 <view class="order-card-price-text"> 20 <view class="order-card-price-text">
21 - <text class="left"><nut-price :price="980" size="normal" /></text> 21 + <view class="left"><nut-price :price="980" size="normal" /></view>
22 - <text class="right"><nut-price :price="1280" size="small" strike-through style="color: #7D7C7C;" /></text> 22 + <view class="right" style="margin-top: 10rpx;"><nut-price :price="1280" size="small" strike-through style="color: #7D7C7C;" /></view>
23 </view> 23 </view>
24 </nut-col> 24 </nut-col>
25 <nut-col span="6" class="order-card-price-num"> 25 <nut-col span="6" class="order-card-price-num">
...@@ -124,7 +124,7 @@ ...@@ -124,7 +124,7 @@
124 </template> 124 </template>
125 125
126 <script setup> 126 <script setup>
127 -import { ref, onMounted, onUnmounted, computed } from 'vue' 127 +import { ref, reactive, onMounted, onUnmounted, computed } from 'vue'
128 import Taro from '@tarojs/taro' 128 import Taro from '@tarojs/taro'
129 import { IconFont } from '@nutui/icons-vue-taro'; 129 import { IconFont } from '@nutui/icons-vue-taro';
130 130
...@@ -234,6 +234,11 @@ onUnmounted(() => { ...@@ -234,6 +234,11 @@ onUnmounted(() => {
234 </script> 234 </script>
235 235
236 <style lang="less"> 236 <style lang="less">
237 +:root,
238 +page {
239 + --nut-price-medium-size: 35rpx;
240 +}
241 +
237 .order-card-component { 242 .order-card-component {
238 margin: 1rem; 243 margin: 1rem;
239 margin-top: 0.5rem; 244 margin-top: 0.5rem;
......
1 <!-- 1 <!--
2 * @Date: 2023-12-13 13:42:23 2 * @Date: 2023-12-13 13:42:23
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2023-12-25 12:49:46 4 + * @LastEditTime: 2023-12-25 13:33:45
5 * @FilePath: /meihuaApp/src/components/roomCard.vue 5 * @FilePath: /meihuaApp/src/components/roomCard.vue
6 * @Description: 房间详情组件 6 * @Description: 房间详情组件
7 --> 7 -->
...@@ -15,8 +15,8 @@ ...@@ -15,8 +15,8 @@
15 <view class="room-info-desc">两室 宜住3人</view> 15 <view class="room-info-desc">两室 宜住3人</view>
16 </nut-col> 16 </nut-col>
17 <nut-col span="6" class="room-info-right"> 17 <nut-col span="6" class="room-info-right">
18 - <view class="room-info-discount"><nut-price :price="980" size="normal" /></view> 18 + <nut-price :price="980" size="normal" style="font-weight: bold;" />
19 - <view class="room-info-price"><nut-price :price="1280" size="small" strike-through style="color: #7D7C7C;" /></view> 19 + <nut-price :price="1280" size="small" strike-through style="color: #7D7C7C;" />
20 </nut-col> 20 </nut-col>
21 </nut-row> 21 </nut-row>
22 </view> 22 </view>
...@@ -123,6 +123,10 @@ onMounted(() => { ...@@ -123,6 +123,10 @@ onMounted(() => {
123 </script> 123 </script>
124 124
125 <style lang="less"> 125 <style lang="less">
126 +:root,
127 +page {
128 + --nut-price-medium-size: 35rpx;
129 +}
126 .room-card-component { 130 .room-card-component {
127 position: relative; 131 position: relative;
128 margin: 1rem; 132 margin: 1rem;
...@@ -141,11 +145,12 @@ onMounted(() => { ...@@ -141,11 +145,12 @@ onMounted(() => {
141 .room-info-title { 145 .room-info-title {
142 color: #0B0B0B; 146 color: #0B0B0B;
143 font-weight: bold; 147 font-weight: bold;
148 + margin-top: 5rpx;
144 } 149 }
145 .room-info-desc { 150 .room-info-desc {
146 color: #7D7C7C; 151 color: #7D7C7C;
147 font-size: 0.8rem; 152 font-size: 0.8rem;
148 - margin-top: 0.1rem; 153 + margin-top: 0.2rem;
149 } 154 }
150 } 155 }
151 .room-info-right { 156 .room-info-right {
...@@ -153,13 +158,10 @@ onMounted(() => { ...@@ -153,13 +158,10 @@ onMounted(() => {
153 flex-direction: column; 158 flex-direction: column;
154 align-items: flex-end; 159 align-items: flex-end;
155 .room-info-discount { 160 .room-info-discount {
156 - float: right;
157 color: #EB2E2E; 161 color: #EB2E2E;
158 font-weight: bold; 162 font-weight: bold;
159 - font-size: 1.1rem;
160 } 163 }
161 .room-info-price { 164 .room-info-price {
162 - float: right;
163 } 165 }
164 } 166 }
165 } 167 }
......