李志伟 3 years ago
parent
commit
5b8c4d371e

+ 1
- 1
src/hotel/components/HouseManage/houseManage.jsx View File

94
     getShareMessage: () => {
94
     getShareMessage: () => {
95
       const { shareImage, roomOrderId } = shareDataRef.current
95
       const { shareImage, roomOrderId } = shareDataRef.current
96
       setShowCard(false)
96
       setShowCard(false)
97
-      console.log(`/pages/index/index?tab=1&roomId=${room.roomId}&roomOrderId=${roomOrderId}&fromType=hotel&recommender=${hotel.hotelId}`)
97
+      // console.log(`/pages/index/index?tab=1&roomId=${room.roomId}&roomOrderId=${roomOrderId}&fromType=hotel&recommender=${hotel.hotelId}`)
98
       return {
98
       return {
99
         title: room.roomName,
99
         title: room.roomName,
100
         path: `/pages/index/index?tab=1&roomId=${room.roomId}&roomOrderId=${roomOrderId}&fromType=hotel&recommender=${hotel.hotelId}`,
100
         path: `/pages/index/index?tab=1&roomId=${room.roomId}&roomOrderId=${roomOrderId}&fromType=hotel&recommender=${hotel.hotelId}`,

+ 126
- 132
src/pages/MineUserAll/RefundMoney/CheckRefund/index.jsx View File

87
       refundReason: explain,
87
       refundReason: explain,
88
     }).then((res) => {
88
     }).then((res) => {
89
       Taro.hideLoading();
89
       Taro.hideLoading();
90
-        Taro.navigateTo({ url: '/pages/MineUserAll/AllOrder/index?tabJump=0' })
91
-        Taro.showToast({
90
+      Taro.navigateTo({ url: '/pages/MineUserAll/AllOrder/index?tabJump=0' })
91
+      Taro.showToast({
92
         title: "退款成功",
92
         title: "退款成功",
93
         icon: "none",
93
         icon: "none",
94
         duration: 3000,
94
         duration: 3000,
110
   }, [list]);
110
   }, [list]);
111
 
111
 
112
   return (
112
   return (
113
-    <view>      
113
+    <view>
114
       <view className='index-navbar'>
114
       <view className='index-navbar'>
115
         <CustomNav title='售后退款' />
115
         <CustomNav title='售后退款' />
116
       </view>
116
       </view>
117
-      <View className='box-content'>
118
       <scroll-view scroll-y style='height: calc(100vh - 65px);' >
117
       <scroll-view scroll-y style='height: calc(100vh - 65px);' >
119
-
120
-        <view className='Refund-Content-box'>
121
-
122
-          <view className='title-image'>
123
-            <image
124
-              mode='scaleToFill'
125
-              className='title-image-cup'
126
-              src={BlackSpot}
127
-            />
128
-            <text className='title-title-boss'>商品信息</text>
118
+        <View className='index-container box-content'>
119
+          <view className='Refund-Content-box'>
120
+            <view className='title-image'>
121
+              <image
122
+                mode='scaleToFill'
123
+                className='title-image-cup'
124
+                src={BlackSpot}
125
+              />
126
+              <text className='title-title-boss'>商品信息</text>
127
+            </view>
129
           </view>
128
           </view>
130
-        </view>
131
-        {/* 商品信息结束 */}
132
-        <view>
133
-          {(list || []).map((item) => {
134
-            return (
135
-              <view class='wrapper' key={item.orderId}>
136
-                <view class='left-complete-one'>
137
-                  <image className='left-image-1' src={ProCard_hot}></image>
138
-                  <view className='left-viewText'>
139
-                    返现¥{formatPrice(item.cashback)}
140
-                  </view>
141
-                  <view className='title-image'>
142
-                    <image
143
-                      className='image-1'
144
-                      mode='scaleToFill'
145
-                      src={item.poster}
146
-                    ></image>
147
-                    <image className='image-2' src={food}></image>
148
-                  </view>
149
-                  <view className='title-content'>
150
-                    <view className='Pro-title'>
151
-                      <view className='title-text'>
152
-                        {item.packageDescription}
129
+          {/* 商品信息结束 */}
130
+          <view>
131
+            {(list || []).map((item) => {
132
+              return (
133
+                <view class='wrapper' key={item.orderId}>
134
+                  <view class='left-complete-one'>
135
+                    <image className='left-image-1' src={ProCard_hot}></image>
136
+                    <view className='left-viewText'>
137
+                      返现¥{formatPrice(item.cashback)}
138
+                    </view>
139
+                    <view className='title-image'>
140
+                      <image
141
+                        className='image-1'
142
+                        mode='scaleToFill'
143
+                        src={item.poster}
144
+                      ></image>
145
+                      <image className='image-2' src={food}></image>
146
+                    </view>
147
+                    <view className='title-content'>
148
+                      <view className='Pro-title'>
149
+                        <View className='cpn-card-text'>
150
+                          <View style={{ flex: '1' }}>{(item.packageDescription).toString().length > 25 ? (item.packageDescription).substring(0, 25) + '...' : (item.packageDescription)}</View>
151
+                          <text className='title-money-2'>
152
+                            数量:{item.amount}张
153
+                          </text>
154
+                        </View>
155
+                      </view>
156
+                      <text className='title-money'>
157
+                        ¥{formatPrice(item.unitPrice)}元
153
                         <text className='title-money-2'>
158
                         <text className='title-money-2'>
154
-                          数量:{item.amount}张
159
+                          门市价{formatPrice(item.standardPrice)}元
155
                         </text>
160
                         </text>
156
-                      </view>
157
-                    </view>
158
-                    <text className='title-money'>
159
-                      ¥{formatPrice(item.unitPrice)}元
160
-                      <text className='title-money-2'>
161
-                        门市价{formatPrice(item.standardPrice)}元
162
                       </text>
161
                       </text>
163
-                    </text>
164
-                    <view className='title-time'>
165
-                      有效期:{formatTime(item?.startTime, "yyyy/MM/dd")}-
166
-                      {formatTime(item.endTime, "yyyy/MM/dd")}
162
+                      <view className='title-time'>
163
+                        有效期:{formatTime(item?.startTime, "yyyy/MM/dd")}-
164
+                        {formatTime(item.endTime, "yyyy/MM/dd")}
165
+                      </view>
167
                     </view>
166
                     </view>
168
                   </view>
167
                   </view>
168
+                  <view class='right-complete-two'>
169
+                  </view>
169
                 </view>
170
                 </view>
170
-                <view class='right-complete-two'>
171
-                  <view className='right-content'></view>
172
-                </view>
173
-              </view>
174
-            );
175
-          })}
176
-        </view>
177
-
178
-        {/* 卡片结束 */}
179
-        <view className='Refund-Content-box'>
180
-          <view className='title-image'>
181
-            <image
182
-              mode='scaleToFill'
183
-              className='title-image-cup'
184
-              src={BlackSpot}
185
-            />
186
-            <text className='title-title-boss'>退款原因</text>
171
+              );
172
+            })}
187
           </view>
173
           </view>
188
-          {/* 退款结束 */}
189
-        </view>
190
-        <view className='Refund-content'>
191
-          {options.map((x) => {
192
-            return (
193
-              <text
194
-                className={`Refund-star-view${x.key} ${checkeds.indexOf(x.key) > -1
195
-                  ? "bg2"
196
-                  : `Refund-star-view${x.key}`
197
-                  }`}
198
-                key={x.key}
199
-                onClick={() => viewOK(x)}
200
-              >
201
-                {x.title}
202
-              </text>
203
-            );
204
-          })}
205
-        </view>
206
-
207
-        <view className='Refund-Content-box'>
208
-          <view className='title-image'>
209
-            <image
210
-              mode='scaleToFill'
211
-              className='title-image-cup'
212
-              src={BlackSpot}
174
+          {/* 卡片结束 */}
175
+          <view className='Refund-Content-box'>
176
+            <view className='title-image'>
177
+              <image
178
+                mode='scaleToFill'
179
+                className='title-image-cup'
180
+                src={BlackSpot}
181
+              />
182
+              <text className='title-title-boss'>退款原因</text>
183
+            </view>
184
+            {/* 退款结束 */}
185
+          </view>
186
+          <view className='Refund-content'>
187
+            {options.map((x) => {
188
+              return (
189
+                <text
190
+                  className={`Refund-star-view1 ${checkeds.indexOf(x.key) > -1
191
+                    ? "bg2"
192
+                    : `Refund-star-view2`
193
+                    }`}
194
+                  key={x.key}
195
+                  onClick={() => viewOK(x)}
196
+                >
197
+                  {x.title}
198
+                </text>
199
+              );
200
+            })}
201
+          </view>
202
+          <view className='Refund-Content-box'>
203
+            <view className='title-image'>
204
+              <image
205
+                mode='scaleToFill'
206
+                className='title-image-cup'
207
+                src={BlackSpot}
208
+              />
209
+              <text className='title-title-boss'>退款说明</text>
210
+            </view>
211
+          </view>
212
+          <view class='section'>
213
+            <Textarea
214
+              placeholder='请补充退款说明(选填)!'
215
+              onInput={(e) => setExplain(e.detail.value)}
216
+              confirm-type='done'
213
             />
217
             />
214
-            <text className='title-title-boss'>退款说明</text>
215
           </view>
218
           </view>
216
-        </view>
217
-        <view class='section'>
218
-          <Textarea
219
-            placeholder='请补充退款说明(选填)!'
220
-            onInput={(e) => setExplain(e.detail.value)}
221
-            confirm-type='done'
222
-          />
223
-        </view>
224
-        <view className='money-title'>
225
-          实付金额:{" "}
226
-          <text className='money-name'>{formatPrice(totalPrice.charges)}元</text>
227
-        </view>
228
-        <view className='money-title'>
229
-          已获返现:{" "}
230
-          <text className='money-name'>{formatPrice(totalPrice.cashback)}元</text>
231
-        </view>
232
-        <view className='money-title'>
233
-          退款金额:{" "}
234
-          <text className='money-name'>{formatPrice(totalPrice.refundPrice)}元</text>
235
-        </view>
236
-        <view className='ul-li-text'>
237
-          <view className='ul-li-view'></view>
238
-          <text className='ul-li-textname'>退款金额不可修改</text>
239
-        </view>
240
-        <view className='ul-li-text'>
241
-          <view className='ul-li-view'></view>
242
-          <text className='ul-li-textname'>
243
-            下单获得返现金额,会在退款时被扣除;
244
-          </text>
245
-        </view>
246
-        <view className='ul-li-text'>
247
-          <view className='ul-li-view'></view>
248
-          <text className='ul-li-textname'>退款将在七个工作日内原路退还。</text>
249
-        </view>
250
-
251
-        <view className='button-info'>
252
-          <Button className='button-box' onClick={() => onRefund()}>
253
-            提交申请
254
-          </Button>
255
-        </view>
219
+          <view className='money-title'>
220
+            实付金额:{" "}
221
+            <text className='money-name'>{formatPrice(totalPrice.charges)}元</text>
222
+          </view>
223
+          <view className='money-title'>
224
+            已获返现:{" "}
225
+            <text className='money-name'>{formatPrice(totalPrice.cashback)}元</text>
226
+          </view>
227
+          <view className='money-title'>
228
+            退款金额:{" "}
229
+            <text className='money-name'>{formatPrice(totalPrice.refundPrice)}元</text>
230
+          </view>
231
+          <view className='ul-li-text'>
232
+            <view className='ul-li-view'></view>
233
+            <text className='ul-li-textname'>退款金额不可修改</text>
234
+          </view>
235
+          <view className='ul-li-text'>
236
+            <view className='ul-li-view'></view>
237
+            <text className='ul-li-textname'>
238
+              下单获得返现金额,会在退款时被扣除;
239
+            </text>
240
+          </view>
241
+          <view className='ul-li-text'>
242
+            <view className='ul-li-view'></view>
243
+            <text className='ul-li-textname'>退款将在七个工作日内原路退还。</text>
244
+          </view>
245
+          <view className='button-info'>
246
+            <Button className='button-box' onClick={() => onRefund()}>
247
+              提交申请
248
+            </Button>
249
+          </view>
250
+        </View>
256
       </scroll-view>
251
       </scroll-view>
257
-</View>
258
     </view >
252
     </view >
259
   );
253
   );
260
 });
254
 });

