默认提交
Showing
15 changed files
with
42 additions
and
90 deletions
... | @@ -63,12 +63,11 @@ input { | ... | @@ -63,12 +63,11 @@ input { |
63 | position: relative; | 63 | position: relative; |
64 | @extend .bb; | 64 | @extend .bb; |
65 | @extend .fcc; | 65 | @extend .fcc; |
66 | padding: 2px; | ||
67 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
68 | width: 482px; | 66 | width: 482px; |
69 | height: 62px; | 67 | height: 62px; |
70 | margin: 0 24px; | 68 | margin: 0 24px; |
71 | border-radius: $borderRadius; | 69 | @include border-tans($borderRadius); |
70 | |||
72 | 71 | ||
73 | .clarms-select { | 72 | .clarms-select { |
74 | width: 100%; | 73 | width: 100%; |
... | @@ -271,10 +270,8 @@ input { | ... | @@ -271,10 +270,8 @@ input { |
271 | .cont { | 270 | .cont { |
272 | @extend .bb; | 271 | @extend .bb; |
273 | @extend .fcc; | 272 | @extend .fcc; |
274 | padding: 2px; | ||
275 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
276 | height: 62px; | 273 | height: 62px; |
277 | border-radius: $borderRadius; | 274 | @include border-tans($borderRadius); |
278 | } | 275 | } |
279 | 276 | ||
280 | .ipt-date { | 277 | .ipt-date { | ... | ... |
... | @@ -24,19 +24,13 @@ | ... | @@ -24,19 +24,13 @@ |
24 | 24 | ||
25 | .border { | 25 | .border { |
26 | position: relative; | 26 | position: relative; |
27 | @extend .bb; | 27 | @include border-tans(20px); |
28 | @extend .fcc; | ||
29 | padding: 2px; | ||
30 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
31 | border-radius: 20px; | ||
32 | } | 28 | } |
33 | 29 | ||
34 | .modal { | 30 | .modal { |
35 | position: relative; | 31 | position: relative; |
36 | @extend .bb; | 32 | @extend .bb; |
37 | max-width: 1000px; | 33 | max-width: 1000px; |
38 | border-radius: 20px; | ||
39 | background-color: #ffffff; | ||
40 | 34 | ||
41 | .content { | 35 | .content { |
42 | display: flex; | 36 | display: flex; | ... | ... |
... | @@ -23,19 +23,13 @@ | ... | @@ -23,19 +23,13 @@ |
23 | 23 | ||
24 | .border { | 24 | .border { |
25 | position: relative; | 25 | position: relative; |
26 | @extend .bb; | 26 | @include border-tans(20px); |
27 | @extend .fcc; | ||
28 | padding: 2px; | ||
29 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
30 | border-radius: 20px; | ||
31 | } | 27 | } |
32 | 28 | ||
33 | .modal { | 29 | .modal { |
34 | position: relative; | 30 | position: relative; |
35 | @extend .bb; | 31 | @extend .bb; |
36 | max-width: 1000px; | 32 | max-width: 1000px; |
37 | border-radius: 20px; | ||
38 | background-color: #ffffff; | ||
39 | 33 | ||
40 | .content { | 34 | .content { |
41 | display: flex; | 35 | display: flex; | ... | ... |
... | @@ -8,9 +8,7 @@ $borderSize: 6px; | ... | @@ -8,9 +8,7 @@ $borderSize: 6px; |
8 | 8 | ||
9 | .clarms-container { | 9 | .clarms-container { |
10 | box-sizing: border-box; | 10 | box-sizing: border-box; |
11 | padding: 2px; | 11 | @include border-tans($borderRadius); |
12 | border-radius: $borderSize; | ||
13 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
14 | 12 | ||
15 | .clarms-box { | 13 | .clarms-box { |
16 | @extend .bb; | 14 | @extend .bb; |
... | @@ -27,19 +25,16 @@ $borderSize: 6px; | ... | @@ -27,19 +25,16 @@ $borderSize: 6px; |
27 | left: 98px; | 25 | left: 98px; |
28 | position: absolute; | 26 | position: absolute; |
29 | z-index: 11; | 27 | z-index: 11; |
30 | border-radius: 4px; | ||
31 | padding: 2px; | 28 | padding: 2px; |
32 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
33 | max-width: 400px; | 29 | max-width: 400px; |
30 | @include border-tans($borderRadius); | ||
34 | 31 | ||
35 | .cont { | 32 | .cont { |
36 | @extend .bb; | 33 | @extend .bb; |
37 | padding: 4px; | 34 | padding: 4px; |
38 | width: 100%; | 35 | width: 100%; |
39 | height: 100%; | 36 | height: 100%; |
40 | background-color: #ffffff; | ||
41 | font-size: 18px; | 37 | font-size: 18px; |
42 | border-radius: 4px; | ||
43 | } | 38 | } |
44 | } | 39 | } |
45 | 40 | ... | ... |
... | @@ -14,7 +14,6 @@ $borderRadius:6px; | ... | @@ -14,7 +14,6 @@ $borderRadius:6px; |
14 | color: $cFontGray2; | 14 | color: $cFontGray2; |
15 | } | 15 | } |
16 | 16 | ||
17 | |||
18 | .submit-btn { | 17 | .submit-btn { |
19 | background: url("~@assets/images/vhis/vhis-btn.png"); | 18 | background: url("~@assets/images/vhis/vhis-btn.png"); |
20 | background-size: 100% 100%; | 19 | background-size: 100% 100%; |
... | @@ -42,9 +41,7 @@ $borderRadius:6px; | ... | @@ -42,9 +41,7 @@ $borderRadius:6px; |
42 | margin: 1.666667rem auto 0 auto; | 41 | margin: 1.666667rem auto 0 auto; |
43 | letter-spacing: 1.1px; | 42 | letter-spacing: 1.1px; |
44 | 43 | ||
45 | span { | 44 | span {} |
46 | // margin: 0 .333333rem; | ||
47 | } | ||
48 | } | 45 | } |
49 | 46 | ||
50 | .default-mt { | 47 | .default-mt { |
... | @@ -116,13 +113,11 @@ $borderRadius:6px; | ... | @@ -116,13 +113,11 @@ $borderRadius:6px; |
116 | display: flex; | 113 | display: flex; |
117 | justify-content: center; | 114 | justify-content: center; |
118 | justify-content: space-between; | 115 | justify-content: space-between; |
119 | // padding: 0 $marginSmall; | ||
120 | margin-bottom: 32px; | 116 | margin-bottom: 32px; |
121 | 117 | ||
122 | .label { | 118 | .label { |
123 | display: flex; | 119 | display: flex; |
124 | align-items: center; | 120 | align-items: center; |
125 | // width: 30%; | ||
126 | width: 140px; | 121 | width: 140px; |
127 | justify-content: flex-start; | 122 | justify-content: flex-start; |
128 | padding-left: 5px; | 123 | padding-left: 5px; |
... | @@ -136,21 +131,16 @@ $borderRadius:6px; | ... | @@ -136,21 +131,16 @@ $borderRadius:6px; |
136 | 131 | ||
137 | .cont { | 132 | .cont { |
138 | @extend .bb; | 133 | @extend .bb; |
139 | @extend .fcc; | ||
140 | padding: 2px; | ||
141 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
142 | height: 52px; | 134 | height: 52px; |
143 | border-radius: $borderRadius; | 135 | border-radius: $borderRadius; |
136 | @include border-tans($borderRadius); | ||
144 | } | 137 | } |
145 | 138 | ||
146 | // input和下拉 | 139 | // input和下拉 |
147 | .ipt { | 140 | .ipt { |
148 | // border: 1px solid $cOrange !important; | ||
149 | border: none !important; | 141 | border: none !important; |
150 | border-radius: .416667rem; | 142 | border-radius: .416667rem; |
151 | height: 3rem; | 143 | height: 3rem; |
152 | // display: flex; | ||
153 | // align-items: center; | ||
154 | 144 | ||
155 | width: 100%; | 145 | width: 100%; |
156 | background-color: #ffffff; | 146 | background-color: #ffffff; | ... | ... |
... | @@ -28,19 +28,12 @@ | ... | @@ -28,19 +28,12 @@ |
28 | 28 | ||
29 | .border { | 29 | .border { |
30 | position: relative; | 30 | position: relative; |
31 | @extend .bb; | 31 | @include border-tans(20px); |
32 | @extend .fcc; | ||
33 | padding: 2px; | ||
34 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
35 | border-radius: 20px; | ||
36 | } | 32 | } |
37 | 33 | ||
38 | .modal { | 34 | .modal { |
39 | position: relative; | 35 | position: relative; |
40 | @extend .bb; | ||
41 | width: 1000px; | 36 | width: 1000px; |
42 | border-radius: 20px; | ||
43 | background-color: #ffffff; | ||
44 | 37 | ||
45 | .content { | 38 | .content { |
46 | display: flex; | 39 | display: flex; | ... | ... |
... | @@ -16,7 +16,7 @@ export default { | ... | @@ -16,7 +16,7 @@ export default { |
16 | hadLoadPolicy: false, | 16 | hadLoadPolicy: false, |
17 | ignorePolicyCodes: [], | 17 | ignorePolicyCodes: [], |
18 | // 显示 | 18 | // 显示 |
19 | policyDetail: null | 19 | policyDetail: {} |
20 | } | 20 | } |
21 | }, | 21 | }, |
22 | components: {}, | 22 | components: {}, | ... | ... |
1 | @import '@/styles/_support'; | 1 | @import '@/styles/_support'; |
2 | 2 | ||
3 | $borderRadius:6px; | ||
4 | |||
3 | .comp { | 5 | .comp { |
4 | position: fixed; | 6 | position: fixed; |
5 | top: 0; | 7 | top: 0; |
... | @@ -30,11 +32,7 @@ | ... | @@ -30,11 +32,7 @@ |
30 | 32 | ||
31 | .border { | 33 | .border { |
32 | position: relative; | 34 | position: relative; |
33 | @extend .bb; | 35 | @include border-tans(20px); |
34 | @extend .fcc; | ||
35 | padding: 2px; | ||
36 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
37 | border-radius: 20px; | ||
38 | } | 36 | } |
39 | 37 | ||
40 | .modal { | 38 | .modal { |
... | @@ -42,9 +40,7 @@ | ... | @@ -42,9 +40,7 @@ |
42 | @extend .bb; | 40 | @extend .bb; |
43 | width: 1200px; | 41 | width: 1200px; |
44 | max-height: 84vh; | 42 | max-height: 84vh; |
45 | border-radius: 20px; | 43 | padding: 88px 0 0; |
46 | background-color: #ffffff; | ||
47 | padding: 88px 0; | ||
48 | font-size: 22px; | 44 | font-size: 22px; |
49 | overflow-x: hidden; | 45 | overflow-x: hidden; |
50 | overflow-y: auto; | 46 | overflow-y: auto; |
... | @@ -74,6 +70,7 @@ | ... | @@ -74,6 +70,7 @@ |
74 | 70 | ||
75 | .bottom-wrap { | 71 | .bottom-wrap { |
76 | margin: 50px auto 0; | 72 | margin: 50px auto 0; |
73 | padding-bottom: 88px; | ||
77 | 74 | ||
78 | .notice { | 75 | .notice { |
79 | letter-spacing: 2.2px; | 76 | letter-spacing: 2.2px; |
... | @@ -142,28 +139,22 @@ | ... | @@ -142,28 +139,22 @@ |
142 | 139 | ||
143 | 140 | ||
144 | &-item { | 141 | &-item { |
145 | @extend .bb; | ||
146 | @extend .fcc; | 142 | @extend .fcc; |
147 | margin: 0 auto 24px; | 143 | margin: 0 auto 24px; |
148 | max-width: 602px; | 144 | max-width: 602px; |
149 | height: 67px; | 145 | height: 67px; |
150 | line-height: 67px; | 146 | line-height: 67px; |
151 | padding: 2px; | ||
152 | border-radius: 8px; | ||
153 | cursor: pointer; | 147 | cursor: pointer; |
154 | background-image: linear-gradient(to right, #ffb31d, #f15907); | 148 | @include border-tans($borderRadius); |
155 | 149 | ||
156 | .cont { | 150 | .cont { |
157 | @extend .bb; | ||
158 | display: flex; | 151 | display: flex; |
159 | align-items: center; | 152 | align-items: center; |
160 | justify-content: center; | 153 | justify-content: center; |
161 | width: 100%; | 154 | width: 100%; |
162 | height: 100%; | 155 | height: 100%; |
163 | background-color: #ffffff; | ||
164 | letter-spacing: 1.4px; | 156 | letter-spacing: 1.4px; |
165 | font-weight: bold; | 157 | font-weight: bold; |
166 | border-radius: 8px; | ||
167 | color: $cOrange2; | 158 | color: $cOrange2; |
168 | 159 | ||
169 | .icon { | 160 | .icon { |
... | @@ -364,3 +355,12 @@ | ... | @@ -364,3 +355,12 @@ |
364 | 355 | ||
365 | } | 356 | } |
366 | } | 357 | } |
358 | |||
359 | |||
360 | .comp::-webkit-scrollbar { | ||
361 | display: none; | ||
362 | } | ||
363 | |||
364 | .comp{ | ||
365 | -ms-overflow-style: none; | ||
366 | } | ... | ... |
... | @@ -52,6 +52,7 @@ | ... | @@ -52,6 +52,7 @@ |
52 | </div> | 52 | </div> |
53 | </div> | 53 | </div> |
54 | 54 | ||
55 | </div> | ||
55 | <div class="download"> | 56 | <div class="download"> |
56 | <div class="border2 download-item" @click="downloadPolicy"> | 57 | <div class="border2 download-item" @click="downloadPolicy"> |
57 | <div class="cont"> | 58 | <div class="cont"> |
... | @@ -60,7 +61,6 @@ | ... | @@ -60,7 +61,6 @@ |
60 | </div> | 61 | </div> |
61 | </div> | 62 | </div> |
62 | </div> | 63 | </div> |
63 | </div> | ||
64 | <hr class="line1"> | 64 | <hr class="line1"> |
65 | <div class="bottom-wrap "> | 65 | <div class="bottom-wrap "> |
66 | <div class="notice" :class="{'ltz':locale == 'en'}"> | 66 | <div class="notice" :class="{'ltz':locale == 'en'}"> | ... | ... |
... | @@ -10,21 +10,16 @@ $borderSize:6px; | ... | @@ -10,21 +10,16 @@ $borderSize:6px; |
10 | .content { | 10 | .content { |
11 | margin: 2.333333rem auto; | 11 | margin: 2.333333rem auto; |
12 | position: relative; | 12 | position: relative; |
13 | |||
14 | } | 13 | } |
15 | 14 | ||
16 | .clarms { | 15 | .clarms { |
17 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
18 | @extend .bb; | 16 | @extend .bb; |
19 | @extend .fcc; | 17 | @extend .fcc; |
20 | padding: 2px; | 18 | @include border-tans(20px); |
21 | border-radius: 20px; | ||
22 | 19 | ||
23 | &-cont { | 20 | &-cont { |
24 | width: 100%; | 21 | width: 100%; |
25 | height: 100%; | 22 | height: 100%; |
26 | background-color: #ffffff; | ||
27 | border-radius: 20px; | ||
28 | } | 23 | } |
29 | } | 24 | } |
30 | 25 | ||
... | @@ -34,7 +29,6 @@ input { | ... | @@ -34,7 +29,6 @@ input { |
34 | } | 29 | } |
35 | 30 | ||
36 | .orange { | 31 | .orange { |
37 | // color: $cOrange; | ||
38 | color: #ff6839; | 32 | color: #ff6839; |
39 | } | 33 | } |
40 | 34 | ||
... | @@ -42,10 +36,6 @@ input { | ... | @@ -42,10 +36,6 @@ input { |
42 | color: #747474; | 36 | color: #747474; |
43 | } | 37 | } |
44 | 38 | ||
45 | .border2 { | ||
46 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
47 | } | ||
48 | |||
49 | .navigate { | 39 | .navigate { |
50 | position: relative; | 40 | position: relative; |
51 | margin: 24px auto 48px; | 41 | margin: 24px auto 48px; |
... | @@ -54,7 +44,7 @@ input { | ... | @@ -54,7 +44,7 @@ input { |
54 | position: absolute; | 44 | position: absolute; |
55 | height: 13px; | 45 | height: 13px; |
56 | width: 100%; | 46 | width: 100%; |
57 | background-image: linear-gradient(to right, #ffb31d, #f15907); | 47 | background-image: linear-gradient(to right, #feab1b, #f15a08); |
58 | top: 32px; | 48 | top: 32px; |
59 | } | 49 | } |
60 | 50 | ||
... | @@ -92,9 +82,6 @@ input { | ... | @@ -92,9 +82,6 @@ input { |
92 | 82 | ||
93 | .reservation-container { | 83 | .reservation-container { |
94 | @extend .bb; | 84 | @extend .bb; |
95 | // border-radius: .666667rem; | ||
96 | // border: solid 2px $cOrange; | ||
97 | // padding: 2.666667rem 10rem 2.833333rem 10rem; | ||
98 | background-color: #ffffff; | 85 | background-color: #ffffff; |
99 | border-radius: 20px; | 86 | border-radius: 20px; |
100 | 87 | ... | ... |
... | @@ -35,7 +35,7 @@ export default { | ... | @@ -35,7 +35,7 @@ export default { |
35 | bannerCandidateList: [], | 35 | bannerCandidateList: [], |
36 | // 视频 | 36 | // 视频 |
37 | playerOptions: {}, | 37 | playerOptions: {}, |
38 | bannerTipsVisible: true, | 38 | bannerTipsVisible: false, |
39 | productList: [], | 39 | productList: [], |
40 | // 全部的信息 | 40 | // 全部的信息 |
41 | sourceData: {}, | 41 | sourceData: {}, | ... | ... |
... | @@ -219,20 +219,19 @@ $borderSize: 6px; | ... | @@ -219,20 +219,19 @@ $borderSize: 6px; |
219 | justify-content: space-between; | 219 | justify-content: space-between; |
220 | flex-wrap: wrap; | 220 | flex-wrap: wrap; |
221 | 221 | ||
222 | |||
222 | &-item { | 223 | &-item { |
223 | @extend .bb; | ||
224 | @extend .fcc; | 224 | @extend .fcc; |
225 | padding: 2px; | ||
226 | width: 582px; | 225 | width: 582px; |
227 | min-height: 250px; | 226 | min-height: 250px; |
228 | margin-bottom: 25px; | 227 | margin-bottom: 25px; |
228 | @include border-tans(); | ||
229 | 229 | ||
230 | .cont { | 230 | .cont { |
231 | display: flex; | 231 | display: flex; |
232 | text-align: left; | 232 | text-align: left; |
233 | width: 100%; | 233 | width: 100%; |
234 | height: 100%; | 234 | height: 100%; |
235 | background-color: #ffffff; | ||
236 | 235 | ||
237 | .icon-wrap { | 236 | .icon-wrap { |
238 | @extend .bb; | 237 | @extend .bb; |
... | @@ -357,7 +356,7 @@ $borderSize: 6px; | ... | @@ -357,7 +356,7 @@ $borderSize: 6px; |
357 | } | 356 | } |
358 | } | 357 | } |
359 | 358 | ||
360 | .tt2{ | 359 | .tt2 { |
361 | padding: 50px 64px 26px 50px; | 360 | padding: 50px 64px 26px 50px; |
362 | padding: 48px; | 361 | padding: 48px; |
363 | } | 362 | } |
... | @@ -461,9 +460,6 @@ $borderSize: 6px; | ... | @@ -461,9 +460,6 @@ $borderSize: 6px; |
461 | display: inline-block; | 460 | display: inline-block; |
462 | } | 461 | } |
463 | 462 | ||
464 | .border2 { | ||
465 | background-image: linear-gradient(to right, #ffb31d, #f15907); | ||
466 | } | ||
467 | 463 | ||
468 | // banner点点 | 464 | // banner点点 |
469 | .swiper-button-prev { | 465 | .swiper-button-prev { | ... | ... |
... | @@ -60,7 +60,7 @@ | ... | @@ -60,7 +60,7 @@ |
60 | <div class="box product"> | 60 | <div class="box product"> |
61 | <div class="tit">產品特點</div> | 61 | <div class="tit">產品特點</div> |
62 | <div class="prod"> | 62 | <div class="prod"> |
63 | <div v-for="(item,index) in productList" :key="item.id" class="border2 prod-item"> | 63 | <div v-for="(item,index) in productList" :key="item.id" class=" prod-item"> |
64 | <div class="cont"> | 64 | <div class="cont"> |
65 | <div class="icon-wrap"> | 65 | <div class="icon-wrap"> |
66 | <img :src="require('@/assets/images/vhis/vhis-icon'+(index+1)+'.png')"> | 66 | <img :src="require('@/assets/images/vhis/vhis-icon'+(index+1)+'.png')"> | ... | ... |
... | @@ -156,3 +156,11 @@ | ... | @@ -156,3 +156,11 @@ |
156 | box-sizing: border-box; | 156 | box-sizing: border-box; |
157 | padding: 0 $percent; | 157 | padding: 0 $percent; |
158 | } | 158 | } |
159 | |||
160 | @mixin border-tans($borderRadius:1px, $borderSize:2px) { | ||
161 | border: $borderSize solid transparent; | ||
162 | background-clip: padding-box, border-box; | ||
163 | background-origin: padding-box, border-box; | ||
164 | background-image: linear-gradient(90deg, #fff, #fff), linear-gradient(90deg, #feab1b, #f15a08); | ||
165 | border-radius: $borderRadius; | ||
166 | } | ... | ... |
-
Please register or sign in to post a comment