Commit 3dd4c735 by weijiguang

优化UI

parent dc6ccf7f
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<image mode="scaleToFill" :src="qrCode" class="qr"></image> <image mode="scaleToFill" :src="qrCode" class="qr"></image>
</div> </div>
<div class="qr_code" v-else> <div class="qr_code" v-else>
<image mode="aspectFit" :src="'/static/imgs/erweimazhedang.png'" class="qr"></image> <image :src="'/static/imgs/erweimazhedang.png'" class="qr"></image>
</div> </div>
<view class="status_text" v-if="showMask">——制作完成后才能扫哦——</view> <view class="status_text" v-if="showMask">——制作完成后才能扫哦——</view>
<div class="flow_describe" :style="{'padding-top':(!showMask)?'48rpx':'80rpx'}"> <div class="flow_describe" :style="{'padding-top':(!showMask)?'48rpx':'80rpx'}">
...@@ -22,11 +22,13 @@ ...@@ -22,11 +22,13 @@
<div class="flow_describe_tips"> <div class="flow_describe_tips">
<view class="title">注意事项</view> <view class="title">注意事项</view>
<view class="text"> <view class="text">
<view>1.冷饮拍完照记得搅拌哦~搅拌3圈风味更佳</view> <view>
<view>2.吸管请到两边窗口自取</view> <view>1.&nbsp;冷饮拍完照记得搅拌哦~搅拌3圈风味更佳</view>
<view>3.热饮小心烫嘴!</view> <view>2.&nbsp;吸管请到两边窗口自取</view>
<view>4.二维码被抱住的时候不能扫哦</view> <view>3.&nbsp;热饮小心烫嘴!</view>
<view>5.有问题或对出品任何不满意请联系客服</view> <view>4.&nbsp;对出品任何不满请联系客服退款或重做</view>
</view>
<image :mode="'aspectFit'" class="tips_img" :src="'/static/imgs/jiaoban.png'" />
</view> </view>
</div> </div>
</scroll-view> </scroll-view>
...@@ -221,15 +223,15 @@ export default { ...@@ -221,15 +223,15 @@ export default {
} }
} }
.qr_code { .qr_code {
height: 347rpx; height: 350rpx;
width: 353rpx; width: 350rpx;
display: block; display: block;
margin: 72rpx auto; margin: 72rpx auto;
position: relative; position: relative;
padding-bottom: 40rpx; padding-bottom: 40rpx;
margin-bottom: 0rpx; margin-bottom: 0rpx;
margin-left: 150rpx; margin-left: 170rpx;
.status_text { .status_text {
font-size: 28rpx; font-size: 28rpx;
margin-top: 39rpx; margin-top: 39rpx;
...@@ -270,7 +272,7 @@ export default { ...@@ -270,7 +272,7 @@ export default {
margin-top: 100rpx; margin-top: 100rpx;
background: #FFFFFF; background: #FFFFFF;
margin: 32rpx; margin: 32rpx;
padding: 26rpx 32rpx 32rpx 24rpx; padding: 26rpx 32rpx 32rpx 32rpx;
.title{ .title{
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
...@@ -281,12 +283,18 @@ export default { ...@@ -281,12 +283,18 @@ export default {
letter-spacing: 1rpx; letter-spacing: 1rpx;
} }
.text { .text {
display: flex;
justify-content: space-between;
margin-top: 18rpx; margin-top: 18rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #999999; color: #999999;
line-height: 50rpx; line-height: 48rpx;
}
.tips_img {
width: 142rpx;
width: 138rpx;
} }
} }
.customer_service { .customer_service {
......
...@@ -455,7 +455,7 @@ export default { ...@@ -455,7 +455,7 @@ export default {
position: relative; position: relative;
padding-bottom: 40rpx; padding-bottom: 40rpx;
margin-bottom: 0rpx; margin-bottom: 0rpx;
margin-left: 150rpx; margin-left: 170rpx;
.qr { .qr {
width: 100%; width: 100%;
......
static/imgs/erweimazhedang.png

129 KB | W: | H:

static/imgs/erweimazhedang.png

200 KB | W: | H:

static/imgs/erweimazhedang.png
static/imgs/erweimazhedang.png
static/imgs/erweimazhedang.png
static/imgs/erweimazhedang.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment