w-front-end / select_good · Commits

Commit d446d5e3fd6682cd72f884386cf6294c10dd3862

Authored by zhiyangdu
1 parent 58bd5992

收礼页面

Inline Side-by-side
Showing 7 changed files with 88 additions and 35 deletions
mall20200422.zip 0 → 100644
View file @d446d5e
No preview for this file type
newDaren20200420.zip 0 → 100644
View file @d446d5e
No preview for this file type
newDaren20200421.zip 0 → 100644
View file @d446d5e
No preview for this file type
src/components/giftItem/giftItem.less
  View file @d446d5e
... ... @@ -17,11 +17,11 @@
17 17 border-radius: 50px;
18 18 }
19 19 .name{
20   - height:40px;
  20 + height:50px;
21 21 font-size:28px;
22 22 font-weight:400;
23 23 color:rgba(51,51,51,1);
24   - line-height:40px;
  24 + line-height:50px;
25 25 margin-left: 20px;
26 26 }
27 27 .btn{
... ... @@ -108,40 +108,49 @@
108 108 }
109 109 .steps_box{
110 110 margin-top: 58px;
111   - .box{
  111 + .line_box {
112 112 display: flex;
113   - .item{
114   - .img{
115   - width:16px;
116   - height:16px;
117   - border-radius: 16px;
118   - border:3px solid rgba(202,202,202,1);
119   - margin: auto;
120   - }
121   - .desc{
122   - height:30px;
123   - font-size:22px;
124   - font-weight:400;
125   - color:rgba(202,202,202,1);
126   - line-height:30px;
127   - margin-top: 20px;
  113 + .box {
  114 + height: 16px;
  115 + .item {
  116 + display: flex;
  117 + .img {
  118 + width: 16px;
  119 + height: 16px;
  120 + background: url("/static/img/spot.png") no-repeat top;
  121 + background-size: 100%;
  122 + }
  123 + .line_box {
  124 + height: 19px;
  125 + display: flex;
  126 + align-items: center;
  127 + margin: 0 13px;
  128 + .line {
  129 + width: 130px;
  130 + height: 1px;
  131 + background: rgba(240, 240, 240, 1);
  132 + }
  133 + }
128 134 }
129 135 }
130   - .line_box {
131   - height: 19px;
132   - display: flex;
133   - align-items: center;
134   - .line {
135   - width: 130px;
136   - height: 1px;
137   - background: rgba(240, 240, 240, 1);
138   - margin: auto 16px;
139   - }
  136 + }
  137 + .desc_box{
  138 + display: flex;
  139 + justify-content: space-between;
  140 + margin-top: 17px;
  141 + .desc{
  142 + width: 88px;
  143 + height:30px;
  144 + font-size:22px;
  145 + font-weight:400;
  146 + color:rgba(202,202,202,1);
  147 + line-height:30px;
  148 + margin-top: 20px;
140 149 }
141 150 }
142 151 .box:last-child{
143   - .line_box{
144   - display: flex;
  152 + .item .line_box{
  153 + display: none;
145 154 }
146 155 }
147 156 }
... ...
src/components/giftItem/giftItem.vue
  View file @d446d5e
... ... @@ -28,21 +28,65 @@
28 28 </div>
29 29 <!--步骤条-->
30 30 <div class="steps_box">
  31 + <div class="line_box">
31 32 <div class="box">
32 33 <div class="item">
33 34 <div class="img">
  35 + </div>
  36 + <div class="line_box">
  37 + <div class="line">
34 38  
  39 + </div>
35 40 </div>
36   - <!--<img src="/static/img/1.png"/>-->
37   - <div class="desc">
38   - 点击送礼
  41 + </div>
  42 + </div>
  43 + <div class="box">
  44 + <div class="item">
  45 + <div class="img">
  46 + </div>
  47 + <div class="line_box">
  48 + <div class="line">
  49 +
  50 + </div>
  51 + </div>
39 52 </div>
40 53 </div>
41   - <div class="line_box">
42   - <div class="line">
  54 + <div class="box">
  55 + <div class="item">
  56 + <div class="img">
  57 + </div>
  58 + <div class="line_box">
  59 + <div class="line">
  60 +
  61 + </div>
  62 + </div>
  63 + </div>
  64 + </div>
  65 + <div class="box">
  66 + <div class="item">
  67 + <div class="img">
  68 + </div>
  69 + <div class="line_box">
  70 + <div class="line">
43 71  
  72 + </div>
  73 + </div>
  74 + </div>
44 75 </div>
45 76 </div>
  77 + <div class="desc_box">
  78 + <div class="desc">
  79 + 点击送礼
  80 + </div>
  81 + <div class="desc">
  82 + 填写地址
  83 + </div>
  84 + <div class="desc">
  85 + 商家发货
  86 + </div>
  87 + <div class="desc">
  88 + 确认收货
  89 + </div>
46 90 </div>
47 91 </div>
48 92 </div>
... ...
static/img/spot.png 0 → 100644
View file @d446d5e

568 Bytes
static/img/spot_active.png 0 → 100644
View file @d446d5e

912 Bytes