+ 32
- 168
src/pages/MineUserAll/RefundMoney/CheckRefund/style.less View File

1
 @whiteColor: #fff;
1
 @whiteColor: #fff;
2
 
2
 
3
 .box-content {
3
 .box-content {
4
-  padding: 0 30px;
4
+  margin: 0 30px;
5
   .Refund-Content-box {
5
   .Refund-Content-box {
6
     .title-image {
6
     .title-image {
7
       margin-top: 39px;
7
       margin-top: 39px;
13
         height: 32px;
13
         height: 32px;
14
         margin-top: 10px;
14
         margin-top: 10px;
15
         padding-right: 10px;
15
         padding-right: 10px;
16
-        align-items: center;
17
       }
16
       }
18
       .title-title-boss {
17
       .title-title-boss {
19
-        align-items: center;
20
         font-size: 32px;
18
         font-size: 32px;
21
         font-weight: 800;
19
         font-weight: 800;
22
-        color: #202020;
20
+
23
       }
21
       }
24
     }
22
     }
25
   }
23
   }
26
 
24
 
27
   .wrapper {
25
   .wrapper {
28
-    margin: auto;
29
     margin-top: 40px;
26
     margin-top: 40px;
30
     display: flex;
27
     display: flex;
31
-    position: relative;
32
-    width: calc(100% -25px);
33
     filter: drop-shadow(0 0 0.9rem rgba(0, 0, 0, 0.12));
28
     filter: drop-shadow(0 0 0.9rem rgba(0, 0, 0, 0.12));
34
-    .card-box-star {
35
-      position: absolute;
36
-      width: auto;
37
-      height: 44.3px;
38
-      position: absolute;
39
-      left: 200px;
40
-      top: 28px;
41
-      font-size: 20px;
42
-      color: @whiteColor;
43
-      .card-star-image {
44
-        padding-left: 6px;
45
-        width: 21px;
46
-        height: 21px;
47
-      }
48
-      .card-star-text {
49
-        padding-left: 10px;
50
-        font-size: 20px;
51
-        color: #333;
52
-        font-weight: 700;
53
-      }
54
-    }
55
-
56
     .left-complete-one {
29
     .left-complete-one {
57
       padding-top: 87px;
30
       padding-top: 87px;
58
       padding-bottom: 43px;
31
       padding-bottom: 43px;
59
-      position: relative;
60
       display: flex;
32
       display: flex;
61
       background: @whiteColor;
33
       background: @whiteColor;
62
       background: radial-gradient(circle at top right, transparent 15px, #fff 0)
34
       background: radial-gradient(circle at top right, transparent 15px, #fff 0)
65
           right;
37
           right;
66
       background-size: 100% 60%;
38
       background-size: 100% 60%;
67
       background-repeat: no-repeat;
39
       background-repeat: no-repeat;
68
-      width: 573px;
69
       border-radius: 15px 0px 0px 15px;
40
       border-radius: 15px 0px 0px 15px;
70
       align-items: center;
41
       align-items: center;
71
       .left-image-1 {
42
       .left-image-1 {
75
         top: 22px;
46
         top: 22px;
76
       }
47
       }
77
       .left-viewText {
48
       .left-viewText {
78
-        width: auto;
79
-        height: 44.3px;
80
         position: absolute;
49
         position: absolute;
81
         left: 1px;
50
         left: 1px;
82
         top: 28px;
51
         top: 28px;
90
         border-radius: 24px;
59
         border-radius: 24px;
91
         overflow: hidden;
60
         overflow: hidden;
92
         position: relative;
61
         position: relative;
62
+        min-width: 144px;
93
 
63
 
94
         .image-1 {
64
         .image-1 {
95
           width: 144px;
65
           width: 144px;
96
           height: 144px;
66
           height: 144px;
97
-          margin: 0;
98
         }
67
         }
99
         .image-2 {
68
         .image-2 {
100
           width: 89px;
69
           width: 89px;
106
       }
75
       }
107
       // 商品标题
76
       // 商品标题
108
       .title-content {
77
       .title-content {
109
-        padding-left: 18px;
78
+        padding-left: 20px;
110
 
79
 
111
         .Pro-title {
80
         .Pro-title {
112
-          .title-text {
113
-            width: 375px;
114
-            overflow: hidden;
115
-            text-overflow: ellipsis;
116
-            //必须要
117
-            -webkit-line-clamp: 1;
118
-            -webkit-box-orient: vertical;
119
-             /* 多出文本省略号代替 */
120
-            text-align: left;
81
+          .cpn-card-text {
121
             font-size: 24px;
82
             font-size: 24px;
83
+            font-weight: 400;
84
+            color: #333333;
85
+            line-height: 40px;
86
+            vertical-align: baseline;
87
+            display: flex;
122
           }
88
           }
123
         }
89
         }
124
         .title-money {
90
         .title-money {
128
           margin: 15px auto;
94
           margin: 15px auto;
129
         }
95
         }
130
         .title-money-2 {
96
         .title-money-2 {
131
-          height: 19px;
132
           font-size: 20px;
97
           font-size: 20px;
133
           font-weight: 400;
98
           font-weight: 400;
134
           color: #333333;
99
           color: #333333;
135
-          padding-left: 50px;
100
+          padding-left: 20px;
136
           text-decoration: line-through;
101
           text-decoration: line-through;
137
         }
102
         }
138
 
103
 
180
         left;
145
         left;
181
     background-size: 100% 60%;
146
     background-size: 100% 60%;
182
     background-repeat: no-repeat;
147
     background-repeat: no-repeat;
183
-    width: 129px;
148
+    min-width: 130px;
184
     border-radius: 0 15px 15px 0;
149
     border-radius: 0 15px 15px 0;
185
-    position: relative;
186
-    //右面部分
187
-    .right-content {
188
-      height: 120px;
189
-      position: absolute;
190
-      top: 50%;
191
-      left: 50%;
192
-      transform: translate(-50%, -50%);
193
-
194
-      .right-image {
195
-        width: 36px;
196
-        height: 36px;
197
-        margin: 0 auto;
198
-        align-items: center;
199
-        margin: auto;
200
-        padding-left: 8px;
201
-      }
202
-
203
-      .right-title {
204
-        font-weight: 700;
205
-        font-size: 24px;
206
-        padding-top: 10px;
207
-        text-align: center;
208
-      }
209
-    }
210
   }
150
   }
211
   .Refund-content {
151
   .Refund-content {
212
-    width: 100%;
213
     margin-top: 45px;
152
     margin-top: 45px;
214
     .Refund-star-view1 {
153
     .Refund-star-view1 {
215
-      display: inline-block;
216
-      width: 295px;
217
-      height: 60px;
218
       border: 1px solid #999999;
154
       border: 1px solid #999999;
219
       border-radius: 30px;
155
       border-radius: 30px;
220
       font-size: 24px;
156
       font-size: 24px;
221
-      font-weight: bold;
222
-      color: #666666;
223
-      text-align: center;
224
-      line-height: 60px;
225
-    }
226
-    .Refund-star-view2 {
227
-      width: 198px;
228
-      height: 60px;
229
-      border: 1px solid #999999;
230
-      border-radius: 30px;
231
-      font-size: 24px;
232
-      font-weight: bold;
233
-      color: #666666;
234
-      text-align: center;
235
-      line-height: 60px;
236
-      display: inline-block;
237
-      margin-left: 30px;
238
-    }
239
-    .Refund-star-view3 {
240
-      margin: 30px auto;
241
       display: inline-block;
157
       display: inline-block;
242
-      width: 507px;
243
-      height: 60px;
244
-      border: 1px solid #999999;
245
-      border-radius: 30px;
246
-      font-size: 24px;
247
       font-weight: bold;
158
       font-weight: bold;
248
       color: #666666;
159
       color: #666666;
249
-      text-align: center;
250
-      line-height: 60px;
160
+      padding: 18px 23px 19px 23px;
161
+      margin-bottom: 30px;
251
     }
162
     }
252
-    .Refund-star-view4 {
253
-      display: inline-block;
254
-      width: 146px;
255
-      height: 60px;
256
-      background: #ffffff;
257
-      border-radius: 30px;
258
-      border: 1px solid #999999;
259
-      font-size: 24px;
260
-      font-weight: bold;
261
-      color: #666666;
262
-      text-align: center;
263
-      line-height: 60px;
264
-      margin-left: 30px;
265
-    }
266
-    .Refund-star-view5 {
267
-      display: inline-block;
268
-      width: 220px;
269
-      height: 60px;
270
-      background: #ffffff;
271
-      border-radius: 30px;
272
-      border: 1px solid #999999;
273
-      font-size: 24px;
274
-      font-weight: bold;
275
-      color: #666666;
276
-      text-align: center;
277
-      line-height: 60px;
278
-    }
279
-    .Refund-star-view6 {
280
-      display: inline-block;
281
-      width: 257px;
282
-      height: 60px;
283
-      background: #ffffff;
284
-      border-radius: 30px;
285
-      border: 1px solid #999999;
286
-      font-size: 24px;
287
-      font-weight: bold;
288
-      color: #666666;
289
-      text-align: center;
290
-      line-height: 60px;
291
-      margin-left: 30px;
163
+    .Refund-star-view2 {
164
+      margin-right: 30px;
292
     }
165
     }
293
     /* 点击以后的样式 */
166
     /* 点击以后的样式 */
294
     .bg2 {
167
     .bg2 {
295
       color: #274190;
168
       color: #274190;
169
+      margin-right: 30px;
296
       border: 2px solid #274190;
170
       border: 2px solid #274190;
297
     }
171
     }
298
   }
172
   }
299
 
173
 
300
   .section {
174
   .section {
301
-    height: 254px;
302
-    background: #ffffff;
303
     border: 1px solid #b5b5b5;
175
     border: 1px solid #b5b5b5;
176
+    font-size: 24px;
304
     box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.08);
177
     box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.08);
305
-    padding: 0 20px 0 20px;
178
+    padding: 30px;
306
     margin-top: 40px;
179
     margin-top: 40px;
307
-    textarea {
308
-      padding-top: 20px;
309
-      font-size: 24px;
310
-      font-weight: 400;
311
-      color: #666666;
312
-    }
313
   }
180
   }
314
 
181
 
315
   .money-title {
182
   .money-title {
316
     margin: 40px 0;
183
     margin: 40px 0;
317
-    padding-bottom: 20px;
184
+    padding: 30px 0;
318
     font-size: 30px;
185
     font-size: 30px;
319
     font-weight: bold;
186
     font-weight: bold;
320
     color: #202020;
187
     color: #202020;
321
-    background: #ffffff;
322
     box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.12);
188
     box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.12);
189
+    .money-name {
190
+      font-size: 30px;
191
+      color: #ff3434;
192
+    }
323
   }
193
   }
324
 
194
 
325
-  .money-name {
326
-    font-size: 30px;
327
-    font-weight: bold;
328
-    color: #ff3434;
329
-  }
195
+  
330
   .ul-li-text {
196
   .ul-li-text {
331
     .ul-li-view {
197
     .ul-li-view {
332
       display: inline-block;
198
       display: inline-block;
338
       border-radius: 50%;
204
       border-radius: 50%;
339
     }
205
     }
340
     .ul-li-textname {
206
     .ul-li-textname {
341
-      display: inline-block;
342
-      height: 19px;
343
       font-size: 20px;
207
       font-size: 20px;
344
-      font-weight: 400;
345
       color: #999999;
208
       color: #999999;
346
     }
209
     }
347
   }
210
   }
348
 
211
 
349
   .button-info {
212
   .button-info {
350
-    margin-bottom: 70px;
213
+    margin-bottom: 80px;
351
     .button-box {
214
     .button-box {
352
-      margin: 60px 0;
353
-      height: 88px;
354
-      line-height: 88px;
355
-      background: #274291;
215
+      margin-top: 60px;
216
+      height: 92px;
217
+      line-height: 92px;
218
+      background: #1A3B83;      
356
       border-radius: 12px;
219
       border-radius: 12px;
357
       color: @whiteColor;
220
       color: @whiteColor;
358
-      margin-bottom: 2em;
221
+      font-size: 30px;
222
+      letter-spacing: 0.1em;
359
     }
223
     }
360
   }
224
   }
361
 }
225
 }

+ 1
- 2
src/pages/MineUserAll/RefundMoney/style.less View File

1
 @whiteColor: #fff;
1
 @whiteColor: #fff;
2
 
2
 
3
 .box-content {
3
 .box-content {
4
-  padding: 0 30px;
5
   .View-box-Card {
4
   .View-box-Card {
6
-    margin: 30px 5px 0 5px;
5
+    margin: 30px 30px 0 30px;
7
     .foot {
6
     .foot {
8
       font-size: 28px;
7
       font-size: 28px;
9
       color: #c0c8d3;
8
       color: #c0c8d3;