全部rem替换
Showing
57 changed files
with
1223 additions
and
725 deletions
| ... | @@ -113,6 +113,14 @@ module.exports = { | ... | @@ -113,6 +113,14 @@ module.exports = { |
| 113 | name: "Useful Forms", | 113 | name: "Useful Forms", |
| 114 | path: "/custom/service?q=m8" | 114 | path: "/custom/service?q=m8" |
| 115 | }, | 115 | }, |
| 116 | { | ||
| 117 | name: "eCorrespondence Enquiry", | ||
| 118 | path: "/custom/service?q=m9" | ||
| 119 | }, | ||
| 120 | { | ||
| 121 | name: "FAQ", | ||
| 122 | path: "/custom/service?q=m10" | ||
| 123 | }, | ||
| 116 | ] | 124 | ] |
| 117 | }, | 125 | }, |
| 118 | { | 126 | { |
| ... | @@ -739,7 +747,7 @@ module.exports = { | ... | @@ -739,7 +747,7 @@ module.exports = { |
| 739 | menu7: "Complaints", | 747 | menu7: "Complaints", |
| 740 | menu8: "Useful Forms", | 748 | menu8: "Useful Forms", |
| 741 | menu9: "eCorrespondence Enquiry", | 749 | menu9: "eCorrespondence Enquiry", |
| 742 | menu10: "常见问题", | 750 | menu10: "FAQ", |
| 743 | insuranceQuery: { | 751 | insuranceQuery: { |
| 744 | modify: "modify", | 752 | modify: "modify", |
| 745 | 753 | ... | ... |
| ... | @@ -113,6 +113,14 @@ module.exports = { | ... | @@ -113,6 +113,14 @@ module.exports = { |
| 113 | name: "常用表格", | 113 | name: "常用表格", |
| 114 | path: "/custom/service?q=m8" | 114 | path: "/custom/service?q=m8" |
| 115 | }, | 115 | }, |
| 116 | { | ||
| 117 | name: "電子通知書查詢", | ||
| 118 | path: "/custom/service?q=m9" | ||
| 119 | }, | ||
| 120 | { | ||
| 121 | name: "常見問題", | ||
| 122 | path: "/custom/service?q=m10" | ||
| 123 | }, | ||
| 116 | ] | 124 | ] |
| 117 | }, | 125 | }, |
| 118 | { | 126 | { | ... | ... |
| ... | @@ -113,6 +113,14 @@ module.exports = { | ... | @@ -113,6 +113,14 @@ module.exports = { |
| 113 | name: "常用表格", | 113 | name: "常用表格", |
| 114 | path: "/custom/service?q=m8" | 114 | path: "/custom/service?q=m8" |
| 115 | }, | 115 | }, |
| 116 | { | ||
| 117 | name: "电子通知书查询", | ||
| 118 | path: "/custom/service?q=m9" | ||
| 119 | }, | ||
| 120 | { | ||
| 121 | name: "常见问题", | ||
| 122 | path: "/custom/service?q=m10" | ||
| 123 | }, | ||
| 116 | ] | 124 | ] |
| 117 | }, | 125 | }, |
| 118 | { | 126 | { | ... | ... |
| ... | @@ -20,7 +20,7 @@ input { | ... | @@ -20,7 +20,7 @@ input { |
| 20 | 20 | ||
| 21 | .empty { | 21 | .empty { |
| 22 | flex: 1; | 22 | flex: 1; |
| 23 | height: 30rem; | 23 | height: 360px; |
| 24 | display: flex; | 24 | display: flex; |
| 25 | align-items: center; | 25 | align-items: center; |
| 26 | justify-content: center; | 26 | justify-content: center; |
| ... | @@ -50,7 +50,7 @@ input { | ... | @@ -50,7 +50,7 @@ input { |
| 50 | color: #ffffff; | 50 | color: #ffffff; |
| 51 | font-weight: 600; | 51 | font-weight: 600; |
| 52 | cursor: pointer; | 52 | cursor: pointer; |
| 53 | margin: 2.5rem auto; | 53 | margin: 30px auto; |
| 54 | text-align: center; | 54 | text-align: center; |
| 55 | border-radius: 50px; | 55 | border-radius: 50px; |
| 56 | } | 56 | } |
| ... | @@ -77,7 +77,7 @@ input { | ... | @@ -77,7 +77,7 @@ input { |
| 77 | z-index: 10; | 77 | z-index: 10; |
| 78 | position: absolute; | 78 | position: absolute; |
| 79 | top: 26px; | 79 | top: 26px; |
| 80 | right: 1.2rem; | 80 | right: 14.4px; |
| 81 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 81 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 82 | background-size: 100% 100%; | 82 | background-size: 100% 100%; |
| 83 | width: 15px; | 83 | width: 15px; |
| ... | @@ -104,7 +104,7 @@ input { | ... | @@ -104,7 +104,7 @@ input { |
| 104 | } | 104 | } |
| 105 | 105 | ||
| 106 | .title:lang(zh) { | 106 | .title:lang(zh) { |
| 107 | letter-spacing: .25rem; | 107 | letter-spacing: 3px; |
| 108 | } | 108 | } |
| 109 | 109 | ||
| 110 | .default-mt { | 110 | .default-mt { |
| ... | @@ -207,12 +207,10 @@ input { | ... | @@ -207,12 +207,10 @@ input { |
| 207 | @extend .text-jtf; | 207 | @extend .text-jtf; |
| 208 | 208 | ||
| 209 | span { | 209 | span { |
| 210 | // margin-left: 1.3rem; | ||
| 211 | margin-left: 24px; | 210 | margin-left: 24px; |
| 212 | } | 211 | } |
| 213 | 212 | ||
| 214 | img { | 213 | img { |
| 215 | // width: 1.3rem; | ||
| 216 | width: 22px; | 214 | width: 22px; |
| 217 | } | 215 | } |
| 218 | } | 216 | } |
| ... | @@ -233,12 +231,10 @@ input { | ... | @@ -233,12 +231,10 @@ input { |
| 233 | 231 | ||
| 234 | 232 | ||
| 235 | img { | 233 | img { |
| 236 | width: 2rem; | 234 | width: 24px; |
| 237 | } | 235 | } |
| 238 | 236 | ||
| 239 | span { | 237 | span { |
| 240 | // font-size: 1rem; | ||
| 241 | // font-size: 18px; | ||
| 242 | margin-left: 10px; | 238 | margin-left: 10px; |
| 243 | color: $cOrange2; | 239 | color: $cOrange2; |
| 244 | } | 240 | } |
| ... | @@ -323,7 +319,7 @@ input { | ... | @@ -323,7 +319,7 @@ input { |
| 323 | } | 319 | } |
| 324 | 320 | ||
| 325 | .label:lang(zh) { | 321 | .label:lang(zh) { |
| 326 | letter-spacing: .25rem; | 322 | letter-spacing: 3px; |
| 327 | } | 323 | } |
| 328 | 324 | ||
| 329 | .ipt-wrap { | 325 | .ipt-wrap { |
| ... | @@ -334,23 +330,23 @@ input { | ... | @@ -334,23 +330,23 @@ input { |
| 334 | .ipt { | 330 | .ipt { |
| 335 | border: 1px solid #ff6839 !important; | 331 | border: 1px solid #ff6839 !important; |
| 336 | border-radius: 5px; | 332 | border-radius: 5px; |
| 337 | height: 3rem; | 333 | height: 36px; |
| 338 | display: flex; | 334 | display: flex; |
| 339 | align-items: center; | 335 | align-items: center; |
| 340 | } | 336 | } |
| 341 | 337 | ||
| 342 | // 长文本 | 338 | // 长文本 |
| 343 | .textarea { | 339 | .textarea { |
| 344 | min-height: 8.75rem; | 340 | min-height: 105px; |
| 345 | @extend .bb; | 341 | @extend .bb; |
| 346 | padding: .75rem; | 342 | padding: 9px; |
| 347 | } | 343 | } |
| 348 | 344 | ||
| 349 | .down-arrow { | 345 | .down-arrow { |
| 350 | z-index: 10; | 346 | z-index: 10; |
| 351 | position: absolute; | 347 | position: absolute; |
| 352 | top: 1.3rem; | 348 | top: 15.6px; |
| 353 | right: 1.2rem; | 349 | right: 14.4px; |
| 354 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 350 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 355 | background-size: 100% 100%; | 351 | background-size: 100% 100%; |
| 356 | width: 15px; | 352 | width: 15px; |
| ... | @@ -362,16 +358,15 @@ input { | ... | @@ -362,16 +358,15 @@ input { |
| 362 | 358 | ||
| 363 | .validator { | 359 | .validator { |
| 364 | color: $cOrange2; | 360 | color: $cOrange2; |
| 365 | margin-top: 0.5rem; | 361 | margin-top: 6px; |
| 366 | position: absolute; | 362 | position: absolute; |
| 367 | right: 1rem; | 363 | right: 12px; |
| 368 | display: flex; | 364 | display: flex; |
| 369 | align-items: center; | 365 | align-items: center; |
| 370 | // bottom: 0; | ||
| 371 | 366 | ||
| 372 | img { | 367 | img { |
| 373 | display: inline-block; | 368 | display: inline-block; |
| 374 | margin-right: 0.4rem; | 369 | margin-right: 4.8px; |
| 375 | } | 370 | } |
| 376 | } | 371 | } |
| 377 | } | 372 | } |
| ... | @@ -381,8 +376,6 @@ input { | ... | @@ -381,8 +376,6 @@ input { |
| 381 | width: 100%; | 376 | width: 100%; |
| 382 | display: flex; | 377 | display: flex; |
| 383 | justify-content: flex-start; | 378 | justify-content: flex-start; |
| 384 | // padding: 0 $marginSmall; | ||
| 385 | // margin-bottom: 16px; | ||
| 386 | 379 | ||
| 387 | .label { | 380 | .label { |
| 388 | @extend .bb; | 381 | @extend .bb; |
| ... | @@ -393,20 +386,18 @@ input { | ... | @@ -393,20 +386,18 @@ input { |
| 393 | font-size: 20px; | 386 | font-size: 20px; |
| 394 | 387 | ||
| 395 | .main-label { | 388 | .main-label { |
| 396 | // font-size: 1.5rem; | ||
| 397 | font-size: 22px; | 389 | font-size: 22px; |
| 398 | color: $cOrange2; | 390 | color: $cOrange2; |
| 399 | } | 391 | } |
| 400 | } | 392 | } |
| 401 | 393 | ||
| 402 | .label:lang(zh) { | 394 | .label:lang(zh) { |
| 403 | letter-spacing: .25rem; | 395 | letter-spacing: 3px; |
| 404 | } | 396 | } |
| 405 | 397 | ||
| 406 | .date-container { | 398 | .date-container { |
| 407 | width: 60%; | 399 | width: 60%; |
| 408 | position: relative; | 400 | position: relative; |
| 409 | // background-color: wheat; | ||
| 410 | } | 401 | } |
| 411 | 402 | ||
| 412 | .value { | 403 | .value { |
| ... | @@ -419,34 +410,32 @@ input { | ... | @@ -419,34 +410,32 @@ input { |
| 419 | .ipt { | 410 | .ipt { |
| 420 | border: 1px solid #ff6839 !important; | 411 | border: 1px solid #ff6839 !important; |
| 421 | border-radius: 5px; | 412 | border-radius: 5px; |
| 422 | height: 3rem; | 413 | height: 36px; |
| 423 | display: flex; | 414 | display: flex; |
| 424 | align-items: center; | 415 | align-items: center; |
| 425 | } | 416 | } |
| 426 | 417 | ||
| 427 | .ipt2 { | 418 | .ipt2 { |
| 428 | // width: 100%; | ||
| 429 | border-bottom: 1px solid #ccc; | 419 | border-bottom: 1px solid #ccc; |
| 430 | height: 3rem; | 420 | height: 36px; |
| 431 | display: flex; | 421 | display: flex; |
| 432 | align-items: center; | 422 | align-items: center; |
| 433 | margin-bottom: 10px; | 423 | margin-bottom: 10px; |
| 434 | // width: 700px; | ||
| 435 | width: 100%; | 424 | width: 100%; |
| 436 | } | 425 | } |
| 437 | 426 | ||
| 438 | // 长文本 | 427 | // 长文本 |
| 439 | .textarea { | 428 | .textarea { |
| 440 | min-height: 8.75rem; | 429 | min-height: 105px; |
| 441 | @extend .bb; | 430 | @extend .bb; |
| 442 | padding: .75rem; | 431 | padding: 9px; |
| 443 | } | 432 | } |
| 444 | 433 | ||
| 445 | .down-arrow { | 434 | .down-arrow { |
| 446 | z-index: 10; | 435 | z-index: 10; |
| 447 | position: absolute; | 436 | position: absolute; |
| 448 | top: 26px; | 437 | top: 26px; |
| 449 | right: 1.2rem; | 438 | right: 14.4px; |
| 450 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 439 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 451 | background-size: 100% 100%; | 440 | background-size: 100% 100%; |
| 452 | width: 15px; | 441 | width: 15px; |
| ... | @@ -466,19 +455,19 @@ input { | ... | @@ -466,19 +455,19 @@ input { |
| 466 | 455 | ||
| 467 | 456 | ||
| 468 | .notice { | 457 | .notice { |
| 469 | margin-top: 4rem; | 458 | margin-top: 48px; |
| 470 | @extend .bb; | 459 | @extend .bb; |
| 471 | padding: 0 1rem; | 460 | padding: 0 12px; |
| 472 | 461 | ||
| 473 | &-item { | 462 | &-item { |
| 474 | position: relative; | 463 | position: relative; |
| 475 | line-height: 2; | 464 | line-height: 2; |
| 476 | margin-bottom: 1rem; | 465 | margin-bottom: 12px; |
| 477 | 466 | ||
| 478 | &-icon { | 467 | &-icon { |
| 479 | width: 14px; | 468 | width: 14px; |
| 480 | position: absolute; | 469 | position: absolute; |
| 481 | top: .6rem; | 470 | top: 7.2px; |
| 482 | } | 471 | } |
| 483 | } | 472 | } |
| 484 | 473 | ... | ... |
| ... | @@ -62,7 +62,7 @@ $borderSize: 6px; | ... | @@ -62,7 +62,7 @@ $borderSize: 6px; |
| 62 | } | 62 | } |
| 63 | 63 | ||
| 64 | .clarms-title-container { | 64 | .clarms-title-container { |
| 65 | // margin-left: 2.5rem; | 65 | // margin-left: 30px; |
| 66 | flex-grow: 1; | 66 | flex-grow: 1; |
| 67 | width: 100%; | 67 | width: 100%; |
| 68 | 68 | ||
| ... | @@ -160,21 +160,21 @@ $borderSize: 6px; | ... | @@ -160,21 +160,21 @@ $borderSize: 6px; |
| 160 | background-color: rgba($color: #000000, $alpha: .1); | 160 | background-color: rgba($color: #000000, $alpha: .1); |
| 161 | 161 | ||
| 162 | img { | 162 | img { |
| 163 | width: 2.5rem; | 163 | width: 30px; |
| 164 | height: 2.5rem; | 164 | height: 30px; |
| 165 | } | 165 | } |
| 166 | } | 166 | } |
| 167 | 167 | ||
| 168 | .mask-bg-2 { | 168 | .mask-bg-2 { |
| 169 | background-color: rgba($color: #000000, $alpha: .5) !important; | 169 | background-color: rgba($color: #000000, $alpha: .5) !important; |
| 170 | color: white !important; | 170 | color: white !important; |
| 171 | font-size: 1rem; | 171 | font-size: 12px; |
| 172 | line-height: initial; | 172 | line-height: initial; |
| 173 | } | 173 | } |
| 174 | } | 174 | } |
| 175 | 175 | ||
| 176 | .clarms-upload-tips { | 176 | .clarms-upload-tips { |
| 177 | font-size: 1rem; | 177 | font-size: 12px; |
| 178 | color: $cFontGray2; | 178 | color: $cFontGray2; |
| 179 | text-align: center; | 179 | text-align: center; |
| 180 | } | 180 | } |
| ... | @@ -229,7 +229,7 @@ $borderSize: 6px; | ... | @@ -229,7 +229,7 @@ $borderSize: 6px; |
| 229 | // } | 229 | // } |
| 230 | 230 | ||
| 231 | // .clarms-icon { | 231 | // .clarms-icon { |
| 232 | // width: 4.166667rem; | 232 | // width: 50px; |
| 233 | // } | 233 | // } |
| 234 | // } | 234 | // } |
| 235 | 235 | ||
| ... | @@ -255,10 +255,10 @@ $borderSize: 6px; | ... | @@ -255,10 +255,10 @@ $borderSize: 6px; |
| 255 | 255 | ||
| 256 | // @media (max-width: 500px) { | 256 | // @media (max-width: 500px) { |
| 257 | // .clarms-container .clarms-box .clarms-title-container .clarms-t1 { | 257 | // .clarms-container .clarms-box .clarms-title-container .clarms-t1 { |
| 258 | // font-size: 1rem; | 258 | // font-size: 12px; |
| 259 | // } | 259 | // } |
| 260 | 260 | ||
| 261 | // .clarms-container .clarms-box .clarms-title-container .clarms-t2 { | 261 | // .clarms-container .clarms-box .clarms-title-container .clarms-t2 { |
| 262 | // font-size: 1rem; | 262 | // font-size: 12px; |
| 263 | // } | 263 | // } |
| 264 | // } | 264 | // } | ... | ... |
| ... | @@ -104,7 +104,7 @@ $borderRadius:6px; | ... | @@ -104,7 +104,7 @@ $borderRadius:6px; |
| 104 | } | 104 | } |
| 105 | 105 | ||
| 106 | .ipt-date { | 106 | .ipt-date { |
| 107 | padding: 0 2rem; | 107 | padding: 0 24px; |
| 108 | width: 100%; | 108 | width: 100%; |
| 109 | background-color: #ffffff; | 109 | background-color: #ffffff; |
| 110 | height: 48px; | 110 | height: 48px; |
| ... | @@ -127,7 +127,7 @@ $borderRadius:6px; | ... | @@ -127,7 +127,7 @@ $borderRadius:6px; |
| 127 | } | 127 | } |
| 128 | 128 | ||
| 129 | .label:lang(zh) { | 129 | .label:lang(zh) { |
| 130 | letter-spacing: .25rem; | 130 | letter-spacing: 3px; |
| 131 | } | 131 | } |
| 132 | 132 | ||
| 133 | .ipt-wrap { | 133 | .ipt-wrap { |
| ... | @@ -146,7 +146,7 @@ $borderRadius:6px; | ... | @@ -146,7 +146,7 @@ $borderRadius:6px; |
| 146 | .ipt { | 146 | .ipt { |
| 147 | border: none !important; | 147 | border: none !important; |
| 148 | border-radius: 5px; | 148 | border-radius: 5px; |
| 149 | height: 3rem; | 149 | height: 36px; |
| 150 | 150 | ||
| 151 | width: 100%; | 151 | width: 100%; |
| 152 | background-color: #ffffff; | 152 | background-color: #ffffff; |
| ... | @@ -157,16 +157,16 @@ $borderRadius:6px; | ... | @@ -157,16 +157,16 @@ $borderRadius:6px; |
| 157 | 157 | ||
| 158 | // 长文本 | 158 | // 长文本 |
| 159 | .textarea { | 159 | .textarea { |
| 160 | min-height: 8.75rem; | 160 | min-height: 105px; |
| 161 | @extend .bb; | 161 | @extend .bb; |
| 162 | padding: .75rem; | 162 | padding: 9px; |
| 163 | } | 163 | } |
| 164 | 164 | ||
| 165 | .down-arrow { | 165 | .down-arrow { |
| 166 | z-index: 10; | 166 | z-index: 10; |
| 167 | position: absolute; | 167 | position: absolute; |
| 168 | top: 22px; | 168 | top: 22px; |
| 169 | right: 1.2rem; | 169 | right: 14.4px; |
| 170 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 170 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 171 | background-size: 100% 100%; | 171 | background-size: 100% 100%; |
| 172 | width: 15px; | 172 | width: 15px; |
| ... | @@ -178,16 +178,16 @@ $borderRadius:6px; | ... | @@ -178,16 +178,16 @@ $borderRadius:6px; |
| 178 | 178 | ||
| 179 | .validator { | 179 | .validator { |
| 180 | color: $cOrange2; | 180 | color: $cOrange2; |
| 181 | margin-top: 0.5rem; | 181 | margin-top: 6px; |
| 182 | position: absolute; | 182 | position: absolute; |
| 183 | right: 1rem; | 183 | right: 12px; |
| 184 | display: flex; | 184 | display: flex; |
| 185 | align-items: center; | 185 | align-items: center; |
| 186 | // bottom: 0; | 186 | // bottom: 0; |
| 187 | 187 | ||
| 188 | img { | 188 | img { |
| 189 | display: inline-block; | 189 | display: inline-block; |
| 190 | margin-right: 0.4rem; | 190 | margin-right: 4.8px; |
| 191 | } | 191 | } |
| 192 | } | 192 | } |
| 193 | } | 193 | } |
| ... | @@ -211,7 +211,7 @@ $borderRadius:6px; | ... | @@ -211,7 +211,7 @@ $borderRadius:6px; |
| 211 | } | 211 | } |
| 212 | 212 | ||
| 213 | .label:lang(zh) { | 213 | .label:lang(zh) { |
| 214 | letter-spacing: .25rem; | 214 | letter-spacing: 3px; |
| 215 | } | 215 | } |
| 216 | 216 | ||
| 217 | .date-container { | 217 | .date-container { |
| ... | @@ -229,7 +229,7 @@ $borderRadius:6px; | ... | @@ -229,7 +229,7 @@ $borderRadius:6px; |
| 229 | .ipt { | 229 | .ipt { |
| 230 | border: 1px solid $cOrange !important; | 230 | border: 1px solid $cOrange !important; |
| 231 | border-radius: 5px; | 231 | border-radius: 5px; |
| 232 | height: 3rem; | 232 | height: 36px; |
| 233 | display: flex; | 233 | display: flex; |
| 234 | align-items: center; | 234 | align-items: center; |
| 235 | } | 235 | } |
| ... | @@ -238,7 +238,7 @@ $borderRadius:6px; | ... | @@ -238,7 +238,7 @@ $borderRadius:6px; |
| 238 | .ipt2 { | 238 | .ipt2 { |
| 239 | width: 100%; | 239 | width: 100%; |
| 240 | border-bottom: 1px solid #ccc; | 240 | border-bottom: 1px solid #ccc; |
| 241 | height: 3rem; | 241 | height: 36px; |
| 242 | display: flex; | 242 | display: flex; |
| 243 | align-items: center; | 243 | align-items: center; |
| 244 | margin-bottom: 10px; | 244 | margin-bottom: 10px; |
| ... | @@ -246,16 +246,16 @@ $borderRadius:6px; | ... | @@ -246,16 +246,16 @@ $borderRadius:6px; |
| 246 | 246 | ||
| 247 | // 长文本 | 247 | // 长文本 |
| 248 | .textarea { | 248 | .textarea { |
| 249 | min-height: 8.75rem; | 249 | min-height: 105px; |
| 250 | @extend .bb; | 250 | @extend .bb; |
| 251 | padding: .75rem; | 251 | padding: 9px; |
| 252 | } | 252 | } |
| 253 | 253 | ||
| 254 | .down-arrow { | 254 | .down-arrow { |
| 255 | z-index: 10; | 255 | z-index: 10; |
| 256 | position: absolute; | 256 | position: absolute; |
| 257 | top: 22px; | 257 | top: 22px; |
| 258 | right: 1.2rem; | 258 | right: 14.4px; |
| 259 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 259 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 260 | background-size: 100% 100%; | 260 | background-size: 100% 100%; |
| 261 | width: 15px; | 261 | width: 15px; |
| ... | @@ -270,19 +270,19 @@ $borderRadius:6px; | ... | @@ -270,19 +270,19 @@ $borderRadius:6px; |
| 270 | 270 | ||
| 271 | 271 | ||
| 272 | .notice { | 272 | .notice { |
| 273 | margin-top: 4rem; | 273 | margin-top: 48px; |
| 274 | @extend .bb; | 274 | @extend .bb; |
| 275 | padding: 0 1rem; | 275 | padding: 0 12px; |
| 276 | 276 | ||
| 277 | &-item { | 277 | &-item { |
| 278 | position: relative; | 278 | position: relative; |
| 279 | line-height: 2; | 279 | line-height: 2; |
| 280 | margin-bottom: 1rem; | 280 | margin-bottom: 12px; |
| 281 | 281 | ||
| 282 | &-icon { | 282 | &-icon { |
| 283 | width: 14px; | 283 | width: 14px; |
| 284 | position: absolute; | 284 | position: absolute; |
| 285 | top: .6rem; | 285 | top: 7.2px; |
| 286 | } | 286 | } |
| 287 | } | 287 | } |
| 288 | 288 | ||
| ... | @@ -294,7 +294,7 @@ $borderRadius:6px; | ... | @@ -294,7 +294,7 @@ $borderRadius:6px; |
| 294 | 294 | ||
| 295 | @media (max-width: 1200px) { | 295 | @media (max-width: 1200px) { |
| 296 | .mobile-margin { | 296 | .mobile-margin { |
| 297 | margin-top: 2.5rem; | 297 | margin-top: 30px; |
| 298 | } | 298 | } |
| 299 | } | 299 | } |
| 300 | 300 | ||
| ... | @@ -323,7 +323,7 @@ $borderRadius:6px; | ... | @@ -323,7 +323,7 @@ $borderRadius:6px; |
| 323 | 323 | ||
| 324 | @media (max-width: 700px) { | 324 | @media (max-width: 700px) { |
| 325 | .reservation-container { | 325 | .reservation-container { |
| 326 | padding: 32px 2rem 34px 2rem; | 326 | padding: 32px 24px 34px 24px; |
| 327 | } | 327 | } |
| 328 | 328 | ||
| 329 | .form { | 329 | .form { | ... | ... |
| ... | @@ -21,8 +21,8 @@ | ... | @@ -21,8 +21,8 @@ |
| 21 | margin-left: 0px; | 21 | margin-left: 0px; |
| 22 | 22 | ||
| 23 | @extend .bb; | 23 | @extend .bb; |
| 24 | max-width: 37.5rem; | 24 | max-width: 450px; |
| 25 | min-width: 25rem; | 25 | min-width: 300px; |
| 26 | height: 320px; | 26 | height: 320px; |
| 27 | border-radius: $borderRadius; | 27 | border-radius: $borderRadius; |
| 28 | background-color: wheat; | 28 | background-color: wheat; |
| ... | @@ -142,19 +142,19 @@ | ... | @@ -142,19 +142,19 @@ |
| 142 | } | 142 | } |
| 143 | 143 | ||
| 144 | .ipt:lang(zh) { | 144 | .ipt:lang(zh) { |
| 145 | letter-spacing: .1rem; | 145 | letter-spacing: 1.2px; |
| 146 | } | 146 | } |
| 147 | 147 | ||
| 148 | // 长文本 | 148 | // 长文本 |
| 149 | .textarea { | 149 | .textarea { |
| 150 | min-height: 8.75rem; | 150 | min-height: 105px; |
| 151 | border-radius: 1rem; | 151 | border-radius: 12px; |
| 152 | } | 152 | } |
| 153 | 153 | ||
| 154 | .down-arrow { | 154 | .down-arrow { |
| 155 | position: absolute; | 155 | position: absolute; |
| 156 | top: 2.2rem; | 156 | top: 26.4px; |
| 157 | right: 2rem; | 157 | right: 24px; |
| 158 | } | 158 | } |
| 159 | 159 | ||
| 160 | 160 | ||
| ... | @@ -162,11 +162,11 @@ | ... | @@ -162,11 +162,11 @@ |
| 162 | @extend .fcc; | 162 | @extend .fcc; |
| 163 | // font-family: Arial; | 163 | // font-family: Arial; |
| 164 | font-size: 18px; | 164 | font-size: 18px; |
| 165 | width: 8.5rem; | 165 | width: 102px; |
| 166 | border: solid 1px #dcdddd; | 166 | border: solid 1px #dcdddd; |
| 167 | background-color: #f2f2f2; | 167 | background-color: #f2f2f2; |
| 168 | flex: none; | 168 | flex: none; |
| 169 | margin-left: 1.5rem; | 169 | margin-left: 18px; |
| 170 | color: $cFontGray; | 170 | color: $cFontGray; |
| 171 | } | 171 | } |
| 172 | 172 | ||
| ... | @@ -179,7 +179,7 @@ | ... | @@ -179,7 +179,7 @@ |
| 179 | 179 | ||
| 180 | .ipt-code { | 180 | .ipt-code { |
| 181 | flex: 1; | 181 | flex: 1; |
| 182 | padding-right: 1.75rem; | 182 | padding-right: 21px; |
| 183 | } | 183 | } |
| 184 | 184 | ||
| 185 | .veri-btn { | 185 | .veri-btn { | ... | ... |
| ... | @@ -2,14 +2,14 @@ | ... | @@ -2,14 +2,14 @@ |
| 2 | 2 | ||
| 3 | .drop-list { | 3 | .drop-list { |
| 4 | display: inline-block; | 4 | display: inline-block; |
| 5 | min-width: 10rem; | 5 | min-width: 120px; |
| 6 | position: relative; | 6 | position: relative; |
| 7 | margin: 0 1.1rem; | 7 | margin: 0 13.2px; |
| 8 | font-size: $fontSizeTitle; | 8 | font-size: $fontSizeTitle; |
| 9 | 9 | ||
| 10 | .list { | 10 | .list { |
| 11 | position: absolute; | 11 | position: absolute; |
| 12 | width: 11rem; | 12 | width: 132px; |
| 13 | left: 0; | 13 | left: 0; |
| 14 | right: 0; | 14 | right: 0; |
| 15 | margin: 0 auto; | 15 | margin: 0 auto; |
| ... | @@ -18,7 +18,7 @@ | ... | @@ -18,7 +18,7 @@ |
| 18 | transform: translateX(-50%); //居中处理 | 18 | transform: translateX(-50%); //居中处理 |
| 19 | 19 | ||
| 20 | .space { | 20 | .space { |
| 21 | height: 1.5rem; | 21 | height: 18px; |
| 22 | } | 22 | } |
| 23 | } | 23 | } |
| 24 | 24 | ||
| ... | @@ -32,19 +32,19 @@ | ... | @@ -32,19 +32,19 @@ |
| 32 | ul { | 32 | ul { |
| 33 | display: none; | 33 | display: none; |
| 34 | overflow: hidden; | 34 | overflow: hidden; |
| 35 | box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15); | 35 | box-shadow: 0 0 18px 0 rgba(255, 87, 0, 0.15); |
| 36 | border-radius: .5rem; | 36 | border-radius: 6px; |
| 37 | 37 | ||
| 38 | li { | 38 | li { |
| 39 | // border-bottom: solid 1px #f1f1f1; | 39 | // border-bottom: solid 1px #f1f1f1; |
| 40 | background: #ffffff; | 40 | background: #ffffff; |
| 41 | text-align: center; | 41 | text-align: center; |
| 42 | padding: 1.5rem 0; | 42 | padding: 18px 0; |
| 43 | position: relative; | 43 | position: relative; |
| 44 | 44 | ||
| 45 | &:after { | 45 | &:after { |
| 46 | content: ""; | 46 | content: ""; |
| 47 | width: 7rem; | 47 | width: 84px; |
| 48 | height: 1px; | 48 | height: 1px; |
| 49 | background: #f1f1f1; | 49 | background: #f1f1f1; |
| 50 | position: absolute; | 50 | position: absolute; |
| ... | @@ -74,9 +74,9 @@ | ... | @@ -74,9 +74,9 @@ |
| 74 | } | 74 | } |
| 75 | 75 | ||
| 76 | .user { | 76 | .user { |
| 77 | width: 9.25rem; | 77 | width: 111px; |
| 78 | height: 3rem; | 78 | height: 36px; |
| 79 | border-radius: 3rem; | 79 | border-radius: 36px; |
| 80 | background-color: $cOrange; | 80 | background-color: $cOrange; |
| 81 | display: flex; | 81 | display: flex; |
| 82 | align-items: center; | 82 | align-items: center; |
| ... | @@ -85,14 +85,14 @@ | ... | @@ -85,14 +85,14 @@ |
| 85 | margin: 0 auto; | 85 | margin: 0 auto; |
| 86 | 86 | ||
| 87 | span { | 87 | span { |
| 88 | max-width: 4.25rem; | 88 | max-width: 51px; |
| 89 | overflow: hidden; | 89 | overflow: hidden; |
| 90 | white-space: nowrap; | 90 | white-space: nowrap; |
| 91 | text-overflow: ellipsis; | 91 | text-overflow: ellipsis; |
| 92 | } | 92 | } |
| 93 | 93 | ||
| 94 | .icon-img { | 94 | .icon-img { |
| 95 | margin: 0 .5rem; | 95 | margin: 0 6px; |
| 96 | } | 96 | } |
| 97 | } | 97 | } |
| 98 | 98 | ... | ... |
| ... | @@ -27,16 +27,16 @@ | ... | @@ -27,16 +27,16 @@ |
| 27 | 27 | ||
| 28 | // 信息 | 28 | // 信息 |
| 29 | .info { | 29 | .info { |
| 30 | padding: 2rem 0 2rem; | 30 | padding: 24px 0 24px; |
| 31 | display: flex; | 31 | display: flex; |
| 32 | 32 | ||
| 33 | // 热线 | 33 | // 热线 |
| 34 | .hotline { | 34 | .hotline { |
| 35 | min-width: 24.5rem; | 35 | min-width: 294px; |
| 36 | 36 | ||
| 37 | .contact { | 37 | .contact { |
| 38 | .n-item { | 38 | .n-item { |
| 39 | margin-bottom: 0.6rem; | 39 | margin-bottom: 7.2px; |
| 40 | } | 40 | } |
| 41 | 41 | ||
| 42 | .phone { | 42 | .phone { |
| ... | @@ -46,7 +46,7 @@ | ... | @@ -46,7 +46,7 @@ |
| 46 | } | 46 | } |
| 47 | 47 | ||
| 48 | &:first-child { | 48 | &:first-child { |
| 49 | margin-bottom: 2rem; | 49 | margin-bottom: 24px; |
| 50 | } | 50 | } |
| 51 | } | 51 | } |
| 52 | } | 52 | } |
| ... | @@ -59,7 +59,7 @@ | ... | @@ -59,7 +59,7 @@ |
| 59 | 59 | ||
| 60 | .n-item { | 60 | .n-item { |
| 61 | cursor: pointer; | 61 | cursor: pointer; |
| 62 | min-width: 14.75rem; | 62 | min-width: 177px; |
| 63 | } | 63 | } |
| 64 | } | 64 | } |
| 65 | 65 | ||
| ... | @@ -71,11 +71,11 @@ | ... | @@ -71,11 +71,11 @@ |
| 71 | .public { | 71 | .public { |
| 72 | position: relative; | 72 | position: relative; |
| 73 | text-align: left; | 73 | text-align: left; |
| 74 | margin-left: 5.32rem; | 74 | margin-left: 63.84px; |
| 75 | 75 | ||
| 76 | .qrcode-wrap { | 76 | .qrcode-wrap { |
| 77 | text-align: center; | 77 | text-align: center; |
| 78 | margin-top: 0.3rem; | 78 | margin-top: 3.6px; |
| 79 | 79 | ||
| 80 | 80 | ||
| 81 | .qrcode { | 81 | .qrcode { |
| ... | @@ -83,21 +83,21 @@ | ... | @@ -83,21 +83,21 @@ |
| 83 | } | 83 | } |
| 84 | 84 | ||
| 85 | .c1 { | 85 | .c1 { |
| 86 | margin-top: 0.3rem; | 86 | margin-top: 3.6px; |
| 87 | } | 87 | } |
| 88 | } | 88 | } |
| 89 | 89 | ||
| 90 | .icon { | 90 | .icon { |
| 91 | margin-top: .75rem; | 91 | margin-top: 9px; |
| 92 | margin-right: 1rem; | 92 | margin-right: 12px; |
| 93 | display: inline-block; | 93 | display: inline-block; |
| 94 | } | 94 | } |
| 95 | } | 95 | } |
| 96 | 96 | ||
| 97 | // 公共组件 | 97 | // 公共组件 |
| 98 | .n-item { | 98 | .n-item { |
| 99 | margin-bottom: 2rem; | 99 | margin-bottom: 24px; |
| 100 | padding-right: 3rem ; | 100 | padding-right: 36px; |
| 101 | color: #dcdddd; | 101 | color: #dcdddd; |
| 102 | 102 | ||
| 103 | &:first-child { | 103 | &:first-child { |
| ... | @@ -113,7 +113,7 @@ | ... | @@ -113,7 +113,7 @@ |
| 113 | // 版权 | 113 | // 版权 |
| 114 | .copyright { | 114 | .copyright { |
| 115 | color: rgba(179, 177, 168, 0.5); | 115 | color: rgba(179, 177, 168, 0.5); |
| 116 | padding: 1.5rem 0; | 116 | padding: 18px 0; |
| 117 | line-height: 1.58; | 117 | line-height: 1.58; |
| 118 | font-size: $fontSizeSmall; | 118 | font-size: $fontSizeSmall; |
| 119 | } | 119 | } |
| ... | @@ -135,7 +135,7 @@ | ... | @@ -135,7 +135,7 @@ |
| 135 | .hotline {} | 135 | .hotline {} |
| 136 | 136 | ||
| 137 | .nav { | 137 | .nav { |
| 138 | margin-top: 2rem; | 138 | margin-top: 24px; |
| 139 | display: flex; | 139 | display: flex; |
| 140 | 140 | ||
| 141 | .nav-v { | 141 | .nav-v { |
| ... | @@ -155,15 +155,15 @@ | ... | @@ -155,15 +155,15 @@ |
| 155 | 155 | ||
| 156 | .public { | 156 | .public { |
| 157 | margin: 0; | 157 | margin: 0; |
| 158 | margin-top: 3rem; | 158 | margin-top: 36px; |
| 159 | text-align: left; | 159 | text-align: left; |
| 160 | min-height: 12rem; | 160 | min-height: 144px; |
| 161 | } | 161 | } |
| 162 | } | 162 | } |
| 163 | 163 | ||
| 164 | .copyright { | 164 | .copyright { |
| 165 | box-sizing: border-box; | 165 | box-sizing: border-box; |
| 166 | padding-right: 2rem; | 166 | padding-right: 24px; |
| 167 | } | 167 | } |
| 168 | } | 168 | } |
| 169 | } | 169 | } |
| ... | @@ -204,11 +204,11 @@ | ... | @@ -204,11 +204,11 @@ |
| 204 | 204 | ||
| 205 | .public { | 205 | .public { |
| 206 | margin: 0; | 206 | margin: 0; |
| 207 | min-width: 9rem; | 207 | min-width: 108px; |
| 208 | 208 | ||
| 209 | .qrcode-wrap { | 209 | .qrcode-wrap { |
| 210 | img { | 210 | img { |
| 211 | width: 7rem; | 211 | width: 84px; |
| 212 | } | 212 | } |
| 213 | 213 | ||
| 214 | .c1 { | 214 | .c1 { |
| ... | @@ -219,10 +219,10 @@ | ... | @@ -219,10 +219,10 @@ |
| 219 | 219 | ||
| 220 | // 公共组件 | 220 | // 公共组件 |
| 221 | .n-item { | 221 | .n-item { |
| 222 | margin-bottom: 2rem; | 222 | margin-bottom: 24px; |
| 223 | 223 | ||
| 224 | &:first-child { | 224 | &:first-child { |
| 225 | margin-bottom: 2rem; | 225 | margin-bottom: 24px; |
| 226 | } | 226 | } |
| 227 | } | 227 | } |
| 228 | } | 228 | } | ... | ... |
| 1 | @import '@/styles/_support.scss'; | 1 | @import '@/styles/_support.scss'; |
| 2 | 2 | ||
| 3 | $navHei: 7.666667rem; | 3 | $navHei: 92px; |
| 4 | $navHeiM: 6rem; | 4 | $navHeiM: 72px; |
| 5 | 5 | ||
| 6 | .v-header { | 6 | .v-header { |
| 7 | height: $navHei; | 7 | height: $navHei; |
| ... | @@ -26,8 +26,8 @@ $navHeiM: 6rem; | ... | @@ -26,8 +26,8 @@ $navHeiM: 6rem; |
| 26 | } | 26 | } |
| 27 | 27 | ||
| 28 | .logo-img { | 28 | .logo-img { |
| 29 | margin-right: 3.6rem; | 29 | margin-right: 43.2px; |
| 30 | max-width: 17.75rem; | 30 | max-width: 213px; |
| 31 | cursor: pointer; | 31 | cursor: pointer; |
| 32 | } | 32 | } |
| 33 | 33 | ||
| ... | @@ -57,7 +57,7 @@ $navHeiM: 6rem; | ... | @@ -57,7 +57,7 @@ $navHeiM: 6rem; |
| 57 | 57 | ||
| 58 | .nav-item.link-item { | 58 | .nav-item.link-item { |
| 59 | padding: 0 50px; | 59 | padding: 0 50px; |
| 60 | height: 5rem; | 60 | height: 60px; |
| 61 | } | 61 | } |
| 62 | 62 | ||
| 63 | .nav-item.search { | 63 | .nav-item.search { |
| ... | @@ -69,7 +69,7 @@ $navHeiM: 6rem; | ... | @@ -69,7 +69,7 @@ $navHeiM: 6rem; |
| 69 | 69 | ||
| 70 | .lang { | 70 | .lang { |
| 71 | color: $cOrange; | 71 | color: $cOrange; |
| 72 | min-width: 8rem; | 72 | min-width: 96px; |
| 73 | } | 73 | } |
| 74 | } | 74 | } |
| 75 | } | 75 | } |
| ... | @@ -108,7 +108,7 @@ $navHeiM: 6rem; | ... | @@ -108,7 +108,7 @@ $navHeiM: 6rem; |
| 108 | @media (max-width: 1100px) { | 108 | @media (max-width: 1100px) { |
| 109 | .v-header { | 109 | .v-header { |
| 110 | .logo-img { | 110 | .logo-img { |
| 111 | margin-right: 2rem; | 111 | margin-right: 24px; |
| 112 | } | 112 | } |
| 113 | } | 113 | } |
| 114 | 114 | ||
| ... | @@ -136,7 +136,7 @@ $navHeiM: 6rem; | ... | @@ -136,7 +136,7 @@ $navHeiM: 6rem; |
| 136 | .main-nav {} | 136 | .main-nav {} |
| 137 | 137 | ||
| 138 | .logo-img { | 138 | .logo-img { |
| 139 | max-width: 17.75rem; | 139 | max-width: 213px; |
| 140 | margin: 0; | 140 | margin: 0; |
| 141 | } | 141 | } |
| 142 | 142 | ||
| ... | @@ -166,7 +166,7 @@ $navHeiM: 6rem; | ... | @@ -166,7 +166,7 @@ $navHeiM: 6rem; |
| 166 | height: $navHeight-M; | 166 | height: $navHeight-M; |
| 167 | 167 | ||
| 168 | .logo-img { | 168 | .logo-img { |
| 169 | width: 15.5rem; | 169 | width: 186px; |
| 170 | margin: 0; | 170 | margin: 0; |
| 171 | } | 171 | } |
| 172 | 172 | ... | ... |
| ... | @@ -23,14 +23,14 @@ | ... | @@ -23,14 +23,14 @@ |
| 23 | .modal { | 23 | .modal { |
| 24 | position: relative; | 24 | position: relative; |
| 25 | @extend .bb; | 25 | @extend .bb; |
| 26 | width: 46.25rem; | 26 | width: 555px; |
| 27 | height: 28.5rem; | 27 | height: 342px; |
| 28 | border-radius: 1.25rem; | 28 | border-radius: 15px; |
| 29 | background-color: #ffffff; | 29 | background-color: #ffffff; |
| 30 | padding: 4.5rem 2rem 2.5rem; | 30 | padding: 54px 24px 30px; |
| 31 | 31 | ||
| 32 | &-title { | 32 | &-title { |
| 33 | margin-bottom: 3rem; | 33 | margin-bottom: 36px; |
| 34 | color: $cOrange; | 34 | color: $cOrange; |
| 35 | font-size: $fontSizeTitle; | 35 | font-size: $fontSizeTitle; |
| 36 | font-weight: bold; | 36 | font-weight: bold; |
| ... | @@ -38,11 +38,11 @@ | ... | @@ -38,11 +38,11 @@ |
| 38 | 38 | ||
| 39 | &-icon-wrap { | 39 | &-icon-wrap { |
| 40 | @extend .fcc; | 40 | @extend .fcc; |
| 41 | height: 12rem; | 41 | height: 144px; |
| 42 | } | 42 | } |
| 43 | 43 | ||
| 44 | &-content { | 44 | &-content { |
| 45 | margin-top: 1rem; | 45 | margin-top: 12px; |
| 46 | color: $cOrange; | 46 | color: $cOrange; |
| 47 | font-size: $fontSizeTitle; | 47 | font-size: $fontSizeTitle; |
| 48 | font-weight: bold; | 48 | font-weight: bold; |
| ... | @@ -53,8 +53,8 @@ | ... | @@ -53,8 +53,8 @@ |
| 53 | justify-content: center; | 53 | justify-content: center; |
| 54 | 54 | ||
| 55 | .btn { | 55 | .btn { |
| 56 | @include btc2(12rem, 3.6rem, 16px); | 56 | @include btc2(144px, 43.2px, 16px); |
| 57 | margin: 3rem 1rem 0; | 57 | margin: 36px 12px 0; |
| 58 | @extend .pointer; | 58 | @extend .pointer; |
| 59 | } | 59 | } |
| 60 | } | 60 | } |
| ... | @@ -78,17 +78,17 @@ | ... | @@ -78,17 +78,17 @@ |
| 78 | 78 | ||
| 79 | @media (max-width: 768px) { | 79 | @media (max-width: 768px) { |
| 80 | .modal { | 80 | .modal { |
| 81 | // height: 28.5rem; | 81 | width: 90%; |
| 82 | width: 90%; | ||
| 83 | height: auto; | 82 | height: auto; |
| 84 | 83 | ||
| 85 | &-title { | 84 | &-title { |
| 86 | margin-bottom: 1rem; | 85 | margin-bottom: 12px; |
| 87 | } | 86 | } |
| 88 | 87 | ||
| 89 | &-icon-wrap { | 88 | &-icon-wrap { |
| 90 | height: 10rem; | 89 | height: 120px; |
| 91 | img{ | 90 | |
| 91 | img { | ||
| 92 | height: 100%; | 92 | height: 100%; |
| 93 | } | 93 | } |
| 94 | } | 94 | } | ... | ... |
| ... | @@ -22,8 +22,8 @@ | ... | @@ -22,8 +22,8 @@ |
| 22 | 22 | ||
| 23 | .modal { | 23 | .modal { |
| 24 | position: relative; | 24 | position: relative; |
| 25 | width: 45.5rem; | 25 | width: 546px; |
| 26 | min-height: 18.25rem; | 26 | min-height: 219px; |
| 27 | border-radius: $borderRadius; | 27 | border-radius: $borderRadius; |
| 28 | background-color: #ffffff; | 28 | background-color: #ffffff; |
| 29 | 29 | ||
| ... | @@ -34,23 +34,23 @@ | ... | @@ -34,23 +34,23 @@ |
| 34 | @include ellipsis(1); | 34 | @include ellipsis(1); |
| 35 | font-size: $fontSizeTitle; | 35 | font-size: $fontSizeTitle; |
| 36 | font-weight: bold; | 36 | font-weight: bold; |
| 37 | height: 5rem; | 37 | height: 60px; |
| 38 | line-height: 5rem; | 38 | line-height: 60px; |
| 39 | // font-weight: bold; | 39 | // font-weight: bold; |
| 40 | background-color: #f2f2f2; | 40 | background-color: #f2f2f2; |
| 41 | text-align: left; | 41 | text-align: left; |
| 42 | padding: 0 3rem; | 42 | padding: 0 36px; |
| 43 | 43 | ||
| 44 | .close-btn { | 44 | .close-btn { |
| 45 | position: absolute; | 45 | position: absolute; |
| 46 | top: 2rem; | 46 | top: 24px; |
| 47 | right: 2rem; | 47 | right: 24px; |
| 48 | } | 48 | } |
| 49 | } | 49 | } |
| 50 | 50 | ||
| 51 | &-icon-wrap { | 51 | &-icon-wrap { |
| 52 | @extend .fcc; | 52 | @extend .fcc; |
| 53 | height: 12rem; | 53 | height: 144px; |
| 54 | } | 54 | } |
| 55 | 55 | ||
| 56 | &-content { | 56 | &-content { |
| ... | @@ -58,8 +58,8 @@ | ... | @@ -58,8 +58,8 @@ |
| 58 | @extend .bb; | 58 | @extend .bb; |
| 59 | font-size: $fontSize; | 59 | font-size: $fontSize; |
| 60 | font-weight: bold; | 60 | font-weight: bold; |
| 61 | min-height: 13.25rem; | 61 | min-height: 159px; |
| 62 | padding: $marginMedium-M 3rem; | 62 | padding: $marginMedium-M 36px; |
| 63 | } | 63 | } |
| 64 | 64 | ||
| 65 | &-btn-wrap { | 65 | &-btn-wrap { |
| ... | @@ -67,8 +67,8 @@ | ... | @@ -67,8 +67,8 @@ |
| 67 | justify-content: center; | 67 | justify-content: center; |
| 68 | 68 | ||
| 69 | .btn { | 69 | .btn { |
| 70 | @include btc2(12rem, 3.6rem, 16px); | 70 | @include btc2(144px, 43.2px, 16px); |
| 71 | margin: 3rem 1rem 0; | 71 | margin: 36px 12px 0; |
| 72 | @extend .pointer; | 72 | @extend .pointer; |
| 73 | } | 73 | } |
| 74 | } | 74 | } |
| ... | @@ -99,7 +99,7 @@ | ... | @@ -99,7 +99,7 @@ |
| 99 | &-title {} | 99 | &-title {} |
| 100 | 100 | ||
| 101 | &-icon-wrap { | 101 | &-icon-wrap { |
| 102 | height: 10rem; | 102 | height: 120px; |
| 103 | 103 | ||
| 104 | img { | 104 | img { |
| 105 | height: 100%; | 105 | height: 100%; | ... | ... |
| ... | @@ -23,8 +23,8 @@ | ... | @@ -23,8 +23,8 @@ |
| 23 | .modal { | 23 | .modal { |
| 24 | @extend .bb; | 24 | @extend .bb; |
| 25 | position: relative; | 25 | position: relative; |
| 26 | width: 45.5rem; | 26 | width: 546px; |
| 27 | min-height: 23.25rem; | 27 | min-height: 279px; |
| 28 | border-radius: $borderRadius; | 28 | border-radius: $borderRadius; |
| 29 | background-color: #ffffff; | 29 | background-color: #ffffff; |
| 30 | padding-bottom: $marginMedium-M; | 30 | padding-bottom: $marginMedium-M; |
| ... | @@ -37,23 +37,22 @@ | ... | @@ -37,23 +37,22 @@ |
| 37 | @include ellipsis(1); | 37 | @include ellipsis(1); |
| 38 | font-size: $fontSizeTitle; | 38 | font-size: $fontSizeTitle; |
| 39 | font-weight: bold; | 39 | font-weight: bold; |
| 40 | height: 5rem; | 40 | height: 60px; |
| 41 | line-height: 5rem; | 41 | line-height: 60px; |
| 42 | // font-weight: bold; | ||
| 43 | background-color: #f2f2f2; | 42 | background-color: #f2f2f2; |
| 44 | text-align: left; | 43 | text-align: left; |
| 45 | padding: 0 3rem; | 44 | padding: 0 36px; |
| 46 | 45 | ||
| 47 | .close-btn { | 46 | .close-btn { |
| 48 | position: absolute; | 47 | position: absolute; |
| 49 | top: 2rem; | 48 | top: 24px; |
| 50 | right: 2rem; | 49 | right: 24px; |
| 51 | } | 50 | } |
| 52 | } | 51 | } |
| 53 | 52 | ||
| 54 | &-icon-wrap { | 53 | &-icon-wrap { |
| 55 | @extend .fcc; | 54 | @extend .fcc; |
| 56 | height: 12rem; | 55 | height: 144px; |
| 57 | } | 56 | } |
| 58 | 57 | ||
| 59 | &-content { | 58 | &-content { |
| ... | @@ -61,8 +60,8 @@ | ... | @@ -61,8 +60,8 @@ |
| 61 | @extend .bb; | 60 | @extend .bb; |
| 62 | font-size: $fontSize; | 61 | font-size: $fontSize; |
| 63 | font-weight: bold; | 62 | font-weight: bold; |
| 64 | min-height: 13.25rem; | 63 | min-height: 159px; |
| 65 | padding: $marginMedium-M 3rem; | 64 | padding: $marginMedium-M 36px; |
| 66 | 65 | ||
| 67 | .upload { | 66 | .upload { |
| 68 | display: flex; | 67 | display: flex; |
| ... | @@ -72,12 +71,12 @@ | ... | @@ -72,12 +71,12 @@ |
| 72 | 71 | ||
| 73 | &-item { | 72 | &-item { |
| 74 | padding: 0 $marginSmallHalf; | 73 | padding: 0 $marginSmallHalf; |
| 75 | max-width: 15.583333rem ; | 74 | max-width: 187px ; |
| 76 | 75 | ||
| 77 | img { | 76 | img { |
| 78 | width: 100%; | 77 | width: 100%; |
| 79 | max-width: 14.75rem; | 78 | max-width: 177px; |
| 80 | max-height: 10rem; | 79 | max-height: 120px; |
| 81 | } | 80 | } |
| 82 | } | 81 | } |
| 83 | } | 82 | } |
| ... | @@ -88,8 +87,8 @@ | ... | @@ -88,8 +87,8 @@ |
| 88 | justify-content: center; | 87 | justify-content: center; |
| 89 | 88 | ||
| 90 | .btn { | 89 | .btn { |
| 91 | @include btc2(12rem, 3.6rem, 16px); | 90 | @include btc2(144px, 43.2px, 16px); |
| 92 | margin: 0 1rem 0; | 91 | margin: 0 12px 0; |
| 93 | @extend .pointer; | 92 | @extend .pointer; |
| 94 | } | 93 | } |
| 95 | } | 94 | } |
| ... | @@ -118,7 +117,7 @@ | ... | @@ -118,7 +117,7 @@ |
| 118 | &-title {} | 117 | &-title {} |
| 119 | 118 | ||
| 120 | &-icon-wrap { | 119 | &-icon-wrap { |
| 121 | height: 10rem; | 120 | height: 120px; |
| 122 | 121 | ||
| 123 | img { | 122 | img { |
| 124 | height: 100%; | 123 | height: 100%; | ... | ... |
| ... | @@ -10,7 +10,7 @@ | ... | @@ -10,7 +10,7 @@ |
| 10 | 10 | ||
| 11 | &-item { | 11 | &-item { |
| 12 | @extend .bb; | 12 | @extend .bb; |
| 13 | padding: 0 .8rem; | 13 | padding: 0 9.6px; |
| 14 | display: flex; | 14 | display: flex; |
| 15 | justify-content: center; | 15 | justify-content: center; |
| 16 | align-items: center; | 16 | align-items: center; |
| ... | @@ -18,7 +18,7 @@ | ... | @@ -18,7 +18,7 @@ |
| 18 | } | 18 | } |
| 19 | 19 | ||
| 20 | span { | 20 | span { |
| 21 | margin: 0.4rem 0.7rem; | 21 | margin: 4.8px 8.4px; |
| 22 | text-align: center; | 22 | text-align: center; |
| 23 | } | 23 | } |
| 24 | 24 | ||
| ... | @@ -26,8 +26,8 @@ | ... | @@ -26,8 +26,8 @@ |
| 26 | @extend .fcc; | 26 | @extend .fcc; |
| 27 | @extend .bb; | 27 | @extend .bb; |
| 28 | padding: 0 4px; | 28 | padding: 0 4px; |
| 29 | min-width: 2.25rem; | 29 | min-width: 27px; |
| 30 | height: 2.5rem; | 30 | height: 30px; |
| 31 | border: solid 1px #dcdddd; | 31 | border: solid 1px #dcdddd; |
| 32 | text-align: center; | 32 | text-align: center; |
| 33 | cursor: pointer; | 33 | cursor: pointer; |
| ... | @@ -52,10 +52,10 @@ | ... | @@ -52,10 +52,10 @@ |
| 52 | 52 | ||
| 53 | .ipt { | 53 | .ipt { |
| 54 | @extend .bb; | 54 | @extend .bb; |
| 55 | width: 5rem; | 55 | width: 60px; |
| 56 | height: 2.5rem; | 56 | height: 30px; |
| 57 | border: solid 1px #dcdddd; | 57 | border: solid 1px #dcdddd; |
| 58 | padding: 0 .7rem; | 58 | padding: 0 8.4px; |
| 59 | text-align: center; | 59 | text-align: center; |
| 60 | } | 60 | } |
| 61 | 61 | ... | ... |
| ... | @@ -204,11 +204,11 @@ $borderRadius:6px; | ... | @@ -204,11 +204,11 @@ $borderRadius:6px; |
| 204 | } | 204 | } |
| 205 | 205 | ||
| 206 | .default-mt { | 206 | .default-mt { |
| 207 | margin-top: 2.2rem; | 207 | margin-top: 26.4px; |
| 208 | } | 208 | } |
| 209 | 209 | ||
| 210 | .half-mt { | 210 | .half-mt { |
| 211 | margin-top: 1rem; | 211 | margin-top: 12px; |
| 212 | } | 212 | } |
| 213 | 213 | ||
| 214 | .btn-wrap { | 214 | .btn-wrap { | ... | ... |
| ... | @@ -71,13 +71,13 @@ input { | ... | @@ -71,13 +71,13 @@ input { |
| 71 | background: url("~@assets/images/vhis/vhis-btn.png"); | 71 | background: url("~@assets/images/vhis/vhis-btn.png"); |
| 72 | background-size: 100% 100%; | 72 | background-size: 100% 100%; |
| 73 | background-repeat: no-repeat; | 73 | background-repeat: no-repeat; |
| 74 | width: 15rem; | 74 | width: 180px; |
| 75 | height: 2.5rem; | 75 | height: 30px; |
| 76 | line-height: 2.5rem; | 76 | line-height: 30px; |
| 77 | color: white; | 77 | color: white; |
| 78 | font-weight: 600; | 78 | font-weight: 600; |
| 79 | cursor: pointer; | 79 | cursor: pointer; |
| 80 | margin: 2.5rem auto; | 80 | margin: 30px auto; |
| 81 | text-align: center; | 81 | text-align: center; |
| 82 | } | 82 | } |
| 83 | 83 | ||
| ... | @@ -140,7 +140,7 @@ input { | ... | @@ -140,7 +140,7 @@ input { |
| 140 | margin: 20px auto 0 auto; | 140 | margin: 20px auto 0 auto; |
| 141 | 141 | ||
| 142 | select { | 142 | select { |
| 143 | padding: 0 1.25rem; | 143 | padding: 0 15px; |
| 144 | border: none; | 144 | border: none; |
| 145 | border-bottom: 1px solid #666666; | 145 | border-bottom: 1px solid #666666; |
| 146 | color: #666666; | 146 | color: #666666; |
| ... | @@ -152,7 +152,7 @@ input { | ... | @@ -152,7 +152,7 @@ input { |
| 152 | } | 152 | } |
| 153 | 153 | ||
| 154 | .submit-btn { | 154 | .submit-btn { |
| 155 | margin: 2.5rem auto 1rem; | 155 | margin: 30px auto 12px; |
| 156 | } | 156 | } |
| 157 | 157 | ||
| 158 | .flex-top { | 158 | .flex-top { |
| ... | @@ -171,7 +171,7 @@ input { | ... | @@ -171,7 +171,7 @@ input { |
| 171 | .check-item { | 171 | .check-item { |
| 172 | display: flex; | 172 | display: flex; |
| 173 | align-items: center; | 173 | align-items: center; |
| 174 | margin-right: 2rem; | 174 | margin-right: 24px; |
| 175 | margin-bottom: 10px; | 175 | margin-bottom: 10px; |
| 176 | 176 | ||
| 177 | span { | 177 | span { |
| ... | @@ -210,7 +210,7 @@ input { | ... | @@ -210,7 +210,7 @@ input { |
| 210 | 210 | ||
| 211 | .tip { | 211 | .tip { |
| 212 | color: $cOrange; | 212 | color: $cOrange; |
| 213 | font-size: 1rem; | 213 | font-size: 12px; |
| 214 | margin-top: 10px; | 214 | margin-top: 10px; |
| 215 | text-align: center; | 215 | text-align: center; |
| 216 | width: 100px; | 216 | width: 100px; |
| ... | @@ -262,17 +262,17 @@ input { | ... | @@ -262,17 +262,17 @@ input { |
| 262 | align-items: center; | 262 | align-items: center; |
| 263 | 263 | ||
| 264 | span { | 264 | span { |
| 265 | margin-left: 1.3rem; | 265 | margin-left: 15.6px; |
| 266 | } | 266 | } |
| 267 | 267 | ||
| 268 | img { | 268 | img { |
| 269 | width: 1.3rem; | 269 | width: 15.6px; |
| 270 | } | 270 | } |
| 271 | } | 271 | } |
| 272 | 272 | ||
| 273 | hr { | 273 | hr { |
| 274 | border-top: 1px solid #eee; | 274 | border-top: 1px solid #eee; |
| 275 | margin-top: 2.5rem; | 275 | margin-top: 30px; |
| 276 | } | 276 | } |
| 277 | 277 | ||
| 278 | .tips { | 278 | .tips { |
| ... | @@ -285,7 +285,7 @@ input { | ... | @@ -285,7 +285,7 @@ input { |
| 285 | } | 285 | } |
| 286 | 286 | ||
| 287 | span { | 287 | span { |
| 288 | font-size: 1rem; | 288 | font-size: 12px; |
| 289 | margin-left: 10px; | 289 | margin-left: 10px; |
| 290 | color: $cOrange; | 290 | color: $cOrange; |
| 291 | } | 291 | } |
| ... | @@ -317,7 +317,7 @@ input { | ... | @@ -317,7 +317,7 @@ input { |
| 317 | width: 100%; | 317 | width: 100%; |
| 318 | border: 1px solid $cOrange !important; | 318 | border: 1px solid $cOrange !important; |
| 319 | border-radius: 5px; | 319 | border-radius: 5px; |
| 320 | height: 3rem; | 320 | height: 36px; |
| 321 | align-items: center; | 321 | align-items: center; |
| 322 | padding-left: 10px; | 322 | padding-left: 10px; |
| 323 | } | 323 | } |
| ... | @@ -339,7 +339,7 @@ input { | ... | @@ -339,7 +339,7 @@ input { |
| 339 | } | 339 | } |
| 340 | 340 | ||
| 341 | .label:lang(zh) { | 341 | .label:lang(zh) { |
| 342 | letter-spacing: .25rem; | 342 | letter-spacing: 3px; |
| 343 | } | 343 | } |
| 344 | 344 | ||
| 345 | 345 | ||
| ... | @@ -351,23 +351,23 @@ input { | ... | @@ -351,23 +351,23 @@ input { |
| 351 | .ipt { | 351 | .ipt { |
| 352 | border: 1px solid $cOrange !important; | 352 | border: 1px solid $cOrange !important; |
| 353 | border-radius: 5px; | 353 | border-radius: 5px; |
| 354 | height: 3rem; | 354 | height: 36px; |
| 355 | display: flex; | 355 | display: flex; |
| 356 | align-items: center; | 356 | align-items: center; |
| 357 | } | 357 | } |
| 358 | 358 | ||
| 359 | // 长文本 | 359 | // 长文本 |
| 360 | .textarea { | 360 | .textarea { |
| 361 | min-height: 8.75rem; | 361 | min-height: 105px; |
| 362 | @extend .bb; | 362 | @extend .bb; |
| 363 | padding: .75rem; | 363 | padding: 9px; |
| 364 | } | 364 | } |
| 365 | 365 | ||
| 366 | .down-arrow { | 366 | .down-arrow { |
| 367 | z-index: 10; | 367 | z-index: 10; |
| 368 | position: absolute; | 368 | position: absolute; |
| 369 | top: 1.3rem; | 369 | top: 15.6px; |
| 370 | right: 1.2rem; | 370 | right: 14.4px; |
| 371 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 371 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 372 | background-size: 100% 100%; | 372 | background-size: 100% 100%; |
| 373 | width: 7.6px; | 373 | width: 7.6px; |
| ... | @@ -379,16 +379,16 @@ input { | ... | @@ -379,16 +379,16 @@ input { |
| 379 | 379 | ||
| 380 | .validator { | 380 | .validator { |
| 381 | color: $cOrange; | 381 | color: $cOrange; |
| 382 | margin-top: 0.5rem; | 382 | margin-top: 6px; |
| 383 | position: absolute; | 383 | position: absolute; |
| 384 | right: 1rem; | 384 | right: 12px; |
| 385 | display: flex; | 385 | display: flex; |
| 386 | align-items: center; | 386 | align-items: center; |
| 387 | // bottom: 0; | 387 | // bottom: 0; |
| 388 | 388 | ||
| 389 | img { | 389 | img { |
| 390 | display: inline-block; | 390 | display: inline-block; |
| 391 | margin-right: 0.4rem; | 391 | margin-right: 4.8px; |
| 392 | } | 392 | } |
| 393 | } | 393 | } |
| 394 | } | 394 | } |
| ... | @@ -412,7 +412,7 @@ input { | ... | @@ -412,7 +412,7 @@ input { |
| 412 | } | 412 | } |
| 413 | 413 | ||
| 414 | .label:lang(zh) { | 414 | .label:lang(zh) { |
| 415 | letter-spacing: .25rem; | 415 | letter-spacing: 3px; |
| 416 | } | 416 | } |
| 417 | 417 | ||
| 418 | .date-container { | 418 | .date-container { |
| ... | @@ -430,7 +430,7 @@ input { | ... | @@ -430,7 +430,7 @@ input { |
| 430 | .ipt { | 430 | .ipt { |
| 431 | border: 1px solid $cOrange !important; | 431 | border: 1px solid $cOrange !important; |
| 432 | border-radius: 5px; | 432 | border-radius: 5px; |
| 433 | height: 3rem; | 433 | height: 36px; |
| 434 | display: flex; | 434 | display: flex; |
| 435 | align-items: center; | 435 | align-items: center; |
| 436 | } | 436 | } |
| ... | @@ -439,7 +439,7 @@ input { | ... | @@ -439,7 +439,7 @@ input { |
| 439 | .ipt2 { | 439 | .ipt2 { |
| 440 | width: 100%; | 440 | width: 100%; |
| 441 | border-bottom: 1px solid #ccc; | 441 | border-bottom: 1px solid #ccc; |
| 442 | height: 3rem; | 442 | height: 36px; |
| 443 | display: flex; | 443 | display: flex; |
| 444 | align-items: center; | 444 | align-items: center; |
| 445 | margin-bottom: 10px; | 445 | margin-bottom: 10px; |
| ... | @@ -447,16 +447,16 @@ input { | ... | @@ -447,16 +447,16 @@ input { |
| 447 | 447 | ||
| 448 | // 长文本 | 448 | // 长文本 |
| 449 | .textarea { | 449 | .textarea { |
| 450 | min-height: 8.75rem; | 450 | min-height: 105px; |
| 451 | @extend .bb; | 451 | @extend .bb; |
| 452 | padding: .75rem; | 452 | padding: 9px; |
| 453 | } | 453 | } |
| 454 | 454 | ||
| 455 | .down-arrow { | 455 | .down-arrow { |
| 456 | z-index: 10; | 456 | z-index: 10; |
| 457 | position: absolute; | 457 | position: absolute; |
| 458 | top: 1.3rem; | 458 | top: 15.6px; |
| 459 | right: 1.2rem; | 459 | right: 14.4px; |
| 460 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 460 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 461 | background-size: 100% 100%; | 461 | background-size: 100% 100%; |
| 462 | width: 7.6px; | 462 | width: 7.6px; |
| ... | @@ -471,25 +471,25 @@ input { | ... | @@ -471,25 +471,25 @@ input { |
| 471 | 471 | ||
| 472 | 472 | ||
| 473 | .notice { | 473 | .notice { |
| 474 | margin-top: 4rem; | 474 | margin-top: 48px; |
| 475 | @extend .bb; | 475 | @extend .bb; |
| 476 | padding: 0 1rem; | 476 | padding: 0 12px; |
| 477 | 477 | ||
| 478 | &-item { | 478 | &-item { |
| 479 | position: relative; | 479 | position: relative; |
| 480 | line-height: 2; | 480 | line-height: 2; |
| 481 | 481 | ||
| 482 | margin-bottom: 1rem; | 482 | margin-bottom: 12px; |
| 483 | 483 | ||
| 484 | &-icon { | 484 | &-icon { |
| 485 | width: 14px; | 485 | width: 14px; |
| 486 | position: absolute; | 486 | position: absolute; |
| 487 | top: .6rem; | 487 | top: 7.2px; |
| 488 | } | 488 | } |
| 489 | } | 489 | } |
| 490 | 490 | ||
| 491 | &-item:lang(zh) { | 491 | &-item:lang(zh) { |
| 492 | letter-spacing: .25rem; | 492 | letter-spacing: 3px; |
| 493 | } | 493 | } |
| 494 | } | 494 | } |
| 495 | 495 | ||
| ... | @@ -526,7 +526,7 @@ input { | ... | @@ -526,7 +526,7 @@ input { |
| 526 | 526 | ||
| 527 | // @media (max-width: 600px) { | 527 | // @media (max-width: 600px) { |
| 528 | // .reservation-container { | 528 | // .reservation-container { |
| 529 | // padding: 32px 2rem 34px 2rem; | 529 | // padding: 32px 24px 34px 24px; |
| 530 | // } | 530 | // } |
| 531 | 531 | ||
| 532 | // .form { | 532 | // .form { |
| ... | @@ -582,6 +582,6 @@ input { | ... | @@ -582,6 +582,6 @@ input { |
| 582 | 582 | ||
| 583 | // @media (max-width: 400px) { | 583 | // @media (max-width: 400px) { |
| 584 | // .reservation-container-2 { | 584 | // .reservation-container-2 { |
| 585 | // // padding: 20px 1rem; | 585 | // // padding: 20px 12px; |
| 586 | // } | 586 | // } |
| 587 | // } | 587 | // } | ... | ... |
| ... | @@ -2,12 +2,12 @@ | ... | @@ -2,12 +2,12 @@ |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | position: relative; | 4 | position: relative; |
| 5 | padding-bottom: 2.5rem; | 5 | padding-bottom: 30px; |
| 6 | // font-family: MicrosoftYaHei; | 6 | // font-family: MicrosoftYaHei; |
| 7 | } | 7 | } |
| 8 | 8 | ||
| 9 | .top-space { | 9 | .top-space { |
| 10 | height: 2.5rem; | 10 | height: 30px; |
| 11 | } | 11 | } |
| 12 | 12 | ||
| 13 | .box { | 13 | .box { |
| ... | @@ -40,7 +40,7 @@ | ... | @@ -40,7 +40,7 @@ |
| 40 | cursor: pointer; | 40 | cursor: pointer; |
| 41 | 41 | ||
| 42 | .icon-wrap { | 42 | .icon-wrap { |
| 43 | height: 11rem; | 43 | height: 132px; |
| 44 | @extend .fcc; | 44 | @extend .fcc; |
| 45 | } | 45 | } |
| 46 | 46 | ||
| ... | @@ -66,7 +66,7 @@ | ... | @@ -66,7 +66,7 @@ |
| 66 | .product { | 66 | .product { |
| 67 | &-item { | 67 | &-item { |
| 68 | width: 45%; | 68 | width: 45%; |
| 69 | height: 15rem; | 69 | height: 180px; |
| 70 | } | 70 | } |
| 71 | } | 71 | } |
| 72 | 72 | ... | ... |
| ... | @@ -18,13 +18,13 @@ input { | ... | @@ -18,13 +18,13 @@ input { |
| 18 | background: url("~@assets/images/vhis/vhis-btn.png"); | 18 | background: url("~@assets/images/vhis/vhis-btn.png"); |
| 19 | background-size: 100% 100%; | 19 | background-size: 100% 100%; |
| 20 | background-repeat: no-repeat; | 20 | background-repeat: no-repeat; |
| 21 | width: 15rem; | 21 | width: 180px; |
| 22 | height: 2.5rem; | 22 | height: 30px; |
| 23 | line-height: 2.5rem; | 23 | line-height: 30px; |
| 24 | color: white; | 24 | color: white; |
| 25 | font-weight: 600; | 25 | font-weight: 600; |
| 26 | cursor: pointer; | 26 | cursor: pointer; |
| 27 | margin: 2.5rem auto; | 27 | margin: 30px auto; |
| 28 | text-align: center; | 28 | text-align: center; |
| 29 | } | 29 | } |
| 30 | 30 | ||
| ... | @@ -34,7 +34,7 @@ input { | ... | @@ -34,7 +34,7 @@ input { |
| 34 | border-radius: 8px; | 34 | border-radius: 8px; |
| 35 | border: solid 1px $cOrange; | 35 | border: solid 1px $cOrange; |
| 36 | background-color: #ffffff; | 36 | background-color: #ffffff; |
| 37 | padding: 32px 10rem 34px 10rem; | 37 | padding: 32px 120px 34px 120px; |
| 38 | min-height: 500px; | 38 | min-height: 500px; |
| 39 | 39 | ||
| 40 | .title { | 40 | .title { |
| ... | @@ -82,7 +82,7 @@ input { | ... | @@ -82,7 +82,7 @@ input { |
| 82 | border-radius: 8px; | 82 | border-radius: 8px; |
| 83 | border: solid 1px $cOrange; | 83 | border: solid 1px $cOrange; |
| 84 | background-color: #ffffff; | 84 | background-color: #ffffff; |
| 85 | padding: 20px 10rem 34px 10rem; | 85 | padding: 20px 120px 34px 120px; |
| 86 | 86 | ||
| 87 | .title { | 87 | .title { |
| 88 | font-size: 16px; | 88 | font-size: 16px; |
| ... | @@ -91,7 +91,7 @@ input { | ... | @@ -91,7 +91,7 @@ input { |
| 91 | margin: 20px auto 0 auto; | 91 | margin: 20px auto 0 auto; |
| 92 | 92 | ||
| 93 | select { | 93 | select { |
| 94 | padding: 0 1.25rem; | 94 | padding: 0 15px; |
| 95 | border: none; | 95 | border: none; |
| 96 | border-bottom: 1px solid #666666; | 96 | border-bottom: 1px solid #666666; |
| 97 | color: #666666; | 97 | color: #666666; |
| ... | @@ -103,7 +103,7 @@ input { | ... | @@ -103,7 +103,7 @@ input { |
| 103 | } | 103 | } |
| 104 | 104 | ||
| 105 | .submit-btn { | 105 | .submit-btn { |
| 106 | margin: 2.5rem auto 1rem; | 106 | margin: 30px auto 12px; |
| 107 | } | 107 | } |
| 108 | 108 | ||
| 109 | .flex-top { | 109 | .flex-top { |
| ... | @@ -122,7 +122,7 @@ input { | ... | @@ -122,7 +122,7 @@ input { |
| 122 | .check-item { | 122 | .check-item { |
| 123 | display: flex; | 123 | display: flex; |
| 124 | align-items: center; | 124 | align-items: center; |
| 125 | margin-right: 2rem; | 125 | margin-right: 24px; |
| 126 | margin-bottom: 10px; | 126 | margin-bottom: 10px; |
| 127 | 127 | ||
| 128 | span { | 128 | span { |
| ... | @@ -161,7 +161,7 @@ input { | ... | @@ -161,7 +161,7 @@ input { |
| 161 | 161 | ||
| 162 | .tip { | 162 | .tip { |
| 163 | color: $cOrange; | 163 | color: $cOrange; |
| 164 | font-size: 1rem; | 164 | font-size: 12px; |
| 165 | margin-top: 10px; | 165 | margin-top: 10px; |
| 166 | text-align: center; | 166 | text-align: center; |
| 167 | width: 100px; | 167 | width: 100px; |
| ... | @@ -213,17 +213,17 @@ input { | ... | @@ -213,17 +213,17 @@ input { |
| 213 | align-items: center; | 213 | align-items: center; |
| 214 | 214 | ||
| 215 | span { | 215 | span { |
| 216 | margin-left: 1.3rem; | 216 | margin-left: 15.6px; |
| 217 | } | 217 | } |
| 218 | 218 | ||
| 219 | img { | 219 | img { |
| 220 | width: 1.3rem; | 220 | width: 15.6px; |
| 221 | } | 221 | } |
| 222 | } | 222 | } |
| 223 | 223 | ||
| 224 | hr { | 224 | hr { |
| 225 | border-top: 1px solid #eee; | 225 | border-top: 1px solid #eee; |
| 226 | margin-top: 2.5rem; | 226 | margin-top: 30px; |
| 227 | } | 227 | } |
| 228 | 228 | ||
| 229 | .tips { | 229 | .tips { |
| ... | @@ -236,7 +236,7 @@ input { | ... | @@ -236,7 +236,7 @@ input { |
| 236 | } | 236 | } |
| 237 | 237 | ||
| 238 | span { | 238 | span { |
| 239 | font-size: 1rem; | 239 | font-size: 12px; |
| 240 | margin-left: 10px; | 240 | margin-left: 10px; |
| 241 | color: $cOrange; | 241 | color: $cOrange; |
| 242 | } | 242 | } |
| ... | @@ -268,7 +268,7 @@ input { | ... | @@ -268,7 +268,7 @@ input { |
| 268 | width: 100%; | 268 | width: 100%; |
| 269 | border: 1px solid $cOrange !important; | 269 | border: 1px solid $cOrange !important; |
| 270 | border-radius: 5px; | 270 | border-radius: 5px; |
| 271 | height: 3rem; | 271 | height: 36px; |
| 272 | align-items: center; | 272 | align-items: center; |
| 273 | padding-left: 10px; | 273 | padding-left: 10px; |
| 274 | } | 274 | } |
| ... | @@ -289,7 +289,7 @@ input { | ... | @@ -289,7 +289,7 @@ input { |
| 289 | } | 289 | } |
| 290 | 290 | ||
| 291 | .label:lang(zh) { | 291 | .label:lang(zh) { |
| 292 | letter-spacing: .25rem; | 292 | letter-spacing: 3px; |
| 293 | } | 293 | } |
| 294 | 294 | ||
| 295 | .ipt-wrap { | 295 | .ipt-wrap { |
| ... | @@ -300,23 +300,23 @@ input { | ... | @@ -300,23 +300,23 @@ input { |
| 300 | .ipt { | 300 | .ipt { |
| 301 | border: 1px solid $cOrange !important; | 301 | border: 1px solid $cOrange !important; |
| 302 | border-radius: 5px; | 302 | border-radius: 5px; |
| 303 | height: 3rem; | 303 | height: 36px; |
| 304 | display: flex; | 304 | display: flex; |
| 305 | align-items: center; | 305 | align-items: center; |
| 306 | } | 306 | } |
| 307 | 307 | ||
| 308 | // 长文本 | 308 | // 长文本 |
| 309 | .textarea { | 309 | .textarea { |
| 310 | min-height: 8.75rem; | 310 | min-height: 105px; |
| 311 | @extend .bb; | 311 | @extend .bb; |
| 312 | padding: .75rem; | 312 | padding: 9px; |
| 313 | } | 313 | } |
| 314 | 314 | ||
| 315 | .down-arrow { | 315 | .down-arrow { |
| 316 | z-index: 10; | 316 | z-index: 10; |
| 317 | position: absolute; | 317 | position: absolute; |
| 318 | top: 1.3rem; | 318 | top: 15.6px; |
| 319 | right: 1.2rem; | 319 | right: 14.4px; |
| 320 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 320 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 321 | background-size: 100% 100%; | 321 | background-size: 100% 100%; |
| 322 | width: 7.6px; | 322 | width: 7.6px; |
| ... | @@ -328,16 +328,16 @@ input { | ... | @@ -328,16 +328,16 @@ input { |
| 328 | 328 | ||
| 329 | .validator { | 329 | .validator { |
| 330 | color: $cOrange; | 330 | color: $cOrange; |
| 331 | margin-top: 0.5rem; | 331 | margin-top: 6px; |
| 332 | position: absolute; | 332 | position: absolute; |
| 333 | right: 1rem; | 333 | right: 12px; |
| 334 | display: flex; | 334 | display: flex; |
| 335 | align-items: center; | 335 | align-items: center; |
| 336 | // bottom: 0; | 336 | // bottom: 0; |
| 337 | 337 | ||
| 338 | img { | 338 | img { |
| 339 | display: inline-block; | 339 | display: inline-block; |
| 340 | margin-right: 0.4rem; | 340 | margin-right: 4.8px; |
| 341 | } | 341 | } |
| 342 | } | 342 | } |
| 343 | } | 343 | } |
| ... | @@ -361,7 +361,7 @@ input { | ... | @@ -361,7 +361,7 @@ input { |
| 361 | } | 361 | } |
| 362 | 362 | ||
| 363 | .label:lang(zh) { | 363 | .label:lang(zh) { |
| 364 | letter-spacing: .25rem; | 364 | letter-spacing: 3px; |
| 365 | } | 365 | } |
| 366 | 366 | ||
| 367 | .date-container { | 367 | .date-container { |
| ... | @@ -379,7 +379,7 @@ input { | ... | @@ -379,7 +379,7 @@ input { |
| 379 | .ipt { | 379 | .ipt { |
| 380 | border: 1px solid $cOrange !important; | 380 | border: 1px solid $cOrange !important; |
| 381 | border-radius: 5px; | 381 | border-radius: 5px; |
| 382 | height: 3rem; | 382 | height: 36px; |
| 383 | display: flex; | 383 | display: flex; |
| 384 | align-items: center; | 384 | align-items: center; |
| 385 | } | 385 | } |
| ... | @@ -388,7 +388,7 @@ input { | ... | @@ -388,7 +388,7 @@ input { |
| 388 | .ipt2 { | 388 | .ipt2 { |
| 389 | width: 100%; | 389 | width: 100%; |
| 390 | border-bottom: 1px solid #ccc; | 390 | border-bottom: 1px solid #ccc; |
| 391 | height: 3rem; | 391 | height: 36px; |
| 392 | display: flex; | 392 | display: flex; |
| 393 | align-items: center; | 393 | align-items: center; |
| 394 | margin-bottom: 10px; | 394 | margin-bottom: 10px; |
| ... | @@ -396,16 +396,16 @@ input { | ... | @@ -396,16 +396,16 @@ input { |
| 396 | 396 | ||
| 397 | // 长文本 | 397 | // 长文本 |
| 398 | .textarea { | 398 | .textarea { |
| 399 | min-height: 8.75rem; | 399 | min-height: 105px; |
| 400 | @extend .bb; | 400 | @extend .bb; |
| 401 | padding: .75rem; | 401 | padding: 9px; |
| 402 | } | 402 | } |
| 403 | 403 | ||
| 404 | .down-arrow { | 404 | .down-arrow { |
| 405 | z-index: 10; | 405 | z-index: 10; |
| 406 | position: absolute; | 406 | position: absolute; |
| 407 | top: 1.3rem; | 407 | top: 15.6px; |
| 408 | right: 1.2rem; | 408 | right: 14.4px; |
| 409 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); | 409 | background-image: url('~@/assets/images/reservation/re-down-arrow-2.png'); |
| 410 | background-size: 100% 100%; | 410 | background-size: 100% 100%; |
| 411 | width: 7.6px; | 411 | width: 7.6px; |
| ... | @@ -420,19 +420,19 @@ input { | ... | @@ -420,19 +420,19 @@ input { |
| 420 | 420 | ||
| 421 | 421 | ||
| 422 | .notice { | 422 | .notice { |
| 423 | margin-top: 4rem; | 423 | margin-top: 48px; |
| 424 | @extend .bb; | 424 | @extend .bb; |
| 425 | padding: 0 1rem; | 425 | padding: 0 12px; |
| 426 | 426 | ||
| 427 | &-item { | 427 | &-item { |
| 428 | position: relative; | 428 | position: relative; |
| 429 | line-height: 2; | 429 | line-height: 2; |
| 430 | margin-bottom: 1rem; | 430 | margin-bottom: 12px; |
| 431 | 431 | ||
| 432 | &-icon { | 432 | &-icon { |
| 433 | width: 14px; | 433 | width: 14px; |
| 434 | position: absolute; | 434 | position: absolute; |
| 435 | top: .6rem; | 435 | top: 7.2px; |
| 436 | } | 436 | } |
| 437 | } | 437 | } |
| 438 | 438 | ||
| ... | @@ -443,13 +443,13 @@ input { | ... | @@ -443,13 +443,13 @@ input { |
| 443 | 443 | ||
| 444 | @media (max-width: 1200px) { | 444 | @media (max-width: 1200px) { |
| 445 | .mobile-margin { | 445 | .mobile-margin { |
| 446 | margin-top: 2.5rem; | 446 | margin-top: 30px; |
| 447 | } | 447 | } |
| 448 | } | 448 | } |
| 449 | 449 | ||
| 450 | @media (max-width: 1000px) { | 450 | @media (max-width: 1000px) { |
| 451 | .reservation-container-2 { | 451 | .reservation-container-2 { |
| 452 | padding: 20px 2rem 34px 2rem; | 452 | padding: 20px 24px 34px 24px; |
| 453 | } | 453 | } |
| 454 | 454 | ||
| 455 | .form { | 455 | .form { |
| ... | @@ -475,7 +475,7 @@ input { | ... | @@ -475,7 +475,7 @@ input { |
| 475 | 475 | ||
| 476 | @media (max-width: 600px) { | 476 | @media (max-width: 600px) { |
| 477 | .reservation-container { | 477 | .reservation-container { |
| 478 | padding: 32px 2rem 34px 2rem; | 478 | padding: 32px 24px 34px 24px; |
| 479 | } | 479 | } |
| 480 | 480 | ||
| 481 | .form { | 481 | .form { |
| ... | @@ -531,6 +531,6 @@ input { | ... | @@ -531,6 +531,6 @@ input { |
| 531 | 531 | ||
| 532 | @media (max-width: 400px) { | 532 | @media (max-width: 400px) { |
| 533 | .reservation-container-2 { | 533 | .reservation-container-2 { |
| 534 | padding: 20px 1rem; | 534 | padding: 20px 12px; |
| 535 | } | 535 | } |
| 536 | } | 536 | } | ... | ... |
| ... | @@ -27,7 +27,7 @@ export default { | ... | @@ -27,7 +27,7 @@ export default { |
| 27 | methods: { | 27 | methods: { |
| 28 | downloadHandle(item) { | 28 | downloadHandle(item) { |
| 29 | if (item.download) { | 29 | if (item.download) { |
| 30 | location.href = item.download; | 30 | window.open(item.download); |
| 31 | } | 31 | } |
| 32 | }, | 32 | }, |
| 33 | initData() { } | 33 | initData() { } | ... | ... |
| ... | @@ -10,14 +10,14 @@ | ... | @@ -10,14 +10,14 @@ |
| 10 | @include border-top-radius(8px); | 10 | @include border-top-radius(8px); |
| 11 | display: flex; | 11 | display: flex; |
| 12 | align-items: center; | 12 | align-items: center; |
| 13 | height: 3.25rem; | 13 | height: 39px; |
| 14 | color: #ffffff; | 14 | color: #ffffff; |
| 15 | font-weight: bold; | 15 | font-weight: bold; |
| 16 | &-item {} | 16 | &-item {} |
| 17 | } | 17 | } |
| 18 | 18 | ||
| 19 | &-header:lang(zh) { | 19 | &-header:lang(zh) { |
| 20 | letter-spacing: .1rem; | 20 | letter-spacing: 1.2px; |
| 21 | } | 21 | } |
| 22 | 22 | ||
| 23 | &-content { | 23 | &-content { |
| ... | @@ -26,7 +26,7 @@ | ... | @@ -26,7 +26,7 @@ |
| 26 | text-align: center; | 26 | text-align: center; |
| 27 | border: solid 1px #f2f2f2; | 27 | border: solid 1px #f2f2f2; |
| 28 | @include border-bottom-radius(8px); | 28 | @include border-bottom-radius(8px); |
| 29 | $gridHei: 5.25rem; | 29 | $gridHei: 63px; |
| 30 | 30 | ||
| 31 | &-item { | 31 | &-item { |
| 32 | position: relative; | 32 | position: relative; |
| ... | @@ -38,11 +38,11 @@ | ... | @@ -38,11 +38,11 @@ |
| 38 | 38 | ||
| 39 | .hl { | 39 | .hl { |
| 40 | position: absolute; | 40 | position: absolute; |
| 41 | width: 6.45rem; | 41 | width: 77.4px; |
| 42 | height: 1px; | 42 | height: 1px; |
| 43 | background-color: #dcdddd; | 43 | background-color: #dcdddd; |
| 44 | bottom: 0; | 44 | bottom: 0; |
| 45 | left: 1rem; | 45 | left: 12px; |
| 46 | } | 46 | } |
| 47 | 47 | ||
| 48 | .grid { | 48 | .grid { |
| ... | @@ -55,7 +55,7 @@ | ... | @@ -55,7 +55,7 @@ |
| 55 | .v-line { | 55 | .v-line { |
| 56 | position: absolute; | 56 | position: absolute; |
| 57 | width: 1px; | 57 | width: 1px; |
| 58 | height: 2.25rem; | 58 | height: 27px; |
| 59 | background-color: #dcdddd; | 59 | background-color: #dcdddd; |
| 60 | right: 0; | 60 | right: 0; |
| 61 | top: 0; | 61 | top: 0; |
| ... | @@ -64,7 +64,7 @@ | ... | @@ -64,7 +64,7 @@ |
| 64 | } | 64 | } |
| 65 | 65 | ||
| 66 | .icon { | 66 | .icon { |
| 67 | margin-right: .916667rem; | 67 | margin-right: 11px; |
| 68 | } | 68 | } |
| 69 | } | 69 | } |
| 70 | 70 | ||
| ... | @@ -85,7 +85,7 @@ | ... | @@ -85,7 +85,7 @@ |
| 85 | 85 | ||
| 86 | .w4 { | 86 | .w4 { |
| 87 | .h-line { | 87 | .h-line { |
| 88 | width: 12rem; | 88 | width: 144px; |
| 89 | } | 89 | } |
| 90 | 90 | ||
| 91 | color: $cOrange; | 91 | color: $cOrange; |
| ... | @@ -98,20 +98,20 @@ | ... | @@ -98,20 +98,20 @@ |
| 98 | } | 98 | } |
| 99 | 99 | ||
| 100 | .w1 { | 100 | .w1 { |
| 101 | width: 8.75rem; // 105 | 101 | width: 105px; |
| 102 | } | 102 | } |
| 103 | 103 | ||
| 104 | .w2 { | 104 | .w2 { |
| 105 | width: 29rem; // 348 | 105 | width: 348px; |
| 106 | } | 106 | } |
| 107 | 107 | ||
| 108 | .w3 { | 108 | .w3 { |
| 109 | width: 29.75rem; // 357 | 109 | width: 357px; |
| 110 | } | 110 | } |
| 111 | 111 | ||
| 112 | .w4 { | 112 | .w4 { |
| 113 | width: 12rem; | 113 | width: 144px; |
| 114 | width: 13.75rem; | 114 | width: 165px; |
| 115 | } | 115 | } |
| 116 | } | 116 | } |
| 117 | 117 | ... | ... |
| 1 | @import '@/styles/_support.scss'; | 1 | @import '@/styles/_support.scss'; |
| 2 | 2 | ||
| 3 | .top-space { | 3 | .top-space { |
| 4 | // height: 4.25rem; | 4 | // height: 51px; |
| 5 | } | 5 | } |
| 6 | 6 | ||
| 7 | .reservation-container { | 7 | .reservation-container { |
| ... | @@ -24,7 +24,7 @@ | ... | @@ -24,7 +24,7 @@ |
| 24 | color: #f05a23; | 24 | color: #f05a23; |
| 25 | display: flex; | 25 | display: flex; |
| 26 | align-items: center; | 26 | align-items: center; |
| 27 | margin-bottom: .7rem; | 27 | margin-bottom: 8.4px; |
| 28 | 28 | ||
| 29 | .icon { | 29 | .icon { |
| 30 | width: 26px; | 30 | width: 26px; |
| ... | @@ -32,7 +32,7 @@ | ... | @@ -32,7 +32,7 @@ |
| 32 | } | 32 | } |
| 33 | 33 | ||
| 34 | img { | 34 | img { |
| 35 | height: 1rem; | 35 | height: 12px; |
| 36 | } | 36 | } |
| 37 | } | 37 | } |
| 38 | 38 | ||
| ... | @@ -43,29 +43,29 @@ | ... | @@ -43,29 +43,29 @@ |
| 43 | .ipt {} | 43 | .ipt {} |
| 44 | 44 | ||
| 45 | .name-ipt { | 45 | .name-ipt { |
| 46 | width: 18rem; | 46 | width: 216px; |
| 47 | } | 47 | } |
| 48 | 48 | ||
| 49 | .phone-ipt { | 49 | .phone-ipt { |
| 50 | width: 18rem; | 50 | width: 216px; |
| 51 | } | 51 | } |
| 52 | 52 | ||
| 53 | .mail-ipt {} | 53 | .mail-ipt {} |
| 54 | 54 | ||
| 55 | // 长文本 | 55 | // 长文本 |
| 56 | .textarea { | 56 | .textarea { |
| 57 | min-height: 8.75rem; | 57 | min-height: 105px; |
| 58 | border-radius: 1rem; | 58 | border-radius: 12px; |
| 59 | @extend .bb; | 59 | @extend .bb; |
| 60 | padding: .75rem; | 60 | padding: 9px; |
| 61 | } | 61 | } |
| 62 | 62 | ||
| 63 | .down-arrow { | 63 | .down-arrow { |
| 64 | position: absolute; | 64 | position: absolute; |
| 65 | top: 2.2rem; | 65 | top: 26.4px; |
| 66 | right: 2rem; | 66 | right: 24px; |
| 67 | background-image: url('~@/assets/images/reservation/re-down-arrow.png'); | 67 | background-image: url('~@/assets/images/reservation/re-down-arrow.png'); |
| 68 | width: 1rem; | 68 | width: 12px; |
| 69 | height: 8px; | 69 | height: 8px; |
| 70 | pointer-events: none; | 70 | pointer-events: none; |
| 71 | cursor: default; | 71 | cursor: default; |
| ... | @@ -74,16 +74,16 @@ | ... | @@ -74,16 +74,16 @@ |
| 74 | 74 | ||
| 75 | .validator { | 75 | .validator { |
| 76 | color: $cOrange; | 76 | color: $cOrange; |
| 77 | margin-top: 0.5rem; | 77 | margin-top: 6px; |
| 78 | position: absolute; | 78 | position: absolute; |
| 79 | right: 1rem; | 79 | right: 12px; |
| 80 | display: flex; | 80 | display: flex; |
| 81 | align-items: center; | 81 | align-items: center; |
| 82 | // bottom: 0; | 82 | // bottom: 0; |
| 83 | 83 | ||
| 84 | img { | 84 | img { |
| 85 | display: inline-block; | 85 | display: inline-block; |
| 86 | margin-right: 0.4rem; | 86 | margin-right: 4.8px; |
| 87 | } | 87 | } |
| 88 | } | 88 | } |
| 89 | } | 89 | } |
| ... | @@ -91,11 +91,11 @@ | ... | @@ -91,11 +91,11 @@ |
| 91 | // 不换行 | 91 | // 不换行 |
| 92 | &-item2 { | 92 | &-item2 { |
| 93 | display: flex; | 93 | display: flex; |
| 94 | margin-bottom: 2.25rem; | 94 | margin-bottom: 27px; |
| 95 | 95 | ||
| 96 | .label { | 96 | .label { |
| 97 | min-width: 12.833333rem; | 97 | min-width: 154px; |
| 98 | height: 2.5rem; | 98 | height: 30px; |
| 99 | } | 99 | } |
| 100 | 100 | ||
| 101 | .cont { | 101 | .cont { |
| ... | @@ -103,14 +103,14 @@ | ... | @@ -103,14 +103,14 @@ |
| 103 | display: flex; | 103 | display: flex; |
| 104 | 104 | ||
| 105 | .boo-btn { | 105 | .boo-btn { |
| 106 | width: 5.25rem; | 106 | width: 63px; |
| 107 | height: 2.5rem; | 107 | height: 30px; |
| 108 | line-height: 2.5rem; | 108 | line-height: 30px; |
| 109 | border: solid 1px #dcdddd; | 109 | border: solid 1px #dcdddd; |
| 110 | background-color: #ffffff; | 110 | background-color: #ffffff; |
| 111 | border-radius: 2.5rem; | 111 | border-radius: 30px; |
| 112 | text-align: center; | 112 | text-align: center; |
| 113 | margin: 0 0.6rem; | 113 | margin: 0 7.2px; |
| 114 | } | 114 | } |
| 115 | 115 | ||
| 116 | .active { | 116 | .active { |
| ... | @@ -131,7 +131,7 @@ | ... | @@ -131,7 +131,7 @@ |
| 131 | flex-wrap: wrap; | 131 | flex-wrap: wrap; |
| 132 | 132 | ||
| 133 | .validator { | 133 | .validator { |
| 134 | margin-top: 3rem; | 134 | margin-top: 36px; |
| 135 | } | 135 | } |
| 136 | 136 | ||
| 137 | .label { | 137 | .label { |
| ... | @@ -141,14 +141,14 @@ | ... | @@ -141,14 +141,14 @@ |
| 141 | .ipt-wrap { | 141 | .ipt-wrap { |
| 142 | position: relative; | 142 | position: relative; |
| 143 | // width: 50%; | 143 | // width: 50%; |
| 144 | margin-left: 1.75rem; | 144 | margin-left: 21px; |
| 145 | 145 | ||
| 146 | input { | 146 | input { |
| 147 | color: #4c4948; | 147 | color: #4c4948; |
| 148 | } | 148 | } |
| 149 | 149 | ||
| 150 | input:lang(zh) { | 150 | input:lang(zh) { |
| 151 | letter-spacing: .116667rem; | 151 | letter-spacing: 1.4px; |
| 152 | } | 152 | } |
| 153 | } | 153 | } |
| 154 | 154 | ||
| ... | @@ -166,7 +166,7 @@ | ... | @@ -166,7 +166,7 @@ |
| 166 | 166 | ||
| 167 | .mt8 { | 167 | .mt8 { |
| 168 | margin-top: 8px; | 168 | margin-top: 8px; |
| 169 | margin-left: 10rem; | 169 | margin-left: 120px; |
| 170 | } | 170 | } |
| 171 | } | 171 | } |
| 172 | 172 | ||
| ... | @@ -184,19 +184,19 @@ | ... | @@ -184,19 +184,19 @@ |
| 184 | } | 184 | } |
| 185 | 185 | ||
| 186 | .notice { | 186 | .notice { |
| 187 | margin-top: 4rem; | 187 | margin-top: 48px; |
| 188 | @extend .bb; | 188 | @extend .bb; |
| 189 | padding: 0 1rem; | 189 | padding: 0 12px; |
| 190 | 190 | ||
| 191 | &-item { | 191 | &-item { |
| 192 | position: relative; | 192 | position: relative; |
| 193 | line-height: 2; | 193 | line-height: 2; |
| 194 | margin-bottom: 1rem; | 194 | margin-bottom: 12px; |
| 195 | 195 | ||
| 196 | &-icon { | 196 | &-icon { |
| 197 | position: absolute; | 197 | position: absolute; |
| 198 | width: 14px; | 198 | width: 14px; |
| 199 | top: .6rem; | 199 | top: 7.2px; |
| 200 | } | 200 | } |
| 201 | } | 201 | } |
| 202 | 202 | ||
| ... | @@ -206,18 +206,18 @@ | ... | @@ -206,18 +206,18 @@ |
| 206 | } | 206 | } |
| 207 | 207 | ||
| 208 | .submit-btn { | 208 | .submit-btn { |
| 209 | width: 13.583333rem; | 209 | width: 163px; |
| 210 | height: 49px; | 210 | height: 49px; |
| 211 | margin: 2.5rem auto 0; | 211 | margin: 30px auto 0; |
| 212 | line-height: 49px; | 212 | line-height: 49px; |
| 213 | box-shadow: 0px 10px 13px 0 rgba(236, 100, 41, 0.2); | 213 | box-shadow: 0px 10px 13px 0 rgba(236, 100, 41, 0.2); |
| 214 | background-blend-mode: soft-light, ; | 214 | background-blend-mode: soft-light, ; |
| 215 | // background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429); | 215 | // background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429); |
| 216 | background-image: linear-gradient(to bottom, #ec6429, #ec6429), linear-gradient(to top, #000000, #ffffff); | 216 | background-image: linear-gradient(to bottom, #ec6429, #ec6429), linear-gradient(to top, #000000, #ffffff); |
| 217 | text-align: center; | 217 | text-align: center; |
| 218 | font-size: 1.291667rem; | 218 | font-size: 15.5px; |
| 219 | color: #ffffff; | 219 | color: #ffffff; |
| 220 | border-radius: 3.5rem; | 220 | border-radius: 42px; |
| 221 | cursor: pointer; | 221 | cursor: pointer; |
| 222 | border: none; | 222 | border: none; |
| 223 | color: #ffffff; | 223 | color: #ffffff; |
| ... | @@ -229,7 +229,7 @@ | ... | @@ -229,7 +229,7 @@ |
| 229 | } | 229 | } |
| 230 | 230 | ||
| 231 | .submit-btn:lang(zh) { | 231 | .submit-btn:lang(zh) { |
| 232 | letter-spacing: .129167rem; | 232 | letter-spacing: 1.55px; |
| 233 | } | 233 | } |
| 234 | 234 | ||
| 235 | @media (max-width: 768px) { | 235 | @media (max-width: 768px) { | ... | ... |
| ... | @@ -3,13 +3,13 @@ | ... | @@ -3,13 +3,13 @@ |
| 3 | 3 | ||
| 4 | .contact-us-container { | 4 | .contact-us-container { |
| 5 | .info-item { | 5 | .info-item { |
| 6 | padding-right: 1.25rem; | 6 | padding-right: 15px; |
| 7 | } | 7 | } |
| 8 | } | 8 | } |
| 9 | 9 | ||
| 10 | .border { | 10 | .border { |
| 11 | @extend .bb; | 11 | @extend .bb; |
| 12 | padding: 3.5rem 4.0rem 2rem 4.5rem; | 12 | padding: 42px 48px 24px 54px; |
| 13 | min-height: 490px; | 13 | min-height: 490px; |
| 14 | border-radius: $borderRadius; | 14 | border-radius: $borderRadius; |
| 15 | border: solid 1px #f2f2f2; | 15 | border: solid 1px #f2f2f2; |
| ... | @@ -23,7 +23,7 @@ | ... | @@ -23,7 +23,7 @@ |
| 23 | 23 | ||
| 24 | &-item { | 24 | &-item { |
| 25 | font-size: $fontSize; | 25 | font-size: $fontSize; |
| 26 | margin-bottom: 4.416667rem; | 26 | margin-bottom: 50px; |
| 27 | @extend .text-jtf; | 27 | @extend .text-jtf; |
| 28 | 28 | ||
| 29 | &-tit { | 29 | &-tit { |
| ... | @@ -35,7 +35,7 @@ | ... | @@ -35,7 +35,7 @@ |
| 35 | height: 34px; | 35 | height: 34px; |
| 36 | 36 | ||
| 37 | .icon-wrap { | 37 | .icon-wrap { |
| 38 | margin-right: .75rem; | 38 | margin-right: 9px; |
| 39 | } | 39 | } |
| 40 | } | 40 | } |
| 41 | 41 | ||
| ... | @@ -52,23 +52,23 @@ | ... | @@ -52,23 +52,23 @@ |
| 52 | 52 | ||
| 53 | ul { | 53 | ul { |
| 54 | list-style-type: none; | 54 | list-style-type: none; |
| 55 | margin-top: 1.5rem; | 55 | margin-top: 18px; |
| 56 | } | 56 | } |
| 57 | 57 | ||
| 58 | li { | 58 | li { |
| 59 | // @extend .bb; | 59 | // @extend .bb; |
| 60 | background-image: url('~@assets/images/payment-type/icon-li.png'); | 60 | background-image: url('~@assets/images/payment-type/icon-li.png'); |
| 61 | background-repeat: no-repeat; | 61 | background-repeat: no-repeat; |
| 62 | background-position: 0rem .5rem; | 62 | background-position: 0px 6px; |
| 63 | padding: 0 1rem; | 63 | padding: 0 12px; |
| 64 | margin: .6rem 0; | 64 | margin: 7.2px 0; |
| 65 | } | 65 | } |
| 66 | } | 66 | } |
| 67 | 67 | ||
| 68 | .info2 { | 68 | .info2 { |
| 69 | .info-item { | 69 | .info-item { |
| 70 | @extend .bb; | 70 | @extend .bb; |
| 71 | padding-right: 2rem; | 71 | padding-right: 24px; |
| 72 | margin-bottom: 1rem; | 72 | margin-bottom: 12px; |
| 73 | } | 73 | } |
| 74 | } | 74 | } | ... | ... |
| 1 | import { mapState } from "vuex"; | ||
| 2 | import api from '@/api/api' | ||
| 3 | import { | ||
| 4 | httpGet, | ||
| 5 | httpPost | ||
| 6 | } from '@/api/fetch-api.js' | ||
| 7 | |||
| 8 | import Auth from '@components/auth/auth.vue'; | ||
| 9 | import PolicyHeadList from "./policy-head-list.vue"; | ||
| 10 | |||
| 11 | import { formatMoney, getInsuredPeriod, getBenefitType, getPayPeriod, getPayType, getMoneyName, getPayMode, getPolicyName } from "@/utils/biz.js"; | ||
| 12 | |||
| 13 | export default { | ||
| 14 | name: "InsuranceQuery", | ||
| 15 | data() { | ||
| 16 | return { | ||
| 17 | showForm: false, | ||
| 18 | dataForm: null, | ||
| 19 | insuranceForm: { | ||
| 20 | f1: true, | ||
| 21 | f2: true, | ||
| 22 | f3: true, | ||
| 23 | f4: true, | ||
| 24 | f5: true, | ||
| 25 | }, | ||
| 26 | policy: null, | ||
| 27 | } | ||
| 28 | }, | ||
| 29 | methods: { | ||
| 30 | handlePolicySelect(data) { | ||
| 31 | let submitData = { | ||
| 32 | policyId: data[0].id, | ||
| 33 | policyCode: data[0].code | ||
| 34 | } | ||
| 35 | this.policy = submitData; | ||
| 36 | this.dataForm = null; | ||
| 37 | httpPost({ url: api.policyDetail, sid: true, data: submitData }).then(res => { | ||
| 38 | this.dataForm = res; | ||
| 39 | |||
| 40 | |||
| 41 | if (this.dataForm.clientNameCn) { | ||
| 42 | let userInfo = JSON.parse(JSON.stringify(this.userInfo)); | ||
| 43 | userInfo.name = this.dataForm.clientNameCn | ||
| 44 | this.$store.commit("SET_USER_INFO", userInfo); | ||
| 45 | } | ||
| 46 | }).catch(err => { | ||
| 47 | if (err.code == 404) { | ||
| 48 | this.$refs.auth.noAuth(); | ||
| 49 | } | ||
| 50 | }); | ||
| 51 | }, | ||
| 52 | toMoneyCode(moneyCode) { | ||
| 53 | switch (moneyCode) { | ||
| 54 | case "USD": | ||
| 55 | return "$"; | ||
| 56 | default: | ||
| 57 | return "HK$"; | ||
| 58 | } | ||
| 59 | }, | ||
| 60 | toMoneyCodeName(moneyCode) { | ||
| 61 | switch (moneyCode) { | ||
| 62 | case "USD": | ||
| 63 | return "美元"; | ||
| 64 | default: | ||
| 65 | return "港币"; | ||
| 66 | } | ||
| 67 | }, | ||
| 68 | toModifyPage(type, toContact) { | ||
| 69 | // 1=受保人；2=投保人 | ||
| 70 | if (!this.policy || !this.dataForm) { | ||
| 71 | return; | ||
| 72 | } | ||
| 73 | let data = encodeURIComponent(JSON.stringify({ id: this.policy.policyId, code: this.policy.policyCode })); | ||
| 74 | sessionStorage.setItem("_hklife_policy", data); | ||
| 75 | if (type == 1) { | ||
| 76 | this.$router.push({ path: "/custom/service", query: { q: "m43", u: 2 } }); | ||
| 77 | } else { | ||
| 78 | if (1 == toContact) { | ||
| 79 | this.$router.push({ path: "/custom/service", query: { q: "m42" } }); | ||
| 80 | } else { | ||
| 81 | this.$router.push({ path: "/custom/service", query: { q: "m43", u: 1 } }); | ||
| 82 | } | ||
| 83 | } | ||
| 84 | }, | ||
| 85 | formatMoney(s, t) { | ||
| 86 | if (typeof t == "undefined") { | ||
| 87 | t = 1; | ||
| 88 | } | ||
| 89 | return formatMoney(s, t); | ||
| 90 | }, | ||
| 91 | // 保障年限，保n年 | ||
| 92 | formatInsuredPeriod(t, v) { | ||
| 93 | return getInsuredPeriod(this.$i18n.locale, t, v); | ||
| 94 | }, | ||
| 95 | formatBenefitType(t) { | ||
| 96 | return getBenefitType(this.$i18n.locale, t); | ||
| 97 | }, | ||
| 98 | // 缴费方式，交n年 | ||
| 99 | formatPayPeriod(t, v) { | ||
| 100 | return getPayPeriod(this.$i18n.locale, t, v); | ||
| 101 | }, | ||
| 102 | // 支付方式，支票xxx | ||
| 103 | formatPayMode(v) { | ||
| 104 | return getPayMode(this.$i18n.locale, v); | ||
| 105 | }, | ||
| 106 | // 缴费频率 | ||
| 107 | formatPayType(v) { | ||
| 108 | return getPayType(this.$i18n.locale, v); | ||
| 109 | }, | ||
| 110 | // 钱的名字 | ||
| 111 | formatMoneyName(c) { | ||
| 112 | return getMoneyName(this.$i18n.locale, c); | ||
| 113 | }, | ||
| 114 | formatPanduPayPeriod(y, p) { | ||
| 115 | switch (this.$i18n.locale) { | ||
| 116 | case "zh": | ||
| 117 | case "tc": | ||
| 118 | return "第" + y + "年第" + p + "期"; | ||
| 119 | default: | ||
| 120 | return this.formatNumber(p) + " payment in " + this.formatNumber(y) + " year"; | ||
| 121 | } | ||
| 122 | }, | ||
| 123 | formatPolicyName(c, n) { | ||
| 124 | return getPolicyName(this.$i18n.locale, c, c); | ||
| 125 | }, | ||
| 126 | formatNumber(p) { | ||
| 127 | let pmod = p % 4; | ||
| 128 | let pstr = p + ""; | ||
| 129 | switch (pmod) { | ||
| 130 | case 0: | ||
| 131 | pstr += "th"; | ||
| 132 | break; | ||
| 133 | case 1: | ||
| 134 | pstr += "st"; | ||
| 135 | break; | ||
| 136 | case 2: | ||
| 137 | pstr += "nd"; | ||
| 138 | break; | ||
| 139 | case 3: | ||
| 140 | pstr += "rd"; | ||
| 141 | break; | ||
| 142 | default: | ||
| 143 | pstr += "th"; | ||
| 144 | break; | ||
| 145 | } | ||
| 146 | return pstr; | ||
| 147 | }, | ||
| 148 | userLogout() { | ||
| 149 | this.showForm = false; | ||
| 150 | }, | ||
| 151 | userLogin(data) { | ||
| 152 | this.showForm = true; | ||
| 153 | } | ||
| 154 | }, | ||
| 155 | computed: { | ||
| 156 | ...mapState({ | ||
| 157 | userInfo: state => state.userInfo | ||
| 158 | }), | ||
| 159 | i18n() { | ||
| 160 | return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {}; | ||
| 161 | }, | ||
| 162 | }, | ||
| 163 | components: { | ||
| 164 | Auth, | ||
| 165 | PolicyHeadList, | ||
| 166 | }, | ||
| 167 | } |
| 1 | @import '@/styles/_support.scss'; | ||
| 2 | |||
| 3 | .container{ | ||
| 4 | // font-size: 18px; | ||
| 5 | } | ||
| 6 | |||
| 7 | .cell-group { | ||
| 8 | margin-bottom: 12px; | ||
| 9 | |||
| 10 | &:last-child { | ||
| 11 | margin-bottom: 0; | ||
| 12 | } | ||
| 13 | |||
| 14 | div { | ||
| 15 | color: #4c4948; | ||
| 16 | } | ||
| 17 | |||
| 18 | .w1 { | ||
| 19 | width: 240px; | ||
| 20 | text-align: center; | ||
| 21 | } | ||
| 22 | |||
| 23 | .w2 { | ||
| 24 | width: 150px; | ||
| 25 | text-align: center; | ||
| 26 | } | ||
| 27 | |||
| 28 | .table-header { | ||
| 29 | height: 39px; | ||
| 30 | border-top-left-radius: 8px; | ||
| 31 | border-top-right-radius: 8px; | ||
| 32 | background-color: #f2f2f2; | ||
| 33 | display: flex; | ||
| 34 | align-items: center; | ||
| 35 | |||
| 36 | .normal-header { | ||
| 37 | @extend .bb; | ||
| 38 | padding: 0 32px; | ||
| 39 | width: 100%; | ||
| 40 | margin: auto; | ||
| 41 | display: flex; | ||
| 42 | justify-content: space-between; | ||
| 43 | align-items: center; | ||
| 44 | |||
| 45 | .title { | ||
| 46 | font-weight: bold; | ||
| 47 | color: #575453; | ||
| 48 | } | ||
| 49 | |||
| 50 | .guide { | ||
| 51 | transition: all 0.5s; | ||
| 52 | cursor: pointer; | ||
| 53 | width: 12px; | ||
| 54 | height: 8px; | ||
| 55 | background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center; | ||
| 56 | background-size: 100% 100%; | ||
| 57 | } | ||
| 58 | |||
| 59 | .rotate180 { | ||
| 60 | transform: rotate(180deg); | ||
| 61 | transition: all 0.5s; | ||
| 62 | } | ||
| 63 | } | ||
| 64 | } | ||
| 65 | |||
| 66 | .table-content { | ||
| 67 | |||
| 68 | height: auto; | ||
| 69 | // display: inline-block; | ||
| 70 | border-bottom-left-radius: 8px; | ||
| 71 | border-bottom-right-radius: 8px; | ||
| 72 | border-left: solid 1px #f2f2f2; | ||
| 73 | border-right: solid 1px #f2f2f2; | ||
| 74 | border-bottom: solid 1px #f2f2f2; | ||
| 75 | padding: 0 32px; | ||
| 76 | max-height: 500px; | ||
| 77 | transition: max-height ease-out 0.3s !important; | ||
| 78 | overflow: scroll; | ||
| 79 | |||
| 80 | .data-line { | ||
| 81 | height: 50px; | ||
| 82 | margin: auto; | ||
| 83 | display: flex; | ||
| 84 | justify-content: space-between; | ||
| 85 | align-items: center; | ||
| 86 | |||
| 87 | .td { | ||
| 88 | display: flex; | ||
| 89 | justify-content: center; | ||
| 90 | align-items: center; | ||
| 91 | } | ||
| 92 | |||
| 93 | .cell1 { | ||
| 94 | width: 98%; | ||
| 95 | display: flex; | ||
| 96 | justify-content: space-between; | ||
| 97 | margin: auto; | ||
| 98 | |||
| 99 | div:first-child{ | ||
| 100 | text-align: left; | ||
| 101 | min-width: 80px !important; | ||
| 102 | } | ||
| 103 | } | ||
| 104 | |||
| 105 | .cell1:nth-child(1){ | ||
| 106 | text-align: right !important; | ||
| 107 | } | ||
| 108 | |||
| 109 | .separator-v { | ||
| 110 | height: 30px; | ||
| 111 | width: 2px; | ||
| 112 | background-color: #f2f2f2; | ||
| 113 | margin: 0 11px; | ||
| 114 | } | ||
| 115 | } | ||
| 116 | |||
| 117 | |||
| 118 | .label span { | ||
| 119 | color: #f05a23; | ||
| 120 | margin-left: 7px; | ||
| 121 | cursor: pointer; | ||
| 122 | text-decoration: underline; | ||
| 123 | } | ||
| 124 | |||
| 125 | .separator-h { | ||
| 126 | width: 100%; | ||
| 127 | height: 1px; | ||
| 128 | background-color: #f2f2f2; | ||
| 129 | } | ||
| 130 | } | ||
| 131 | |||
| 132 | .orange { | ||
| 133 | background-color: #f05a23 !important; | ||
| 134 | |||
| 135 | div { | ||
| 136 | color: #ffffff; | ||
| 137 | } | ||
| 138 | } | ||
| 139 | |||
| 140 | .hide { | ||
| 141 | max-height: 0; | ||
| 142 | border-bottom: none; | ||
| 143 | } | ||
| 144 | |||
| 145 | } | ||
| 146 | |||
| 147 | .cell-between { | ||
| 148 | .data-line { | ||
| 149 | .td { | ||
| 150 | &:first-child { | ||
| 151 | justify-content: flex-start; | ||
| 152 | } | ||
| 153 | |||
| 154 | &:last-child { | ||
| 155 | justify-content: flex-end; | ||
| 156 | } | ||
| 157 | } | ||
| 158 | } | ||
| 159 | |||
| 160 | } | ||
| 161 | |||
| 162 | .icon-download { | ||
| 163 | margin: 0 12px; | ||
| 164 | } | ||
| 165 | |||
| 166 | .icon-check { | ||
| 167 | height: 17px; | ||
| 168 | margin: 0 12px; | ||
| 169 | } | ||
| 170 | |||
| 171 | @media (max-width: 1200px) { | ||
| 172 | .container { | ||
| 173 | width: 1200px; | ||
| 174 | display: -webkit-box; | ||
| 175 | overflow-x: auto; | ||
| 176 | -webkit-overflow-scrolling: touch; | ||
| 177 | width: 92vw; | ||
| 178 | } | ||
| 179 | } | ||
| 180 | |||
| 181 | // .container::-webkit-scrollbar { | ||
| 182 | // display: none; | ||
| 183 | // } | ||
| 184 | |||
| 185 | // .container{ | ||
| 186 | // -ms-overflow-style: none; | ||
| 187 | // } | ||
| 188 | |||
| 189 | // .list-container::-webkit-scrollbar { | ||
| 190 | // display: none; | ||
| 191 | // } | ||
| 192 | |||
| 193 | // .list-container{ | ||
| 194 | // -ms-overflow-style: none; | ||
| 195 | // } | ||
| 196 | |||
| 197 | // .table-content::-webkit-scrollbar { | ||
| 198 | // display: none; | ||
| 199 | // } | ||
| 200 | |||
| 201 | // .table-content{ | ||
| 202 | // -ms-overflow-style: none; | ||
| 203 | // } | ||
| 204 |
This diff is collapsed.
Click to expand it.
src/pages/custom-service/components/faq.js
0 → 100644
| 1 | /** | ||
| 2 | * 页面描述:FAQ | ||
| 3 | * 内容从CMS中取 | ||
| 4 | */ | ||
| 5 | |||
| 6 | import api from '@/api/api' | ||
| 7 | import { | ||
| 8 | httpGet, | ||
| 9 | httpPost | ||
| 10 | } from '@/api/fetch-api.js' | ||
| 11 | |||
| 12 | export default { | ||
| 13 | data() { | ||
| 14 | return { | ||
| 15 | key: 'value', | ||
| 16 | dataList: [{ | ||
| 17 | q: "我可以更改平安•傳家福的身故賠償支付方式嗎?", | ||
| 18 | a: "答: 於第一保單週年日後，您可填妥<保單服務申請書>並遞交給我們申請更改身故賠償支付方式。這項表格可於我們的官網下載。", | ||
| 19 | }] | ||
| 20 | } | ||
| 21 | }, | ||
| 22 | components: {}, | ||
| 23 | computed: { | ||
| 24 | locale() { | ||
| 25 | return this.$i18n.locale || 'tc'; | ||
| 26 | }, | ||
| 27 | i18n() { | ||
| 28 | return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {}; | ||
| 29 | }, | ||
| 30 | }, | ||
| 31 | methods: { | ||
| 32 | downloadHandle(item) { | ||
| 33 | if (item.download) { | ||
| 34 | window.open(item.download); | ||
| 35 | } | ||
| 36 | }, | ||
| 37 | initData() {} | ||
| 38 | }, | ||
| 39 | mounted() {}, | ||
| 40 | created() {} | ||
| 41 | } |
src/pages/custom-service/components/faq.scss
0 → 100644
| 1 | @import '@/styles/_support.scss'; | ||
| 2 | |||
| 3 | .container { | ||
| 4 | // margin-top: -48px; | ||
| 5 | |||
| 6 | .title { | ||
| 7 | text-align: center; | ||
| 8 | font-size: $articleTitleLarge; | ||
| 9 | font-weight: bold; | ||
| 10 | } | ||
| 11 | |||
| 12 | .title:lang(zh) { | ||
| 13 | letter-spacing: 3.65px; | ||
| 14 | } | ||
| 15 | |||
| 16 | .desc { | ||
| 17 | margin-top: 28px; | ||
| 18 | font-size: 22px; | ||
| 19 | |||
| 20 | &-item { | ||
| 21 | @extend .bb; | ||
| 22 | padding: 40px 0 42px; | ||
| 23 | border-bottom: solid 2px #eaebeb; | ||
| 24 | |||
| 25 | .question { | ||
| 26 | font-weight: bold; | ||
| 27 | } | ||
| 28 | |||
| 29 | .answer { | ||
| 30 | margin-top: 12px; | ||
| 31 | } | ||
| 32 | } | ||
| 33 | |||
| 34 | &-item:lang(zh) { | ||
| 35 | letter-spacing: 2.2px; | ||
| 36 | } | ||
| 37 | } | ||
| 38 | } | ||
| 39 | |||
| 40 | |||
| 41 | @media (max-width: 1200px) { | ||
| 42 | .container { | ||
| 43 | width: 92vw; | ||
| 44 | } | ||
| 45 | } |
src/pages/custom-service/components/faq.vue
0 → 100644
| 1 | |||
| 2 | <template> | ||
| 3 | <div class="container "> | ||
| 4 | <div class="top-space"></div> | ||
| 5 | <div class="title"> | ||
| 6 | 常见问题 | ||
| 7 | </div> | ||
| 8 | <div class="desc"> | ||
| 9 | <!-- <div class="desc-item" v-for="item in dataList" :key="item.id"> | ||
| 10 | <div class="question">{{ item.q }}</div> | ||
| 11 | <div class="answer">{{ item.a }}</div> | ||
| 12 | </div> --> | ||
| 13 | <div class="desc-item" v-for="item in 8" :key="item.id"> | ||
| 14 | <div class="question">{{ dataList[0].q }}</div> | ||
| 15 | <div class="answer">{{ dataList[0].a }}</div> | ||
| 16 | </div> | ||
| 17 | </div> | ||
| 18 | </div> | ||
| 19 | </template> | ||
| 20 | |||
| 21 | <script src="./faq.js"></script> | ||
| 22 | <style lang="scss" scoped> | ||
| 23 | @import "./faq.scss"; | ||
| 24 | </style> |
| 1 | @import '@/styles/_support.scss'; | 1 | @import '@/styles/_support.scss'; |
| 2 | 2 | ||
| 3 | .container{ | ||
| 4 | // font-size: 18px; | ||
| 5 | } | ||
| 6 | |||
| 3 | .cell-group { | 7 | .cell-group { |
| 4 | margin-bottom: 1rem; | 8 | margin-bottom: 12px; |
| 5 | 9 | ||
| 6 | &:last-child { | 10 | &:last-child { |
| 7 | margin-bottom: 0; | 11 | margin-bottom: 0; |
| ... | @@ -12,20 +16,17 @@ | ... | @@ -12,20 +16,17 @@ |
| 12 | } | 16 | } |
| 13 | 17 | ||
| 14 | .w1 { | 18 | .w1 { |
| 15 | // width: 10rem; | 19 | width: 240px; |
| 16 | width: 20rem; | ||
| 17 | text-align: center; | 20 | text-align: center; |
| 18 | } | 21 | } |
| 19 | 22 | ||
| 20 | .w2 { | 23 | .w2 { |
| 21 | // width: 6.25rem; | 24 | width: 150px; |
| 22 | width: 12.5rem; | ||
| 23 | text-align: center; | 25 | text-align: center; |
| 24 | } | 26 | } |
| 25 | 27 | ||
| 26 | .table-header { | 28 | .table-header { |
| 27 | // width: 64.166667rem; | 29 | height: 39px; |
| 28 | height: 3.25rem; | ||
| 29 | border-top-left-radius: 8px; | 30 | border-top-left-radius: 8px; |
| 30 | border-top-right-radius: 8px; | 31 | border-top-right-radius: 8px; |
| 31 | background-color: #f2f2f2; | 32 | background-color: #f2f2f2; |
| ... | @@ -33,9 +34,8 @@ | ... | @@ -33,9 +34,8 @@ |
| 33 | align-items: center; | 34 | align-items: center; |
| 34 | 35 | ||
| 35 | .normal-header { | 36 | .normal-header { |
| 36 | // width: 58.833333rem; | ||
| 37 | @extend .bb; | 37 | @extend .bb; |
| 38 | padding: 0 2.75rem; | 38 | padding: 0 32px; |
| 39 | width: 100%; | 39 | width: 100%; |
| 40 | margin: auto; | 40 | margin: auto; |
| 41 | display: flex; | 41 | display: flex; |
| ... | @@ -50,7 +50,7 @@ | ... | @@ -50,7 +50,7 @@ |
| 50 | .guide { | 50 | .guide { |
| 51 | transition: all 0.5s; | 51 | transition: all 0.5s; |
| 52 | cursor: pointer; | 52 | cursor: pointer; |
| 53 | width: 1rem; | 53 | width: 12px; |
| 54 | height: 8px; | 54 | height: 8px; |
| 55 | background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center; | 55 | background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center; |
| 56 | background-size: 100% 100%; | 56 | background-size: 100% 100%; |
| ... | @@ -64,7 +64,6 @@ | ... | @@ -64,7 +64,6 @@ |
| 64 | } | 64 | } |
| 65 | 65 | ||
| 66 | .table-content { | 66 | .table-content { |
| 67 | // width: 64.166667rem; | ||
| 68 | 67 | ||
| 69 | height: auto; | 68 | height: auto; |
| 70 | // display: inline-block; | 69 | // display: inline-block; |
| ... | @@ -73,13 +72,13 @@ | ... | @@ -73,13 +72,13 @@ |
| 73 | border-left: solid 1px #f2f2f2; | 72 | border-left: solid 1px #f2f2f2; |
| 74 | border-right: solid 1px #f2f2f2; | 73 | border-right: solid 1px #f2f2f2; |
| 75 | border-bottom: solid 1px #f2f2f2; | 74 | border-bottom: solid 1px #f2f2f2; |
| 76 | padding: 0 2.75rem; | 75 | padding: 0 32px; |
| 77 | max-height: 41.666667rem; | 76 | max-height: 500px; |
| 78 | transition: max-height ease-out 0.3s !important; | 77 | transition: max-height ease-out 0.3s !important; |
| 79 | overflow: scroll; | 78 | overflow: scroll; |
| 80 | 79 | ||
| 81 | .data-line { | 80 | .data-line { |
| 82 | height: 4.416667rem; | 81 | height: 50px; |
| 83 | margin: auto; | 82 | margin: auto; |
| 84 | display: flex; | 83 | display: flex; |
| 85 | justify-content: space-between; | 84 | justify-content: space-between; |
| ... | @@ -108,17 +107,17 @@ | ... | @@ -108,17 +107,17 @@ |
| 108 | } | 107 | } |
| 109 | 108 | ||
| 110 | .separator-v { | 109 | .separator-v { |
| 111 | height: 2.5rem; | 110 | height: 30px; |
| 112 | width: 2px; | 111 | width: 2px; |
| 113 | background-color: #f2f2f2; | 112 | background-color: #f2f2f2; |
| 114 | margin: 0 .916667rem; | 113 | margin: 0 11px; |
| 115 | } | 114 | } |
| 116 | } | 115 | } |
| 117 | 116 | ||
| 118 | 117 | ||
| 119 | .label span { | 118 | .label span { |
| 120 | color: #f05a23; | 119 | color: #f05a23; |
| 121 | margin-left: .583333rem; | 120 | margin-left: 7px; |
| 122 | cursor: pointer; | 121 | cursor: pointer; |
| 123 | text-decoration: underline; | 122 | text-decoration: underline; |
| 124 | } | 123 | } |
| ... | @@ -145,8 +144,6 @@ | ... | @@ -145,8 +144,6 @@ |
| 145 | 144 | ||
| 146 | } | 145 | } |
| 147 | 146 | ||
| 148 | |||
| 149 | |||
| 150 | .cell-between { | 147 | .cell-between { |
| 151 | .data-line { | 148 | .data-line { |
| 152 | .td { | 149 | .td { |
| ... | @@ -163,12 +160,12 @@ | ... | @@ -163,12 +160,12 @@ |
| 163 | } | 160 | } |
| 164 | 161 | ||
| 165 | .icon-download { | 162 | .icon-download { |
| 166 | margin: 0 1rem; | 163 | margin: 0 12px; |
| 167 | } | 164 | } |
| 168 | 165 | ||
| 169 | .icon-check { | 166 | .icon-check { |
| 170 | height: 1.4rem; | 167 | height: 17px; |
| 171 | margin: 0 1rem; | 168 | margin: 0 12px; |
| 172 | } | 169 | } |
| 173 | 170 | ||
| 174 | @media (max-width: 1200px) { | 171 | @media (max-width: 1200px) { |
| ... | @@ -181,26 +178,27 @@ | ... | @@ -181,26 +178,27 @@ |
| 181 | } | 178 | } |
| 182 | } | 179 | } |
| 183 | 180 | ||
| 184 | .container::-webkit-scrollbar { | 181 | // .container::-webkit-scrollbar { |
| 185 | display: none; | 182 | // display: none; |
| 186 | } | 183 | // } |
| 187 | 184 | ||
| 188 | .container{ | 185 | // .container{ |
| 189 | -ms-overflow-style: none; | 186 | // -ms-overflow-style: none; |
| 190 | } | 187 | // } |
| 191 | 188 | ||
| 192 | .list-container::-webkit-scrollbar { | 189 | // .list-container::-webkit-scrollbar { |
| 193 | display: none; | 190 | // display: none; |
| 194 | } | 191 | // } |
| 195 | 192 | ||
| 196 | .list-container{ | 193 | // .list-container{ |
| 197 | -ms-overflow-style: none; | 194 | // -ms-overflow-style: none; |
| 198 | } | 195 | // } |
| 199 | 196 | ||
| 200 | .table-content::-webkit-scrollbar { | 197 | // .table-content::-webkit-scrollbar { |
| 201 | display: none; | 198 | // display: none; |
| 202 | } | 199 | // } |
| 200 | |||
| 201 | // .table-content{ | ||
| 202 | // -ms-overflow-style: none; | ||
| 203 | // } | ||
| 203 | 204 | ||
| 204 | .table-content{ | ||
| 205 | -ms-overflow-style: none; | ||
| 206 | } | ... | ... |
| 1 | <template> | 1 | <template> |
| 2 | <div class="container"> | 2 | <div class="container"> |
| 3 | |||
| 4 | <!-- 登陆/注册提示 --> | ||
| 3 | <auth @onLogin="userLogin" @onLogout="userLogout" :checkProfile="true" :tipModel="'m1'" ref="auth"></auth> | 5 | <auth @onLogin="userLogin" @onLogout="userLogout" :checkProfile="true" :tipModel="'m1'" ref="auth"></auth> |
| 4 | <div v-if="showForm"> | 6 | <div v-if="showForm"> |
| 7 | <!-- 保单列表 --> | ||
| 5 | <policy-head-list :multiSelectable="false" @onSelect="handlePolicySelect"></policy-head-list> | 8 | <policy-head-list :multiSelectable="false" @onSelect="handlePolicySelect"></policy-head-list> |
| 6 | 9 | ||
| 10 | <!-- 保单详情 --> | ||
| 7 | <template v-if="dataForm"> | 11 | <template v-if="dataForm"> |
| 8 | |||
| 9 | <div class="cell-group"> | 12 | <div class="cell-group"> |
| 10 | <div class="table-header"> | 13 | <div class="table-header"> |
| 11 | <div class="normal-header"> | 14 | <div class="normal-header"> |
| ... | @@ -253,9 +256,7 @@ | ... | @@ -253,9 +256,7 @@ |
| 253 | <div class="separator-h"></div> | 256 | <div class="separator-h"></div> |
| 254 | <div v-for="(item,index) in dataForm.pandupList" :key="index"> | 257 | <div v-for="(item,index) in dataForm.pandupList" :key="index"> |
| 255 | <div class="data-line"> | 258 | <div class="data-line"> |
| 256 | <!-- <div class="td w2">{{item.paidPeriod}}</div> --> | ||
| 257 | <div class="td w2">{{formatPanduPayPeriod(item.policyYear,item.policyPeriod)}}</div> | 259 | <div class="td w2">{{formatPanduPayPeriod(item.policyYear,item.policyPeriod)}}</div> |
| 258 | <!-- <div class="td w2">{{formatPayType(item.payTypeValue)}}</div> --> | ||
| 259 | <div class="td w2">{{formatPayMode(dataForm.payMode)}}</div> | 260 | <div class="td w2">{{formatPayMode(dataForm.payMode)}}</div> |
| 260 | <div class="td w2">{{item.receiptDate?item.receiptDate.split(" ")[0]:""}}</div> | 261 | <div class="td w2">{{item.receiptDate?item.receiptDate.split(" ")[0]:""}}</div> |
| 261 | <div class="td w2">{{dataForm.moneyMark}} {{formatMoney(item.totalPremium)}}</div> | 262 | <div class="td w2">{{dataForm.moneyMark}} {{formatMoney(item.totalPremium)}}</div> |
| ... | @@ -265,9 +266,6 @@ | ... | @@ -265,9 +266,6 @@ |
| 265 | </div> | 266 | </div> |
| 266 | </div> | 267 | </div> |
| 267 | </template> | 268 | </template> |
| 268 | |||
| 269 | <template v-else> | ||
| 270 | </template> | ||
| 271 | </div> | 269 | </div> |
| 272 | </div> | 270 | </div> |
| 273 | </template> | 271 | </template> | ... | ... |
| ... | @@ -3,7 +3,7 @@ | ... | @@ -3,7 +3,7 @@ |
| 3 | .content {} | 3 | .content {} |
| 4 | 4 | ||
| 5 | .top-space { | 5 | .top-space { |
| 6 | height: 2.25rem; | 6 | height: 27px; |
| 7 | } | 7 | } |
| 8 | 8 | ||
| 9 | .payment { | 9 | .payment { |
| ... | @@ -15,22 +15,22 @@ | ... | @@ -15,22 +15,22 @@ |
| 15 | 15 | ||
| 16 | &-item { | 16 | &-item { |
| 17 | @extend .pointer; | 17 | @extend .pointer; |
| 18 | @include border-top-radius(.5rem); | 18 | @include border-top-radius(6px); |
| 19 | display: flex; | 19 | display: flex; |
| 20 | justify-content: center; | 20 | justify-content: center; |
| 21 | align-items: center; | 21 | align-items: center; |
| 22 | 22 | ||
| 23 | height: 4.75rem; | 23 | height: 57px; |
| 24 | background-color: #f2f2f2; | 24 | background-color: #f2f2f2; |
| 25 | padding: 0 20px; | 25 | padding: 0 20px; |
| 26 | margin-right: $marginSmall; | 26 | margin-right: $marginSmall; |
| 27 | min-width: 10rem; | 27 | min-width: 120px; |
| 28 | 28 | ||
| 29 | &-icon { | 29 | &-icon { |
| 30 | margin-right: 0.6rem; | 30 | margin-right: 7.2px; |
| 31 | 31 | ||
| 32 | img { | 32 | img { |
| 33 | width: 2.4rem; | 33 | width: 28.8px; |
| 34 | } | 34 | } |
| 35 | } | 35 | } |
| 36 | 36 | ||
| ... | @@ -53,10 +53,10 @@ | ... | @@ -53,10 +53,10 @@ |
| 53 | 53 | ||
| 54 | &-cont { | 54 | &-cont { |
| 55 | @extend .bb; | 55 | @extend .bb; |
| 56 | padding: 4.25rem 2rem $marginMedium-M 2.5rem; | 56 | padding: 51px 24px $marginMedium-M 30px; |
| 57 | border: solid 1px #f2f2f2; | 57 | border: solid 1px #f2f2f2; |
| 58 | background-color: #ffffff; | 58 | background-color: #ffffff; |
| 59 | min-height: 43.75rem; | 59 | min-height: 525px; |
| 60 | @include border-bottom-radius(8px); | 60 | @include border-bottom-radius(8px); |
| 61 | 61 | ||
| 62 | 62 | ... | ... |
| ... | @@ -29,7 +29,7 @@ | ... | @@ -29,7 +29,7 @@ |
| 29 | color: #f05a23; | 29 | color: #f05a23; |
| 30 | display: flex; | 30 | display: flex; |
| 31 | align-items: center; | 31 | align-items: center; |
| 32 | margin-bottom: .7rem; | 32 | margin-bottom: 8.4px; |
| 33 | 33 | ||
| 34 | .icon { | 34 | .icon { |
| 35 | width: 26px; | 35 | width: 26px; |
| ... | @@ -37,7 +37,7 @@ | ... | @@ -37,7 +37,7 @@ |
| 37 | } | 37 | } |
| 38 | 38 | ||
| 39 | img { | 39 | img { |
| 40 | height: 1rem; | 40 | height: 12px; |
| 41 | } | 41 | } |
| 42 | } | 42 | } |
| 43 | 43 | ||
| ... | @@ -68,18 +68,18 @@ | ... | @@ -68,18 +68,18 @@ |
| 68 | 68 | ||
| 69 | // 长文本 | 69 | // 长文本 |
| 70 | .textarea { | 70 | .textarea { |
| 71 | min-height: 8.75rem; | 71 | min-height: 105px; |
| 72 | border-radius: 1rem; | 72 | border-radius: 12px; |
| 73 | @extend .bb; | 73 | @extend .bb; |
| 74 | padding: .75rem; | 74 | padding: 9px; |
| 75 | } | 75 | } |
| 76 | 76 | ||
| 77 | .down-arrow { | 77 | .down-arrow { |
| 78 | position: absolute; | 78 | position: absolute; |
| 79 | top: 2.2rem; | 79 | top: 26.4px; |
| 80 | right: 2rem; | 80 | right: 24px; |
| 81 | background-image: url('~@/assets/images/reservation/re-down-arrow.png'); | 81 | background-image: url('~@/assets/images/reservation/re-down-arrow.png'); |
| 82 | width: 1rem; | 82 | width: 12px; |
| 83 | height: 8px; | 83 | height: 8px; |
| 84 | pointer-events: none; | 84 | pointer-events: none; |
| 85 | cursor: default; | 85 | cursor: default; |
| ... | @@ -94,7 +94,7 @@ | ... | @@ -94,7 +94,7 @@ |
| 94 | 94 | ||
| 95 | .validator { | 95 | .validator { |
| 96 | color: $cOrange; | 96 | color: $cOrange; |
| 97 | margin-top: 0.5rem; | 97 | margin-top: 6px; |
| 98 | position: absolute; | 98 | position: absolute; |
| 99 | right: 192px; | 99 | right: 192px; |
| 100 | display: flex; | 100 | display: flex; |
| ... | @@ -103,7 +103,7 @@ | ... | @@ -103,7 +103,7 @@ |
| 103 | 103 | ||
| 104 | img { | 104 | img { |
| 105 | display: inline-block; | 105 | display: inline-block; |
| 106 | margin-right: 0.4rem; | 106 | margin-right: 4.8px; |
| 107 | } | 107 | } |
| 108 | } | 108 | } |
| 109 | } | 109 | } |
| ... | @@ -111,7 +111,7 @@ | ... | @@ -111,7 +111,7 @@ |
| 111 | } | 111 | } |
| 112 | 112 | ||
| 113 | .submit-btn { | 113 | .submit-btn { |
| 114 | width: 13.583333rem; | 114 | width: 163px; |
| 115 | height: 49px; | 115 | height: 49px; |
| 116 | margin: 0 auto 0; | 116 | margin: 0 auto 0; |
| 117 | line-height: 49px; | 117 | line-height: 49px; |
| ... | @@ -119,9 +119,9 @@ | ... | @@ -119,9 +119,9 @@ |
| 119 | background-blend-mode: soft-light, ; | 119 | background-blend-mode: soft-light, ; |
| 120 | background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429); | 120 | background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429); |
| 121 | text-align: center; | 121 | text-align: center; |
| 122 | font-size: 1.291667rem; | 122 | font-size: 15.5px; |
| 123 | color: #ffffff; | 123 | color: #ffffff; |
| 124 | border-radius: 3.5rem; | 124 | border-radius: 42px; |
| 125 | cursor: pointer; | 125 | cursor: pointer; |
| 126 | border: none; | 126 | border: none; |
| 127 | color: #ffffff; | 127 | color: #ffffff; |
| ... | @@ -132,7 +132,7 @@ | ... | @@ -132,7 +132,7 @@ |
| 132 | } | 132 | } |
| 133 | 133 | ||
| 134 | .submit-btn:lang(zh) { | 134 | .submit-btn:lang(zh) { |
| 135 | letter-spacing: .129167rem; | 135 | letter-spacing: 1.55px; |
| 136 | } | 136 | } |
| 137 | 137 | ||
| 138 | @media (max-width: 1200px) { | 138 | @media (max-width: 1200px) { | ... | ... |
| ... | @@ -10,7 +10,7 @@ | ... | @@ -10,7 +10,7 @@ |
| 10 | @include border-top-radius(8px); | 10 | @include border-top-radius(8px); |
| 11 | display: flex; | 11 | display: flex; |
| 12 | align-items: center; | 12 | align-items: center; |
| 13 | height: 3.25rem; | 13 | height: 39px; |
| 14 | color: #ffffff; | 14 | color: #ffffff; |
| 15 | font-weight: bold; | 15 | font-weight: bold; |
| 16 | 16 | ||
| ... | @@ -18,7 +18,7 @@ | ... | @@ -18,7 +18,7 @@ |
| 18 | } | 18 | } |
| 19 | 19 | ||
| 20 | &-header:lang(zh) { | 20 | &-header:lang(zh) { |
| 21 | letter-spacing: .1rem; | 21 | letter-spacing: 1.2px; |
| 22 | } | 22 | } |
| 23 | 23 | ||
| 24 | 24 | ||
| ... | @@ -40,7 +40,6 @@ | ... | @@ -40,7 +40,6 @@ |
| 40 | .hl { | 40 | .hl { |
| 41 | position: absolute; | 41 | position: absolute; |
| 42 | width: 95%; | 42 | width: 95%; |
| 43 | // width: 77rem; | ||
| 44 | height: 1px; | 43 | height: 1px; |
| 45 | background-color: #dcdddd; | 44 | background-color: #dcdddd; |
| 46 | bottom: 0; | 45 | bottom: 0; |
| ... | @@ -52,13 +51,13 @@ | ... | @@ -52,13 +51,13 @@ |
| 52 | 51 | ||
| 53 | .grid { | 52 | .grid { |
| 54 | position: relative; | 53 | position: relative; |
| 55 | padding: 2rem 3rem; | 54 | padding: 24px 36px; |
| 56 | background-color: #ffffff; | 55 | background-color: #ffffff; |
| 57 | 56 | ||
| 58 | .v-line { | 57 | .v-line { |
| 59 | position: absolute; | 58 | position: absolute; |
| 60 | width: 1px; | 59 | width: 1px; |
| 61 | height: 2.25rem; | 60 | height: 27px; |
| 62 | background-color: #dcdddd; | 61 | background-color: #dcdddd; |
| 63 | right: 0; | 62 | right: 0; |
| 64 | top: 0; | 63 | top: 0; |
| ... | @@ -67,7 +66,7 @@ | ... | @@ -67,7 +66,7 @@ |
| 67 | } | 66 | } |
| 68 | 67 | ||
| 69 | .icon { | 68 | .icon { |
| 70 | margin-right: .25rem; | 69 | margin-right: 3px; |
| 71 | display: inline-block; | 70 | display: inline-block; |
| 72 | } | 71 | } |
| 73 | } | 72 | } |
| ... | @@ -96,7 +95,7 @@ | ... | @@ -96,7 +95,7 @@ |
| 96 | } | 95 | } |
| 97 | 96 | ||
| 98 | .h-line { | 97 | .h-line { |
| 99 | width: 9rem; | 98 | width: 108px; |
| 100 | } | 99 | } |
| 101 | 100 | ||
| 102 | } | 101 | } |
| ... | @@ -108,19 +107,19 @@ | ... | @@ -108,19 +107,19 @@ |
| 108 | } | 107 | } |
| 109 | 108 | ||
| 110 | .w1 { | 109 | .w1 { |
| 111 | width: 13.25rem; | 110 | width: 159px; |
| 112 | } | 111 | } |
| 113 | 112 | ||
| 114 | .w2 { | 113 | .w2 { |
| 115 | width: 21.5rem; | 114 | width: 258px; |
| 116 | } | 115 | } |
| 117 | 116 | ||
| 118 | .w3 { | 117 | .w3 { |
| 119 | width: 10.75rem; | 118 | width: 129px; |
| 120 | } | 119 | } |
| 121 | 120 | ||
| 122 | .w4 { | 121 | .w4 { |
| 123 | width: 15.5rem | 122 | width: 186px |
| 124 | } | 123 | } |
| 125 | 124 | ||
| 126 | .w5 { | 125 | .w5 { |
| ... | @@ -149,11 +148,11 @@ | ... | @@ -149,11 +148,11 @@ |
| 149 | 148 | ||
| 150 | .icon { | 149 | .icon { |
| 151 | display: inline-block; | 150 | display: inline-block; |
| 152 | width: 1rem; | 151 | width: 12px; |
| 153 | margin-right: .5rem; | 152 | margin-right: 6px; |
| 154 | } | 153 | } |
| 155 | 154 | ||
| 156 | margin-top: 1.25rem; | 155 | margin-top: 15px; |
| 157 | } | 156 | } |
| 158 | 157 | ||
| 159 | @media (max-width: 1200px) { | 158 | @media (max-width: 1200px) { | ... | ... |
| 1 | @import '@/styles/_support.scss'; | 1 | @import '@/styles/_support.scss'; |
| 2 | 2 | ||
| 3 | .container { | 3 | .container { |
| 4 | padding-bottom: 2rem; | 4 | padding-bottom: 24px; |
| 5 | } | 5 | } |
| 6 | 6 | ||
| 7 | .border { | 7 | .border { |
| ... | @@ -20,30 +20,30 @@ | ... | @@ -20,30 +20,30 @@ |
| 20 | @include border-top-radius(8px); | 20 | @include border-top-radius(8px); |
| 21 | display: flex; | 21 | display: flex; |
| 22 | align-items: center; | 22 | align-items: center; |
| 23 | height: 3.25rem; | 23 | height: 39px; |
| 24 | color: #ffffff; | 24 | color: #ffffff; |
| 25 | font-weight: bold; | 25 | font-weight: bold; |
| 26 | 26 | ||
| 27 | &-item { | 27 | &-item { |
| 28 | @extend .bb; | 28 | @extend .bb; |
| 29 | padding: 0 2rem; | 29 | padding: 0 24px; |
| 30 | } | 30 | } |
| 31 | } | 31 | } |
| 32 | 32 | ||
| 33 | &-header:lang(zh) { | 33 | &-header:lang(zh) { |
| 34 | letter-spacing: .1rem; | 34 | letter-spacing: 1.2px; |
| 35 | } | 35 | } |
| 36 | } | 36 | } |
| 37 | 37 | ||
| 38 | 38 | ||
| 39 | .form { | 39 | .form { |
| 40 | @extend .bb; | 40 | @extend .bb; |
| 41 | padding: 1rem .75rem; | 41 | padding: 12px 9px; |
| 42 | 42 | ||
| 43 | &-item { | 43 | &-item { |
| 44 | position: relative; | 44 | position: relative; |
| 45 | margin-bottom: 28px; | 45 | margin-bottom: 28px; |
| 46 | padding: 0 1.25rem; | 46 | padding: 0 15px; |
| 47 | height: auto; | 47 | height: auto; |
| 48 | 48 | ||
| 49 | .label { | 49 | .label { |
| ... | @@ -51,7 +51,7 @@ | ... | @@ -51,7 +51,7 @@ |
| 51 | display: flex; | 51 | display: flex; |
| 52 | align-items: center; | 52 | align-items: center; |
| 53 | 53 | ||
| 54 | margin-bottom: .7rem; | 54 | margin-bottom: 8.4px; |
| 55 | 55 | ||
| 56 | .fla2{ | 56 | .fla2{ |
| 57 | @extend .bb; | 57 | @extend .bb; |
| ... | @@ -71,7 +71,7 @@ | ... | @@ -71,7 +71,7 @@ |
| 71 | } | 71 | } |
| 72 | 72 | ||
| 73 | img { | 73 | img { |
| 74 | height: 1rem; | 74 | height: 12px; |
| 75 | } | 75 | } |
| 76 | } | 76 | } |
| 77 | 77 | ||
| ... | @@ -80,7 +80,7 @@ | ... | @@ -80,7 +80,7 @@ |
| 80 | 80 | ||
| 81 | .icon2 { | 81 | .icon2 { |
| 82 | 82 | ||
| 83 | width: 1.2rem; | 83 | width: 14.4px; |
| 84 | display: flex; | 84 | display: flex; |
| 85 | } | 85 | } |
| 86 | 86 | ||
| ... | @@ -107,10 +107,10 @@ | ... | @@ -107,10 +107,10 @@ |
| 107 | 107 | ||
| 108 | // 长文本 | 108 | // 长文本 |
| 109 | .textarea { | 109 | .textarea { |
| 110 | min-height: 8.75rem; | 110 | min-height: 105px; |
| 111 | border-radius: 1rem; | 111 | border-radius: 12px; |
| 112 | @extend .bb; | 112 | @extend .bb; |
| 113 | padding: .75rem; | 113 | padding: 9px; |
| 114 | } | 114 | } |
| 115 | 115 | ||
| 116 | } | 116 | } |
| ... | @@ -119,12 +119,11 @@ | ... | @@ -119,12 +119,11 @@ |
| 119 | // 不换行 | 119 | // 不换行 |
| 120 | &-item2 { | 120 | &-item2 { |
| 121 | display: flex; | 121 | display: flex; |
| 122 | margin-bottom: 2.25rem; | 122 | margin-bottom: 27px; |
| 123 | 123 | ||
| 124 | .label { | 124 | .label { |
| 125 | // min-width: 12.833333rem; | 125 | height: 30px; |
| 126 | height: 2.5rem; | 126 | margin-right: 27px; |
| 127 | margin-right: 2.25rem; | ||
| 128 | color: $cFontGray; | 127 | color: $cFontGray; |
| 129 | } | 128 | } |
| 130 | 129 | ||
| ... | @@ -133,15 +132,15 @@ | ... | @@ -133,15 +132,15 @@ |
| 133 | display: flex; | 132 | display: flex; |
| 134 | 133 | ||
| 135 | .boo-btn { | 134 | .boo-btn { |
| 136 | // width: 5.25rem; | 135 | // width: 63px; |
| 137 | padding: 0 2.25rem; | 136 | padding: 0 27px; |
| 138 | height: 2.5rem; | 137 | height: 30px; |
| 139 | line-height: 2.5rem; | 138 | line-height: 30px; |
| 140 | border: solid 1px #dcdddd; | 139 | border: solid 1px #dcdddd; |
| 141 | background-color: #ffffff; | 140 | background-color: #ffffff; |
| 142 | border-radius: 2.5rem; | 141 | border-radius: 30px; |
| 143 | text-align: center; | 142 | text-align: center; |
| 144 | margin: 0 0.6rem; | 143 | margin: 0 7.2px; |
| 145 | } | 144 | } |
| 146 | 145 | ||
| 147 | .active { | 146 | .active { |
| ... | @@ -163,7 +162,7 @@ | ... | @@ -163,7 +162,7 @@ |
| 163 | } | 162 | } |
| 164 | 163 | ||
| 165 | .submit-btn { | 164 | .submit-btn { |
| 166 | width: 13.583333rem; | 165 | width: 163px; |
| 167 | height: 49px; | 166 | height: 49px; |
| 168 | margin: 0 auto 0; | 167 | margin: 0 auto 0; |
| 169 | line-height: 49px; | 168 | line-height: 49px; |
| ... | @@ -172,7 +171,7 @@ | ... | @@ -172,7 +171,7 @@ |
| 172 | background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429); | 171 | background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429); |
| 173 | text-align: center; | 172 | text-align: center; |
| 174 | color: #ffffff; | 173 | color: #ffffff; |
| 175 | border-radius: 3.5rem; | 174 | border-radius: 42px; |
| 176 | cursor: pointer; | 175 | cursor: pointer; |
| 177 | border: none; | 176 | border: none; |
| 178 | color: #ffffff; | 177 | color: #ffffff; |
| ... | @@ -183,7 +182,7 @@ | ... | @@ -183,7 +182,7 @@ |
| 183 | } | 182 | } |
| 184 | 183 | ||
| 185 | .submit-btn :lang(zh) { | 184 | .submit-btn :lang(zh) { |
| 186 | letter-spacing: .129167rem; | 185 | letter-spacing: 1.55px; |
| 187 | } | 186 | } |
| 188 | 187 | ||
| 189 | 188 | ... | ... |
| ... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | ||
| 3 | .list-container { | 3 | .list-container { |
| 4 | overflow-x: auto; | 4 | overflow-x: auto; |
| 5 | margin-bottom: 2rem; | 5 | margin-bottom: 24px; |
| 6 | } | 6 | } |
| 7 | 7 | ||
| 8 | .hide { | 8 | .hide { |
| ... | @@ -33,7 +33,7 @@ | ... | @@ -33,7 +33,7 @@ |
| 33 | position: absolute; | 33 | position: absolute; |
| 34 | transition: all 0.5s; | 34 | transition: all 0.5s; |
| 35 | cursor: pointer; | 35 | cursor: pointer; |
| 36 | width: 1rem; | 36 | width: 12px; |
| 37 | height: 8px; | 37 | height: 8px; |
| 38 | background: url("~@/assets/images/insurance-query/triangle-down2.png") no-repeat center center; | 38 | background: url("~@/assets/images/insurance-query/triangle-down2.png") no-repeat center center; |
| 39 | background-size: 100% 100%; | 39 | background-size: 100% 100%; |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | } | 47 | } |
| 48 | 48 | ||
| 49 | .cell-group { | 49 | .cell-group { |
| 50 | margin-bottom: 1rem; | 50 | margin-bottom: 12px; |
| 51 | 51 | ||
| 52 | &:last-child { | 52 | &:last-child { |
| 53 | margin-bottom: 0; | 53 | margin-bottom: 0; |
| ... | @@ -58,20 +58,20 @@ | ... | @@ -58,20 +58,20 @@ |
| 58 | } | 58 | } |
| 59 | 59 | ||
| 60 | .w1 { | 60 | .w1 { |
| 61 | // width: 10rem; | 61 | // width: 120px; |
| 62 | width: 20rem; | 62 | width: 240px; |
| 63 | text-align: center; | 63 | text-align: center; |
| 64 | } | 64 | } |
| 65 | 65 | ||
| 66 | .w2 { | 66 | .w2 { |
| 67 | // width: 6.25rem; | 67 | // width: 75px; |
| 68 | width: 12.5rem; | 68 | width: 150px; |
| 69 | text-align: center; | 69 | text-align: center; |
| 70 | } | 70 | } |
| 71 | 71 | ||
| 72 | .table-header { | 72 | .table-header { |
| 73 | // width: 64.166667rem; | 73 | // width: 770px; |
| 74 | height: 3.25rem; | 74 | height: 39px; |
| 75 | border-top-left-radius: 8px; | 75 | border-top-left-radius: 8px; |
| 76 | border-top-right-radius: 8px; | 76 | border-top-right-radius: 8px; |
| 77 | background-color: #f2f2f2; | 77 | background-color: #f2f2f2; |
| ... | @@ -79,9 +79,9 @@ | ... | @@ -79,9 +79,9 @@ |
| 79 | align-items: center; | 79 | align-items: center; |
| 80 | 80 | ||
| 81 | .normal-header { | 81 | .normal-header { |
| 82 | // width: 58.833333rem; | 82 | // width: 706px; |
| 83 | @extend .bb; | 83 | @extend .bb; |
| 84 | padding: 0 2.75rem; | 84 | padding: 0 32px; |
| 85 | width: 100%; | 85 | width: 100%; |
| 86 | margin: auto; | 86 | margin: auto; |
| 87 | display: flex; | 87 | display: flex; |
| ... | @@ -96,7 +96,7 @@ | ... | @@ -96,7 +96,7 @@ |
| 96 | .guide { | 96 | .guide { |
| 97 | transition: all 0.5s; | 97 | transition: all 0.5s; |
| 98 | cursor: pointer; | 98 | cursor: pointer; |
| 99 | width: 1rem; | 99 | width: 12px; |
| 100 | height: 8px; | 100 | height: 8px; |
| 101 | background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center; | 101 | background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center; |
| 102 | background-size: 100% 100%; | 102 | background-size: 100% 100%; |
| ... | @@ -110,24 +110,23 @@ | ... | @@ -110,24 +110,23 @@ |
| 110 | } | 110 | } |
| 111 | 111 | ||
| 112 | .table-content { | 112 | .table-content { |
| 113 | // width: 64.166667rem; | 113 | // width: 770px; |
| 114 | 114 | ||
| 115 | height: auto; | 115 | height: auto; |
| 116 | max-height: 50rem; | 116 | max-height: 600px; |
| 117 | // display: inline-block; | 117 | // display: inline-block; |
| 118 | border-bottom-left-radius: 8px; | 118 | border-bottom-left-radius: 8px; |
| 119 | border-bottom-right-radius: 8px; | 119 | border-bottom-right-radius: 8px; |
| 120 | border-left: solid 1px #f2f2f2; | 120 | border-left: solid 1px #f2f2f2; |
| 121 | border-right: solid 1px #f2f2f2; | 121 | border-right: solid 1px #f2f2f2; |
| 122 | border-bottom: solid 1px #f2f2f2; | 122 | border-bottom: solid 1px #f2f2f2; |
| 123 | padding: 0 2.75rem; | 123 | padding: 0 32px; |
| 124 | // max-height: 41.666667rem; | ||
| 125 | transition: max-height ease-out 0.3s !important; | 124 | transition: max-height ease-out 0.3s !important; |
| 126 | overflow: auto; | 125 | overflow: auto; |
| 127 | 126 | ||
| 128 | .data-line { | 127 | .data-line { |
| 129 | // padding: 0 2.75rem; | 128 | // padding: 0 32px; |
| 130 | height: 4.416667rem; | 129 | height: 50px; |
| 131 | margin: auto; | 130 | margin: auto; |
| 132 | display: flex; | 131 | display: flex; |
| 133 | justify-content: space-between; | 132 | justify-content: space-between; |
| ... | @@ -149,16 +148,16 @@ | ... | @@ -149,16 +148,16 @@ |
| 149 | } | 148 | } |
| 150 | 149 | ||
| 151 | .separator-v { | 150 | .separator-v { |
| 152 | height: 2.5rem; | 151 | height: 30px; |
| 153 | width: 2px; | 152 | width: 2px; |
| 154 | background-color: #f2f2f2; | 153 | background-color: #f2f2f2; |
| 155 | margin: 0 .916667rem; | 154 | margin: 0 11px; |
| 156 | } | 155 | } |
| 157 | } | 156 | } |
| 158 | 157 | ||
| 159 | .label span { | 158 | .label span { |
| 160 | color: $cOrange; | 159 | color: $cOrange; |
| 161 | margin-left: .583333rem; | 160 | margin-left: 7px; |
| 162 | cursor: pointer; | 161 | cursor: pointer; |
| 163 | text-decoration: underline; | 162 | text-decoration: underline; |
| 164 | } | 163 | } |
| ... | @@ -185,7 +184,7 @@ | ... | @@ -185,7 +184,7 @@ |
| 185 | 184 | ||
| 186 | .sp { | 185 | .sp { |
| 187 | text-decoration: underline; | 186 | text-decoration: underline; |
| 188 | padding: 0 .4rem; | 187 | padding: 0 4.8px; |
| 189 | } | 188 | } |
| 190 | 189 | ||
| 191 | .ac { | 190 | .ac { |
| ... | @@ -215,7 +214,7 @@ | ... | @@ -215,7 +214,7 @@ |
| 215 | } | 214 | } |
| 216 | 215 | ||
| 217 | .empty { | 216 | .empty { |
| 218 | height: 41.666667rem; | 217 | height: 500px; |
| 219 | display: flex; | 218 | display: flex; |
| 220 | align-items: center; | 219 | align-items: center; |
| 221 | justify-content: center; | 220 | justify-content: center; |
| ... | @@ -235,16 +234,15 @@ | ... | @@ -235,16 +234,15 @@ |
| 235 | } | 234 | } |
| 236 | } | 235 | } |
| 237 | 236 | ||
| 238 | @media (max-width: 1200px) { | 237 | // @media (max-width: 1200px) { |
| 239 | .list-container { | 238 | // .list-container { |
| 240 | display: -webkit-box; | 239 | // display: -webkit-box; |
| 241 | overflow-x: auto; | 240 | // overflow-x: auto; |
| 242 | -webkit-overflow-scrolling: touch; | 241 | // -webkit-overflow-scrolling: touch; |
| 243 | width: 92vw; | 242 | // width: 92vw; |
| 244 | 243 | // } | |
| 245 | } | 244 | // } |
| 246 | } | 245 | |
| 247 | 246 | // .list-container::-webkit-scrollbar { | |
| 248 | .list-container::-webkit-scrollbar { | 247 | // display: none; |
| 249 | display: none; | 248 | // } |
| 250 | } | ... | ... |
| ... | @@ -3,7 +3,7 @@ | ... | @@ -3,7 +3,7 @@ |
| 3 | 3 | ||
| 4 | 4 | ||
| 5 | input { | 5 | input { |
| 6 | padding: 0 2rem; | 6 | padding: 0 24px; |
| 7 | } | 7 | } |
| 8 | 8 | ||
| 9 | .top-space {} | 9 | .top-space {} |
| ... | @@ -13,7 +13,7 @@ input { | ... | @@ -13,7 +13,7 @@ input { |
| 13 | border-radius: 8px; | 13 | border-radius: 8px; |
| 14 | border: solid 1px #f2f2f2; | 14 | border: solid 1px #f2f2f2; |
| 15 | background-color: #ffffff; | 15 | background-color: #ffffff; |
| 16 | padding: 32px 34px 34px 2rem; | 16 | padding: 32px 34px 34px 24px; |
| 17 | } | 17 | } |
| 18 | 18 | ||
| 19 | .form { | 19 | .form { |
| ... | @@ -30,7 +30,7 @@ input { | ... | @@ -30,7 +30,7 @@ input { |
| 30 | color: $cOrange; | 30 | color: $cOrange; |
| 31 | display: flex; | 31 | display: flex; |
| 32 | align-items: center; | 32 | align-items: center; |
| 33 | margin-bottom: .7rem; | 33 | margin-bottom: 8.4px; |
| 34 | 34 | ||
| 35 | .icon { | 35 | .icon { |
| 36 | width: 26px; | 36 | width: 26px; |
| ... | @@ -38,7 +38,7 @@ input { | ... | @@ -38,7 +38,7 @@ input { |
| 38 | } | 38 | } |
| 39 | 39 | ||
| 40 | img { | 40 | img { |
| 41 | height: 1rem; | 41 | height: 12px; |
| 42 | } | 42 | } |
| 43 | } | 43 | } |
| 44 | 44 | ||
| ... | @@ -50,18 +50,18 @@ input { | ... | @@ -50,18 +50,18 @@ input { |
| 50 | 50 | ||
| 51 | // 长文本 | 51 | // 长文本 |
| 52 | .textarea { | 52 | .textarea { |
| 53 | min-height: 8.75rem; | 53 | min-height: 105px; |
| 54 | border-radius: 1rem; | 54 | border-radius: 12px; |
| 55 | @extend .bb; | 55 | @extend .bb; |
| 56 | padding: .75rem; | 56 | padding: 9px; |
| 57 | } | 57 | } |
| 58 | 58 | ||
| 59 | .down-arrow { | 59 | .down-arrow { |
| 60 | position: absolute; | 60 | position: absolute; |
| 61 | top: 2.2rem; | 61 | top: 26.4px; |
| 62 | right: 2rem; | 62 | right: 24px; |
| 63 | background-image: url('~@/assets/images/reservation/re-down-arrow.png'); | 63 | background-image: url('~@/assets/images/reservation/re-down-arrow.png'); |
| 64 | width: 1rem; | 64 | width: 12px; |
| 65 | height: 8px; | 65 | height: 8px; |
| 66 | pointer-events: none; | 66 | pointer-events: none; |
| 67 | cursor: default; | 67 | cursor: default; |
| ... | @@ -70,16 +70,16 @@ input { | ... | @@ -70,16 +70,16 @@ input { |
| 70 | 70 | ||
| 71 | .validator { | 71 | .validator { |
| 72 | color: $cOrange; | 72 | color: $cOrange; |
| 73 | margin-top: 0.5rem; | 73 | margin-top: 6px; |
| 74 | position: absolute; | 74 | position: absolute; |
| 75 | right: 1rem; | 75 | right: 12px; |
| 76 | display: flex; | 76 | display: flex; |
| 77 | align-items: center; | 77 | align-items: center; |
| 78 | // bottom: 0; | 78 | // bottom: 0; |
| 79 | 79 | ||
| 80 | img { | 80 | img { |
| 81 | display: inline-block; | 81 | display: inline-block; |
| 82 | margin-right: 0.4rem; | 82 | margin-right: 4.8px; |
| 83 | } | 83 | } |
| 84 | } | 84 | } |
| 85 | } | 85 | } |
| ... | @@ -87,11 +87,11 @@ input { | ... | @@ -87,11 +87,11 @@ input { |
| 87 | // 不换行 | 87 | // 不换行 |
| 88 | &-item2 { | 88 | &-item2 { |
| 89 | display: flex; | 89 | display: flex; |
| 90 | margin-bottom: 2.25rem; | 90 | margin-bottom: 27px; |
| 91 | 91 | ||
| 92 | .label { | 92 | .label { |
| 93 | height: 2.5rem; | 93 | height: 30px; |
| 94 | margin-right: 1rem; | 94 | margin-right: 12px; |
| 95 | } | 95 | } |
| 96 | 96 | ||
| 97 | .cont { | 97 | .cont { |
| ... | @@ -99,14 +99,14 @@ input { | ... | @@ -99,14 +99,14 @@ input { |
| 99 | display: flex; | 99 | display: flex; |
| 100 | 100 | ||
| 101 | .boo-btn { | 101 | .boo-btn { |
| 102 | width: 5.25rem; | 102 | width: 63px; |
| 103 | height: 2.5rem; | 103 | height: 30px; |
| 104 | line-height: 2.5rem; | 104 | line-height: 30px; |
| 105 | border: solid 1px #dcdddd; | 105 | border: solid 1px #dcdddd; |
| 106 | background-color: #ffffff; | 106 | background-color: #ffffff; |
| 107 | border-radius: 2.5rem; | 107 | border-radius: 30px; |
| 108 | text-align: center; | 108 | text-align: center; |
| 109 | margin: 0 0.6rem; | 109 | margin: 0 7.2px; |
| 110 | } | 110 | } |
| 111 | 111 | ||
| 112 | .active { | 112 | .active { |
| ... | @@ -130,14 +130,14 @@ input { | ... | @@ -130,14 +130,14 @@ input { |
| 130 | 130 | ||
| 131 | .ipt-wrap { | 131 | .ipt-wrap { |
| 132 | width: 50%; | 132 | width: 50%; |
| 133 | margin-left: 1.75rem; | 133 | margin-left: 21px; |
| 134 | 134 | ||
| 135 | input { | 135 | input { |
| 136 | color: #4c4948; | 136 | color: #4c4948; |
| 137 | } | 137 | } |
| 138 | 138 | ||
| 139 | input:lang(zh) { | 139 | input:lang(zh) { |
| 140 | letter-spacing: .116667rem; | 140 | letter-spacing: 1.4px; |
| 141 | } | 141 | } |
| 142 | } | 142 | } |
| 143 | 143 | ||
| ... | @@ -155,26 +155,26 @@ input { | ... | @@ -155,26 +155,26 @@ input { |
| 155 | 155 | ||
| 156 | .mt8 { | 156 | .mt8 { |
| 157 | margin-top: 8px; | 157 | margin-top: 8px; |
| 158 | margin-left: 10rem; | 158 | margin-left: 120px; |
| 159 | } | 159 | } |
| 160 | } | 160 | } |
| 161 | } | 161 | } |
| 162 | 162 | ||
| 163 | 163 | ||
| 164 | .notice { | 164 | .notice { |
| 165 | margin-top: 4rem; | 165 | margin-top: 48px; |
| 166 | @extend .bb; | 166 | @extend .bb; |
| 167 | padding: 0 1rem; | 167 | padding: 0 12px; |
| 168 | 168 | ||
| 169 | &-item { | 169 | &-item { |
| 170 | position: relative; | 170 | position: relative; |
| 171 | line-height: 2; | 171 | line-height: 2; |
| 172 | margin-bottom: 1rem; | 172 | margin-bottom: 12px; |
| 173 | 173 | ||
| 174 | &-icon { | 174 | &-icon { |
| 175 | width: 14px; | 175 | width: 14px; |
| 176 | position: absolute; | 176 | position: absolute; |
| 177 | top: .6rem; | 177 | top: 7.2px; |
| 178 | } | 178 | } |
| 179 | } | 179 | } |
| 180 | 180 | ||
| ... | @@ -184,9 +184,9 @@ input { | ... | @@ -184,9 +184,9 @@ input { |
| 184 | } | 184 | } |
| 185 | 185 | ||
| 186 | .submit-btn { | 186 | .submit-btn { |
| 187 | width: 13.583333rem; | 187 | width: 163px; |
| 188 | height: 49px; | 188 | height: 49px; |
| 189 | margin: 2.5rem auto; | 189 | margin: 30px auto; |
| 190 | line-height: 49px; | 190 | line-height: 49px; |
| 191 | box-shadow: 0px 10px 13px 0 rgba(236, 100, 41, 0.2); | 191 | box-shadow: 0px 10px 13px 0 rgba(236, 100, 41, 0.2); |
| 192 | background-blend-mode: soft-light, ; | 192 | background-blend-mode: soft-light, ; |
| ... | @@ -195,7 +195,7 @@ input { | ... | @@ -195,7 +195,7 @@ input { |
| 195 | text-align: center; | 195 | text-align: center; |
| 196 | font-size: $fontSize; | 196 | font-size: $fontSize; |
| 197 | color: #ffffff; | 197 | color: #ffffff; |
| 198 | border-radius: 3.5rem; | 198 | border-radius: 42px; |
| 199 | cursor: pointer; | 199 | cursor: pointer; |
| 200 | border: none; | 200 | border: none; |
| 201 | color: #ffffff; | 201 | color: #ffffff; |
| ... | @@ -207,7 +207,7 @@ input { | ... | @@ -207,7 +207,7 @@ input { |
| 207 | } | 207 | } |
| 208 | 208 | ||
| 209 | .submit-btn:lang(zh) { | 209 | .submit-btn:lang(zh) { |
| 210 | letter-spacing: .129167rem; | 210 | letter-spacing: 1.55px; |
| 211 | } | 211 | } |
| 212 | 212 | ||
| 213 | 213 | ... | ... |
| ... | @@ -32,6 +32,10 @@ import Reservation from './components/reservation.vue' | ... | @@ -32,6 +32,10 @@ import Reservation from './components/reservation.vue' |
| 32 | import ComplaintAcceptance from './components/complaint-acceptance.vue' | 32 | import ComplaintAcceptance from './components/complaint-acceptance.vue' |
| 33 | // 常用表格 | 33 | // 常用表格 |
| 34 | import CommonForm from './components/common-form.vue' | 34 | import CommonForm from './components/common-form.vue' |
| 35 | // 电子通知书查询 | ||
| 36 | import ECorrespondenceEnquiry from './components/e-correspondence-enquiry.vue' | ||
| 37 | // 常见问题 | ||
| 38 | import Faq from './components/faq.vue' | ||
| 35 | 39 | ||
| 36 | 40 | ||
| 37 | export default { | 41 | export default { |
| ... | @@ -98,6 +102,8 @@ export default { | ... | @@ -98,6 +102,8 @@ export default { |
| 98 | PolicyChangeGuide, | 102 | PolicyChangeGuide, |
| 99 | PolicyChangeContact, | 103 | PolicyChangeContact, |
| 100 | PolicyChangeInformation, | 104 | PolicyChangeInformation, |
| 101 | Clarms | 105 | Clarms, |
| 106 | ECorrespondenceEnquiry, | ||
| 107 | Faq, | ||
| 102 | } | 108 | } |
| 103 | } | 109 | } | ... | ... |
| ... | @@ -4,16 +4,15 @@ | ... | @@ -4,16 +4,15 @@ |
| 4 | display: flex; | 4 | display: flex; |
| 5 | margin: 28px auto; | 5 | margin: 28px auto; |
| 6 | position: relative; | 6 | position: relative; |
| 7 | |||
| 8 | } | 7 | } |
| 9 | 8 | ||
| 10 | .left-panel { | 9 | .left-panel { |
| 11 | width: 192px; | 10 | width: 220px; |
| 12 | margin-right: $marginMedium; | 11 | margin-right: $marginMedium; |
| 13 | 12 | ||
| 14 | .separator { | 13 | .separator { |
| 15 | margin: auto; | 14 | margin: auto; |
| 16 | width: 13.25rem; | 15 | width: 195px; |
| 17 | height: 1px; | 16 | height: 1px; |
| 18 | background-color: #dcdddd; | 17 | background-color: #dcdddd; |
| 19 | } | 18 | } |
| ... | @@ -21,7 +20,7 @@ | ... | @@ -21,7 +20,7 @@ |
| 21 | .menu-item { | 20 | .menu-item { |
| 22 | position: relative; | 21 | position: relative; |
| 23 | @extend .bb; | 22 | @extend .bb; |
| 24 | padding: 1.5rem 0; | 23 | padding: 18px 0; |
| 25 | font-weight: bold; | 24 | font-weight: bold; |
| 26 | color: $cFontGray; | 25 | color: $cFontGray; |
| 27 | text-align: center; | 26 | text-align: center; |
| ... | @@ -30,13 +29,12 @@ | ... | @@ -30,13 +29,12 @@ |
| 30 | align-items: center; | 29 | align-items: center; |
| 31 | justify-content: flex-start; | 30 | justify-content: flex-start; |
| 32 | border-bottom: solid 1px #dcdddd; | 31 | border-bottom: solid 1px #dcdddd; |
| 33 | width: 13.25rem; | 32 | width: 195px; |
| 34 | margin-left: 1.25rem; | ||
| 35 | 33 | ||
| 36 | .icon-wrap { | 34 | .icon-wrap { |
| 37 | @extend .bb; | 35 | @extend .bb; |
| 38 | padding-left: 0px; | 36 | padding-left: 0px; |
| 39 | width: 42px; | 37 | width: 40px; |
| 40 | 38 | ||
| 41 | .icon { | 39 | .icon { |
| 42 | max-height: 28px; | 40 | max-height: 28px; |
| ... | @@ -46,9 +44,10 @@ | ... | @@ -46,9 +44,10 @@ |
| 46 | .tit { | 44 | .tit { |
| 47 | flex: 1; | 45 | flex: 1; |
| 48 | @extend .bb; | 46 | @extend .bb; |
| 49 | padding: 0 4px; | 47 | padding: 0 0px; |
| 50 | text-align: left; | 48 | text-align: left; |
| 51 | 49 | word-wrap:break-word; | |
| 50 | font-size: 18px; | ||
| 52 | } | 51 | } |
| 53 | 52 | ||
| 54 | .sel { | 53 | .sel { |
| ... | @@ -58,7 +57,7 @@ | ... | @@ -58,7 +57,7 @@ |
| 58 | top: 0; | 57 | top: 0; |
| 59 | bottom: 0; | 58 | bottom: 0; |
| 60 | // right: 0; | 59 | // right: 0; |
| 61 | right: -1.75rem; | 60 | right: -12px; |
| 62 | margin: auto 0; | 61 | margin: auto 0; |
| 63 | background: url("~@/assets/images/insurance-query/triangle.png") no-repeat center center; | 62 | background: url("~@/assets/images/insurance-query/triangle.png") no-repeat center center; |
| 64 | @extend .bis; | 63 | @extend .bis; |
| ... | @@ -69,7 +68,7 @@ | ... | @@ -69,7 +68,7 @@ |
| 69 | } | 68 | } |
| 70 | 69 | ||
| 71 | &:first-child { | 70 | &:first-child { |
| 72 | padding: 0 0 1.5rem; | 71 | padding: 0 0 18px; |
| 73 | } | 72 | } |
| 74 | 73 | ||
| 75 | &:last-child { | 74 | &:last-child { |
| ... | @@ -84,8 +83,10 @@ | ... | @@ -84,8 +83,10 @@ |
| 84 | } | 83 | } |
| 85 | 84 | ||
| 86 | .right-panel { | 85 | .right-panel { |
| 87 | max-width: 975px; | 86 | // max-width: 975px; |
| 88 | width: 975px; | 87 | // width: 975px; |
| 88 | max-width: 972px; | ||
| 89 | width: 972px; | ||
| 89 | background-color: #ffffff; | 90 | background-color: #ffffff; |
| 90 | 91 | ||
| 91 | .panel { | 92 | .panel { | ... | ... |
| ... | @@ -52,6 +52,12 @@ | ... | @@ -52,6 +52,12 @@ |
| 52 | <div class="panel" v-if="activity == 'm8'"> | 52 | <div class="panel" v-if="activity == 'm8'"> |
| 53 | <common-form></common-form> | 53 | <common-form></common-form> |
| 54 | </div> | 54 | </div> |
| 55 | <div class="panel" v-if="activity == 'm9'"> | ||
| 56 | <e-correspondence-enquiry></e-correspondence-enquiry> | ||
| 57 | </div> | ||
| 58 | <div class="panel" v-if="activity == 'm10'"> | ||
| 59 | <faq></faq> | ||
| 60 | </div> | ||
| 55 | </div> | 61 | </div> |
| 56 | </div> | 62 | </div> |
| 57 | </template> | 63 | </template> | ... | ... |
| ... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | position: relative; | 4 | position: relative; |
| 5 | min-height: 50rem; | 5 | min-height: 600px; |
| 6 | padding-bottom: $marginMedium; | 6 | padding-bottom: $marginMedium; |
| 7 | color: $cFontGray; | 7 | color: $cFontGray; |
| 8 | font-size: $fontSize; | 8 | font-size: $fontSize; |
| ... | @@ -37,17 +37,17 @@ | ... | @@ -37,17 +37,17 @@ |
| 37 | 37 | ||
| 38 | .step { | 38 | .step { |
| 39 | @extend .fcc; | 39 | @extend .fcc; |
| 40 | margin-bottom: 3rem; | 40 | margin-bottom: 36px; |
| 41 | } | 41 | } |
| 42 | 42 | ||
| 43 | .login { | 43 | .login { |
| 44 | color: $cFontGray; | 44 | color: $cFontGray; |
| 45 | @extend .bb; | 45 | @extend .bb; |
| 46 | padding: 2.75rem 6.25rem 3.75rem; | 46 | padding: 32px 75px 45px; |
| 47 | border-bottom: solid 0.9rem $cGreen; | 47 | border-bottom: solid 10.8px $cGreen; |
| 48 | 48 | ||
| 49 | margin: auto; | 49 | margin: auto; |
| 50 | max-width: 51rem; | 50 | max-width: 612px; |
| 51 | border-radius: $borderRadius; | 51 | border-radius: $borderRadius; |
| 52 | @extend .box-shadow; | 52 | @extend .box-shadow; |
| 53 | background-color: #ffffff; | 53 | background-color: #ffffff; |
| ... | @@ -62,24 +62,24 @@ | ... | @@ -62,24 +62,24 @@ |
| 62 | } | 62 | } |
| 63 | 63 | ||
| 64 | &-tit:lang(zh) { | 64 | &-tit:lang(zh) { |
| 65 | letter-spacing: .2rem; | 65 | letter-spacing: 2.4px; |
| 66 | } | 66 | } |
| 67 | 67 | ||
| 68 | &-tit-space-1 { | 68 | &-tit-space-1 { |
| 69 | height: 2rem; | 69 | height: 24px; |
| 70 | } | 70 | } |
| 71 | 71 | ||
| 72 | &-nav { | 72 | &-nav { |
| 73 | margin: 2.25rem 0 auto; | 73 | margin: 27px 0 auto; |
| 74 | display: flex; | 74 | display: flex; |
| 75 | justify-content: center; | 75 | justify-content: center; |
| 76 | align-items: center; | 76 | align-items: center; |
| 77 | 77 | ||
| 78 | &-v-line { | 78 | &-v-line { |
| 79 | width: .2rem; | 79 | width: 2.4px; |
| 80 | height: 1.25rem; | 80 | height: 15px; |
| 81 | background-color: #4c4948; | 81 | background-color: #4c4948; |
| 82 | margin: 0 2.25rem; | 82 | margin: 0 27px; |
| 83 | } | 83 | } |
| 84 | 84 | ||
| 85 | &-tit { | 85 | &-tit { |
| ... | @@ -96,14 +96,14 @@ | ... | @@ -96,14 +96,14 @@ |
| 96 | } | 96 | } |
| 97 | 97 | ||
| 98 | &-protocol { | 98 | &-protocol { |
| 99 | margin: 2.5rem auto 0; | 99 | margin: 30px auto 0; |
| 100 | display: flex; | 100 | display: flex; |
| 101 | align-items: center; | 101 | align-items: center; |
| 102 | padding-left: 1rem; | 102 | padding-left: 12px; |
| 103 | 103 | ||
| 104 | .check { | 104 | .check { |
| 105 | height: 1rem; | 105 | height: 12px; |
| 106 | margin-right: .6rem; | 106 | margin-right: 7.2px; |
| 107 | } | 107 | } |
| 108 | 108 | ||
| 109 | .protocol { | 109 | .protocol { |
| ... | @@ -115,11 +115,11 @@ | ... | @@ -115,11 +115,11 @@ |
| 115 | display: flex; | 115 | display: flex; |
| 116 | // justify-content: space-between; | 116 | // justify-content: space-between; |
| 117 | justify-content: center; | 117 | justify-content: center; |
| 118 | margin-top: 2rem; | 118 | margin-top: 24px; |
| 119 | } | 119 | } |
| 120 | 120 | ||
| 121 | &-submit { | 121 | &-submit { |
| 122 | @include btc2(17.25rem, 5.25rem, 16px); | 122 | @include btc2(207px, 63px, 16px); |
| 123 | } | 123 | } |
| 124 | 124 | ||
| 125 | &-submit:lang(zh) { | 125 | &-submit:lang(zh) { |
| ... | @@ -127,12 +127,12 @@ | ... | @@ -127,12 +127,12 @@ |
| 127 | } | 127 | } |
| 128 | 128 | ||
| 129 | &-func { | 129 | &-func { |
| 130 | margin: 1.5rem auto 0; | 130 | margin: 18px auto 0; |
| 131 | display: flex; | 131 | display: flex; |
| 132 | justify-content: center; | 132 | justify-content: center; |
| 133 | 133 | ||
| 134 | &-btn { | 134 | &-btn { |
| 135 | margin: 0 1.25rem; | 135 | margin: 0 15px; |
| 136 | text-decoration: underline; | 136 | text-decoration: underline; |
| 137 | } | 137 | } |
| 138 | } | 138 | } |
| ... | @@ -159,23 +159,23 @@ | ... | @@ -159,23 +159,23 @@ |
| 159 | } | 159 | } |
| 160 | 160 | ||
| 161 | input:lang(zh) { | 161 | input:lang(zh) { |
| 162 | letter-spacing: .1rem; | 162 | letter-spacing: 1.2px; |
| 163 | } | 163 | } |
| 164 | 164 | ||
| 165 | &-item { | 165 | &-item { |
| 166 | position: relative; | 166 | position: relative; |
| 167 | margin-bottom: 1.75rem; | 167 | margin-bottom: 21px; |
| 168 | padding: 0 $marginSmall; | 168 | padding: 0 $marginSmall; |
| 169 | 169 | ||
| 170 | .label { | 170 | .label { |
| 171 | color: $cOrange; | 171 | color: $cOrange; |
| 172 | display: flex; | 172 | display: flex; |
| 173 | align-items: center; | 173 | align-items: center; |
| 174 | margin-bottom: 1.25rem; | 174 | margin-bottom: 15px; |
| 175 | 175 | ||
| 176 | img { | 176 | img { |
| 177 | height: 1rem; | 177 | height: 12px; |
| 178 | margin-right: 1rem; | 178 | margin-right: 12px; |
| 179 | } | 179 | } |
| 180 | } | 180 | } |
| 181 | 181 | ||
| ... | @@ -190,7 +190,7 @@ | ... | @@ -190,7 +190,7 @@ |
| 190 | } | 190 | } |
| 191 | 191 | ||
| 192 | .ipt:lang(zh) { | 192 | .ipt:lang(zh) { |
| 193 | letter-spacing: .1rem; | 193 | letter-spacing: 1.2px; |
| 194 | } | 194 | } |
| 195 | 195 | ||
| 196 | .date { | 196 | .date { |
| ... | @@ -199,14 +199,14 @@ | ... | @@ -199,14 +199,14 @@ |
| 199 | 199 | ||
| 200 | // 长文本 | 200 | // 长文本 |
| 201 | .textarea { | 201 | .textarea { |
| 202 | min-height: 8.75rem; | 202 | min-height: 105px; |
| 203 | border-radius: 1rem; | 203 | border-radius: 12px; |
| 204 | } | 204 | } |
| 205 | 205 | ||
| 206 | .down-arrow { | 206 | .down-arrow { |
| 207 | position: absolute; | 207 | position: absolute; |
| 208 | top: 2.2rem; | 208 | top: 26.4px; |
| 209 | right: 2rem; | 209 | right: 24px; |
| 210 | } | 210 | } |
| 211 | 211 | ||
| 212 | 212 | ||
| ... | @@ -214,11 +214,11 @@ | ... | @@ -214,11 +214,11 @@ |
| 214 | @extend .fcc; | 214 | @extend .fcc; |
| 215 | // font-family: Arial; | 215 | // font-family: Arial; |
| 216 | font-size: 18px; | 216 | font-size: 18px; |
| 217 | width: 8.5rem; | 217 | width: 102px; |
| 218 | border: solid 1px #dcdddd; | 218 | border: solid 1px #dcdddd; |
| 219 | background-color: #f2f2f2; | 219 | background-color: #f2f2f2; |
| 220 | flex: none; | 220 | flex: none; |
| 221 | margin-left: 1.5rem; | 221 | margin-left: 18px; |
| 222 | color: $cFontGray; | 222 | color: $cFontGray; |
| 223 | } | 223 | } |
| 224 | 224 | ||
| ... | @@ -231,7 +231,7 @@ | ... | @@ -231,7 +231,7 @@ |
| 231 | 231 | ||
| 232 | .ipt-code { | 232 | .ipt-code { |
| 233 | flex: 1; | 233 | flex: 1; |
| 234 | padding-right: 1.75rem; | 234 | padding-right: 21px; |
| 235 | } | 235 | } |
| 236 | 236 | ||
| 237 | .veri-btn { | 237 | .veri-btn { |
| ... | @@ -247,15 +247,15 @@ | ... | @@ -247,15 +247,15 @@ |
| 247 | 247 | ||
| 248 | .validator { | 248 | .validator { |
| 249 | color: $cOrange; | 249 | color: $cOrange; |
| 250 | margin-top: 0.5rem; | 250 | margin-top: 6px; |
| 251 | position: absolute; | 251 | position: absolute; |
| 252 | right: .5rem; | 252 | right: 6px; |
| 253 | display: flex; | 253 | display: flex; |
| 254 | align-items: center; | 254 | align-items: center; |
| 255 | 255 | ||
| 256 | img { | 256 | img { |
| 257 | display: inline-block; | 257 | display: inline-block; |
| 258 | margin-right: 0.4rem; | 258 | margin-right: 4.8px; |
| 259 | } | 259 | } |
| 260 | } | 260 | } |
| 261 | } | 261 | } |
| ... | @@ -273,27 +273,26 @@ | ... | @@ -273,27 +273,26 @@ |
| 273 | } | 273 | } |
| 274 | 274 | ||
| 275 | .login { | 275 | .login { |
| 276 | padding: 1rem 1rem 3.5rem; | 276 | padding: 12px 12px 42px; |
| 277 | border-bottom: none; | 277 | border-bottom: none; |
| 278 | 278 | ||
| 279 | min-height: 42rem; | 279 | min-height: 504px; |
| 280 | 280 | ||
| 281 | &-tit-space-1 { | 281 | &-tit-space-1 { |
| 282 | // height: 5.25rem; | ||
| 283 | } | 282 | } |
| 284 | 283 | ||
| 285 | &-tit-space-4 { | 284 | &-tit-space-4 { |
| 286 | height: 1rem; | 285 | height: 12px; |
| 287 | } | 286 | } |
| 288 | 287 | ||
| 289 | 288 | ||
| 290 | &-nav { | 289 | &-nav { |
| 291 | margin: 1.75rem auto 1rem; | 290 | margin: 21px auto 12px; |
| 292 | } | 291 | } |
| 293 | 292 | ||
| 294 | .form { | 293 | .form { |
| 295 | &-item { | 294 | &-item { |
| 296 | margin: 2rem auto 0; | 295 | margin: 24px auto 0; |
| 297 | } | 296 | } |
| 298 | } | 297 | } |
| 299 | 298 | ||
| ... | @@ -303,9 +302,9 @@ | ... | @@ -303,9 +302,9 @@ |
| 303 | 302 | ||
| 304 | &-submit { | 303 | &-submit { |
| 305 | margin: 0 auto 0; | 304 | margin: 0 auto 0; |
| 306 | width: 17.25rem; | 305 | width: 207px; |
| 307 | height: 3.25rem; | 306 | height: 39px; |
| 308 | line-height: 3.25rem; | 307 | line-height: 39px; |
| 309 | } | 308 | } |
| 310 | } | 309 | } |
| 311 | 310 | ||
| ... | @@ -325,7 +324,7 @@ | ... | @@ -325,7 +324,7 @@ |
| 325 | } | 324 | } |
| 326 | 325 | ||
| 327 | .box-shadow { | 326 | .box-shadow { |
| 328 | box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15); | 327 | box-shadow: 0 0 18px 0 rgba(255, 87, 0, 0.15); |
| 329 | } | 328 | } |
| 330 | 329 | ||
| 331 | @media (max-width: 1200px) { | 330 | @media (max-width: 1200px) { | ... | ... |
| 1 | @import '@/styles/_support.scss'; | 1 | @import '@/styles/_support.scss'; |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | padding-bottom: 2.25rem; | 4 | padding-bottom: 27px; |
| 5 | } | 5 | } |
| 6 | 6 | ||
| 7 | .top-space { | 7 | .top-space { |
| 8 | height: 2.25rem; | 8 | height: 27px; |
| 9 | } | 9 | } |
| 10 | 10 | ||
| 11 | .box { | 11 | .box { |
| ... | @@ -110,16 +110,16 @@ | ... | @@ -110,16 +110,16 @@ |
| 110 | 110 | ||
| 111 | 111 | ||
| 112 | position: relative; | 112 | position: relative; |
| 113 | width: 24.25rem; | 113 | width: 291px; |
| 114 | // width: 100%; | 114 | // width: 100%; |
| 115 | height: 32.75rem; | 115 | height: 393px; |
| 116 | border-radius: $borderRadiusSmall; | 116 | border-radius: $borderRadiusSmall; |
| 117 | @extend .box-shadow; | 117 | @extend .box-shadow; |
| 118 | background-color: #fbfbfb; | 118 | background-color: #fbfbfb; |
| 119 | 119 | ||
| 120 | .img { | 120 | .img { |
| 121 | width: 100%; | 121 | width: 100%; |
| 122 | height: 24.25rem; | 122 | height: 291px; |
| 123 | background-size: cover; | 123 | background-size: cover; |
| 124 | } | 124 | } |
| 125 | 125 | ||
| ... | @@ -148,10 +148,10 @@ | ... | @@ -148,10 +148,10 @@ |
| 148 | position: absolute; | 148 | position: absolute; |
| 149 | left: 0; | 149 | left: 0; |
| 150 | right: 0; | 150 | right: 0; |
| 151 | bottom: 3rem; | 151 | bottom: 36px; |
| 152 | margin: 0 auto; | 152 | margin: 0 auto; |
| 153 | 153 | ||
| 154 | @include btc2(13.5rem, 4rem, 16px); | 154 | @include btc2(162px, 48px, 16px); |
| 155 | } | 155 | } |
| 156 | 156 | ||
| 157 | img { | 157 | img { |
| ... | @@ -226,7 +226,7 @@ | ... | @@ -226,7 +226,7 @@ |
| 226 | } | 226 | } |
| 227 | 227 | ||
| 228 | .box-shadow { | 228 | .box-shadow { |
| 229 | box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15); | 229 | box-shadow: 0 0 18px 0 rgba(255, 87, 0, 0.15); |
| 230 | } | 230 | } |
| 231 | 231 | ||
| 232 | @media (max-width: 1200px) { | 232 | @media (max-width: 1200px) { | ... | ... |
| ... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | position: relative; | 4 | position: relative; |
| 5 | min-height: 50rem; | 5 | min-height: 600px; |
| 6 | padding-bottom: $marginMedium; | 6 | padding-bottom: $marginMedium; |
| 7 | color: $cFontGray; | 7 | color: $cFontGray; |
| 8 | font-size: $fontSize; | 8 | font-size: $fontSize; |
| ... | @@ -21,7 +21,7 @@ | ... | @@ -21,7 +21,7 @@ |
| 21 | } | 21 | } |
| 22 | 22 | ||
| 23 | .mr30{ | 23 | .mr30{ |
| 24 | margin-right: 2.5rem ; | 24 | margin-right: 30px ; |
| 25 | } | 25 | } |
| 26 | .ebg { | 26 | .ebg { |
| 27 | background: url('~@/assets/images/common/login-bg.png') center no-repeat; | 27 | background: url('~@/assets/images/common/login-bg.png') center no-repeat; |
| ... | @@ -34,17 +34,17 @@ | ... | @@ -34,17 +34,17 @@ |
| 34 | 34 | ||
| 35 | .step { | 35 | .step { |
| 36 | @extend .fcc; | 36 | @extend .fcc; |
| 37 | margin-bottom: 3rem; | 37 | margin-bottom: 36px; |
| 38 | } | 38 | } |
| 39 | 39 | ||
| 40 | .login { | 40 | .login { |
| 41 | color: $cFontGray; | 41 | color: $cFontGray; |
| 42 | @extend .bb; | 42 | @extend .bb; |
| 43 | padding: 2.75rem 6.25rem 3.75rem; | 43 | padding: 32px 75px 45px; |
| 44 | border-bottom: solid 0.9rem $cGreen; | 44 | border-bottom: solid 10.8px $cGreen; |
| 45 | 45 | ||
| 46 | margin: auto; | 46 | margin: auto; |
| 47 | max-width: 51rem; | 47 | max-width: 612px; |
| 48 | border-radius: $borderRadius; | 48 | border-radius: $borderRadius; |
| 49 | @extend .box-shadow; | 49 | @extend .box-shadow; |
| 50 | background-color: #ffffff; | 50 | background-color: #ffffff; |
| ... | @@ -59,24 +59,24 @@ | ... | @@ -59,24 +59,24 @@ |
| 59 | } | 59 | } |
| 60 | 60 | ||
| 61 | &-tit:lang(zh) { | 61 | &-tit:lang(zh) { |
| 62 | letter-spacing: .2rem; | 62 | letter-spacing: 2.4px; |
| 63 | } | 63 | } |
| 64 | 64 | ||
| 65 | &-tit-space-1 { | 65 | &-tit-space-1 { |
| 66 | height: 2rem; | 66 | height: 24px; |
| 67 | } | 67 | } |
| 68 | 68 | ||
| 69 | &-nav { | 69 | &-nav { |
| 70 | margin: 2.25rem 0 auto; | 70 | margin: 27px 0 auto; |
| 71 | display: flex; | 71 | display: flex; |
| 72 | justify-content: center; | 72 | justify-content: center; |
| 73 | align-items: center; | 73 | align-items: center; |
| 74 | 74 | ||
| 75 | &-v-line { | 75 | &-v-line { |
| 76 | width: .2rem; | 76 | width: 2.4px; |
| 77 | height: 1.25rem; | 77 | height: 15px; |
| 78 | background-color: #4c4948; | 78 | background-color: #4c4948; |
| 79 | margin: 0 2.25rem; | 79 | margin: 0 27px; |
| 80 | } | 80 | } |
| 81 | 81 | ||
| 82 | &-tit { | 82 | &-tit { |
| ... | @@ -98,14 +98,14 @@ | ... | @@ -98,14 +98,14 @@ |
| 98 | } | 98 | } |
| 99 | 99 | ||
| 100 | &-protocol { | 100 | &-protocol { |
| 101 | margin: 2.5rem auto 0; | 101 | margin: 30px auto 0; |
| 102 | display: flex; | 102 | display: flex; |
| 103 | align-items: center; | 103 | align-items: center; |
| 104 | padding-left: 1rem; | 104 | padding-left: 12px; |
| 105 | 105 | ||
| 106 | .check { | 106 | .check { |
| 107 | height: 1rem; | 107 | height: 12px; |
| 108 | margin-right: .6rem; | 108 | margin-right: 7.2px; |
| 109 | } | 109 | } |
| 110 | 110 | ||
| 111 | .protocol { | 111 | .protocol { |
| ... | @@ -117,11 +117,11 @@ | ... | @@ -117,11 +117,11 @@ |
| 117 | display: flex; | 117 | display: flex; |
| 118 | // justify-content: space-between; | 118 | // justify-content: space-between; |
| 119 | justify-content: center; | 119 | justify-content: center; |
| 120 | margin-top: 2rem; | 120 | margin-top: 24px; |
| 121 | } | 121 | } |
| 122 | 122 | ||
| 123 | &-submit { | 123 | &-submit { |
| 124 | @include btc2(14.25rem, 5.25rem, 16px); | 124 | @include btc2(171px, 63px, 16px); |
| 125 | } | 125 | } |
| 126 | 126 | ||
| 127 | &-submit:lang(zh) { | 127 | &-submit:lang(zh) { |
| ... | @@ -129,12 +129,12 @@ | ... | @@ -129,12 +129,12 @@ |
| 129 | } | 129 | } |
| 130 | 130 | ||
| 131 | &-func { | 131 | &-func { |
| 132 | margin: 1.5rem auto 0; | 132 | margin: 18px auto 0; |
| 133 | display: flex; | 133 | display: flex; |
| 134 | justify-content: center; | 134 | justify-content: center; |
| 135 | 135 | ||
| 136 | &-btn { | 136 | &-btn { |
| 137 | margin: 0 1.25rem; | 137 | margin: 0 15px; |
| 138 | text-decoration: underline; | 138 | text-decoration: underline; |
| 139 | } | 139 | } |
| 140 | } | 140 | } |
| ... | @@ -167,23 +167,23 @@ | ... | @@ -167,23 +167,23 @@ |
| 167 | } | 167 | } |
| 168 | 168 | ||
| 169 | input:lang(zh) { | 169 | input:lang(zh) { |
| 170 | letter-spacing: .1rem; | 170 | letter-spacing: 1.2px; |
| 171 | } | 171 | } |
| 172 | 172 | ||
| 173 | &-item { | 173 | &-item { |
| 174 | position: relative; | 174 | position: relative; |
| 175 | margin-bottom: 1.75rem; | 175 | margin-bottom: 21px; |
| 176 | padding: 0 $marginSmall; | 176 | padding: 0 $marginSmall; |
| 177 | 177 | ||
| 178 | .label { | 178 | .label { |
| 179 | color: $cOrange; | 179 | color: $cOrange; |
| 180 | display: flex; | 180 | display: flex; |
| 181 | align-items: center; | 181 | align-items: center; |
| 182 | margin-bottom: 1.25rem; | 182 | margin-bottom: 15px; |
| 183 | 183 | ||
| 184 | img { | 184 | img { |
| 185 | height: 1rem; | 185 | height: 12px; |
| 186 | margin-right: 1rem; | 186 | margin-right: 12px; |
| 187 | } | 187 | } |
| 188 | } | 188 | } |
| 189 | 189 | ||
| ... | @@ -199,7 +199,7 @@ | ... | @@ -199,7 +199,7 @@ |
| 199 | } | 199 | } |
| 200 | 200 | ||
| 201 | .ipt:lang(zh) { | 201 | .ipt:lang(zh) { |
| 202 | letter-spacing: .1rem; | 202 | letter-spacing: 1.2px; |
| 203 | } | 203 | } |
| 204 | 204 | ||
| 205 | .date { | 205 | .date { |
| ... | @@ -208,14 +208,14 @@ | ... | @@ -208,14 +208,14 @@ |
| 208 | 208 | ||
| 209 | // 长文本 | 209 | // 长文本 |
| 210 | .textarea { | 210 | .textarea { |
| 211 | min-height: 8.75rem; | 211 | min-height: 105px; |
| 212 | border-radius: 1rem; | 212 | border-radius: 12px; |
| 213 | } | 213 | } |
| 214 | 214 | ||
| 215 | .down-arrow { | 215 | .down-arrow { |
| 216 | position: absolute; | 216 | position: absolute; |
| 217 | top: 2.2rem; | 217 | top: 26.4px; |
| 218 | right: 2rem; | 218 | right: 24px; |
| 219 | } | 219 | } |
| 220 | 220 | ||
| 221 | 221 | ||
| ... | @@ -223,11 +223,11 @@ | ... | @@ -223,11 +223,11 @@ |
| 223 | @extend .fcc; | 223 | @extend .fcc; |
| 224 | // font-family: Arial; | 224 | // font-family: Arial; |
| 225 | font-size: 18px; | 225 | font-size: 18px; |
| 226 | width: 8.5rem; | 226 | width: 102px; |
| 227 | border: solid 1px #dcdddd; | 227 | border: solid 1px #dcdddd; |
| 228 | background-color: #f2f2f2; | 228 | background-color: #f2f2f2; |
| 229 | flex: none; | 229 | flex: none; |
| 230 | margin-left: 1.5rem; | 230 | margin-left: 18px; |
| 231 | color: $cFontGray; | 231 | color: $cFontGray; |
| 232 | } | 232 | } |
| 233 | 233 | ||
| ... | @@ -240,7 +240,7 @@ | ... | @@ -240,7 +240,7 @@ |
| 240 | 240 | ||
| 241 | .ipt-code { | 241 | .ipt-code { |
| 242 | flex: 1; | 242 | flex: 1; |
| 243 | padding-right: 1.75rem; | 243 | padding-right: 21px; |
| 244 | } | 244 | } |
| 245 | 245 | ||
| 246 | .veri-btn { | 246 | .veri-btn { |
| ... | @@ -256,15 +256,15 @@ | ... | @@ -256,15 +256,15 @@ |
| 256 | 256 | ||
| 257 | .validator { | 257 | .validator { |
| 258 | color: $cOrange; | 258 | color: $cOrange; |
| 259 | margin-top: 0.5rem; | 259 | margin-top: 6px; |
| 260 | position: absolute; | 260 | position: absolute; |
| 261 | right: .5rem; | 261 | right: 6px; |
| 262 | display: flex; | 262 | display: flex; |
| 263 | align-items: center; | 263 | align-items: center; |
| 264 | 264 | ||
| 265 | img { | 265 | img { |
| 266 | display: inline-block; | 266 | display: inline-block; |
| 267 | margin-right: 0.4rem; | 267 | margin-right: 4.8px; |
| 268 | } | 268 | } |
| 269 | } | 269 | } |
| 270 | } | 270 | } |
| ... | @@ -282,32 +282,32 @@ | ... | @@ -282,32 +282,32 @@ |
| 282 | } | 282 | } |
| 283 | 283 | ||
| 284 | .login { | 284 | .login { |
| 285 | padding: 1rem 1rem 3.5rem; | 285 | padding: 12px 12px 42px; |
| 286 | border-bottom: none; | 286 | border-bottom: none; |
| 287 | 287 | ||
| 288 | min-height: 42rem; | 288 | min-height: 504px; |
| 289 | 289 | ||
| 290 | &-tit-space-1 { | 290 | &-tit-space-1 { |
| 291 | // height: 5.25rem; | 291 | // height: 63px; |
| 292 | } | 292 | } |
| 293 | 293 | ||
| 294 | &-tit-space-4 { | 294 | &-tit-space-4 { |
| 295 | height: 1rem; | 295 | height: 12px; |
| 296 | } | 296 | } |
| 297 | 297 | ||
| 298 | 298 | ||
| 299 | &-nav { | 299 | &-nav { |
| 300 | margin: 1.75rem auto 1rem; | 300 | margin: 21px auto 12px; |
| 301 | } | 301 | } |
| 302 | 302 | ||
| 303 | .form { | 303 | .form { |
| 304 | &-item { | 304 | &-item { |
| 305 | margin: 2rem auto 0; | 305 | margin: 24px auto 0; |
| 306 | } | 306 | } |
| 307 | } | 307 | } |
| 308 | 308 | ||
| 309 | .authTip { | 309 | .authTip { |
| 310 | margin-top: 2rem; | 310 | margin-top: 24px; |
| 311 | } | 311 | } |
| 312 | 312 | ||
| 313 | &-protocol { | 313 | &-protocol { |
| ... | @@ -316,9 +316,9 @@ | ... | @@ -316,9 +316,9 @@ |
| 316 | 316 | ||
| 317 | &-submit { | 317 | &-submit { |
| 318 | margin: 0 auto 0; | 318 | margin: 0 auto 0; |
| 319 | width: 12.25rem; | 319 | width: 147px; |
| 320 | height: 3.25rem; | 320 | height: 39px; |
| 321 | line-height: 3.25rem; | 321 | line-height: 39px; |
| 322 | } | 322 | } |
| 323 | } | 323 | } |
| 324 | 324 | ||
| ... | @@ -338,7 +338,7 @@ | ... | @@ -338,7 +338,7 @@ |
| 338 | } | 338 | } |
| 339 | 339 | ||
| 340 | .box-shadow { | 340 | .box-shadow { |
| 341 | box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15); | 341 | box-shadow: 0 0 18px 0 rgba(255, 87, 0, 0.15); |
| 342 | } | 342 | } |
| 343 | 343 | ||
| 344 | @media (max-width: 1200px) { | 344 | @media (max-width: 1200px) { | ... | ... |
| ... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | position: relative; | 4 | position: relative; |
| 5 | min-height: 50rem; | 5 | min-height: 600px; |
| 6 | padding-bottom: $marginMedium; | 6 | padding-bottom: $marginMedium; |
| 7 | color: $cFontGray; | 7 | color: $cFontGray; |
| 8 | font-size: $fontSize; | 8 | font-size: $fontSize; |
| ... | @@ -33,11 +33,11 @@ | ... | @@ -33,11 +33,11 @@ |
| 33 | .login { | 33 | .login { |
| 34 | color: $cFontGray; | 34 | color: $cFontGray; |
| 35 | @extend .bb; | 35 | @extend .bb; |
| 36 | padding: 2.75rem 6.25rem 4.5rem; | 36 | padding: 32px 75px 54px; |
| 37 | border-bottom: solid 0.9rem $cGreen; | 37 | border-bottom: solid 10.8px $cGreen; |
| 38 | 38 | ||
| 39 | margin: auto; | 39 | margin: auto; |
| 40 | max-width: 51rem; | 40 | max-width: 612px; |
| 41 | border-radius: $borderRadius; | 41 | border-radius: $borderRadius; |
| 42 | @extend .box-shadow; | 42 | @extend .box-shadow; |
| 43 | background-color: #ffffff; | 43 | background-color: #ffffff; |
| ... | @@ -48,11 +48,11 @@ | ... | @@ -48,11 +48,11 @@ |
| 48 | font-size: $fontSizeTitle; | 48 | font-size: $fontSizeTitle; |
| 49 | font-weight: bold; | 49 | font-weight: bold; |
| 50 | text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27); | 50 | text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27); |
| 51 | margin-top: 2rem; | 51 | margin-top: 24px; |
| 52 | } | 52 | } |
| 53 | 53 | ||
| 54 | &-tit2:lang(zh) { | 54 | &-tit2:lang(zh) { |
| 55 | letter-spacing: .2rem; | 55 | letter-spacing: 2.4px; |
| 56 | } | 56 | } |
| 57 | 57 | ||
| 58 | &-tit { | 58 | &-tit { |
| ... | @@ -64,29 +64,29 @@ | ... | @@ -64,29 +64,29 @@ |
| 64 | justify-content: center; | 64 | justify-content: center; |
| 65 | 65 | ||
| 66 | img { | 66 | img { |
| 67 | height: 1.75rem; | 67 | height: 21px; |
| 68 | } | 68 | } |
| 69 | 69 | ||
| 70 | .img-en { | 70 | .img-en { |
| 71 | height: 1.2rem; | 71 | height: 14.4px; |
| 72 | } | 72 | } |
| 73 | } | 73 | } |
| 74 | 74 | ||
| 75 | &-tit:lang(zh) { | 75 | &-tit:lang(zh) { |
| 76 | letter-spacing: .2rem; | 76 | letter-spacing: 2.4px; |
| 77 | } | 77 | } |
| 78 | 78 | ||
| 79 | &-nav { | 79 | &-nav { |
| 80 | margin: 2.75rem auto 1rem; | 80 | margin: 32px auto 12px; |
| 81 | display: flex; | 81 | display: flex; |
| 82 | justify-content: center; | 82 | justify-content: center; |
| 83 | align-items: center; | 83 | align-items: center; |
| 84 | 84 | ||
| 85 | &-v-line { | 85 | &-v-line { |
| 86 | width: 2px; | 86 | width: 2px; |
| 87 | height: 1.2rem; | 87 | height: 14.4px; |
| 88 | background-color: $cFontGray; | 88 | background-color: $cFontGray; |
| 89 | margin: 0 2.25rem; | 89 | margin: 0 27px; |
| 90 | } | 90 | } |
| 91 | 91 | ||
| 92 | &-tit { | 92 | &-tit { |
| ... | @@ -102,14 +102,14 @@ | ... | @@ -102,14 +102,14 @@ |
| 102 | } | 102 | } |
| 103 | 103 | ||
| 104 | &-protocol { | 104 | &-protocol { |
| 105 | margin: 3rem auto 0; | 105 | margin: 36px auto 0; |
| 106 | display: flex; | 106 | display: flex; |
| 107 | align-items: center; | 107 | align-items: center; |
| 108 | // padding-left: 1rem; | 108 | // padding-left: 12px; |
| 109 | 109 | ||
| 110 | .check { | 110 | .check { |
| 111 | height: 1rem; | 111 | height: 12px; |
| 112 | margin-right: .5rem; | 112 | margin-right: 6px; |
| 113 | } | 113 | } |
| 114 | 114 | ||
| 115 | .protocol { | 115 | .protocol { |
| ... | @@ -118,12 +118,12 @@ | ... | @@ -118,12 +118,12 @@ |
| 118 | } | 118 | } |
| 119 | 119 | ||
| 120 | .loginLeft { | 120 | .loginLeft { |
| 121 | padding-left: 1rem; | 121 | padding-left: 12px; |
| 122 | } | 122 | } |
| 123 | 123 | ||
| 124 | &-submit { | 124 | &-submit { |
| 125 | @include btc2(17.25rem, 5.25rem, 16px); | 125 | @include btc2(207px, 63px, 16px); |
| 126 | margin: 4rem auto 0; | 126 | margin: 48px auto 0; |
| 127 | 127 | ||
| 128 | } | 128 | } |
| 129 | 129 | ||
| ... | @@ -132,12 +132,12 @@ | ... | @@ -132,12 +132,12 @@ |
| 132 | } | 132 | } |
| 133 | 133 | ||
| 134 | &-func { | 134 | &-func { |
| 135 | margin: 2rem auto 0; | 135 | margin: 24px auto 0; |
| 136 | display: flex; | 136 | display: flex; |
| 137 | justify-content: center; | 137 | justify-content: center; |
| 138 | 138 | ||
| 139 | &-btn { | 139 | &-btn { |
| 140 | margin: 0 1.5rem; | 140 | margin: 0 18px; |
| 141 | text-decoration: underline; | 141 | text-decoration: underline; |
| 142 | } | 142 | } |
| 143 | } | 143 | } |
| ... | @@ -162,7 +162,7 @@ | ... | @@ -162,7 +162,7 @@ |
| 162 | 162 | ||
| 163 | &-item { | 163 | &-item { |
| 164 | position: relative; | 164 | position: relative; |
| 165 | margin-top: 3.25rem; | 165 | margin-top: 39px; |
| 166 | 166 | ||
| 167 | .area-code { | 167 | .area-code { |
| 168 | border: transparent !important; | 168 | border: transparent !important; |
| ... | @@ -177,11 +177,11 @@ | ... | @@ -177,11 +177,11 @@ |
| 177 | color: $cOrange; | 177 | color: $cOrange; |
| 178 | display: flex; | 178 | display: flex; |
| 179 | align-items: center; | 179 | align-items: center; |
| 180 | margin-bottom: 1.25rem; | 180 | margin-bottom: 15px; |
| 181 | 181 | ||
| 182 | img { | 182 | img { |
| 183 | height: 1.5rem; | 183 | height: 18px; |
| 184 | margin-right: .8rem; | 184 | margin-right: 9.6px; |
| 185 | } | 185 | } |
| 186 | } | 186 | } |
| 187 | 187 | ||
| ... | @@ -193,40 +193,39 @@ | ... | @@ -193,40 +193,39 @@ |
| 193 | // input和下拉 | 193 | // input和下拉 |
| 194 | .ipt { | 194 | .ipt { |
| 195 | flex: 1; | 195 | flex: 1; |
| 196 | padding: 0 2.5rem 0 2rem; | 196 | padding: 0 30px 0 24px; |
| 197 | } | 197 | } |
| 198 | 198 | ||
| 199 | .ipt:lang(zh) { | 199 | .ipt:lang(zh) { |
| 200 | letter-spacing: .1rem; | 200 | letter-spacing: 1.2px; |
| 201 | } | 201 | } |
| 202 | 202 | ||
| 203 | 203 | ||
| 204 | // 长文本 | 204 | // 长文本 |
| 205 | .textarea { | 205 | .textarea { |
| 206 | min-height: 8.75rem; | 206 | min-height: 105px; |
| 207 | border-radius: 1rem; | 207 | border-radius: 12px; |
| 208 | } | 208 | } |
| 209 | 209 | ||
| 210 | .down-arrow { | 210 | .down-arrow { |
| 211 | position: absolute; | 211 | position: absolute; |
| 212 | top: 2.0rem; | 212 | top: 24px; |
| 213 | right: 1rem; | 213 | right: 12px; |
| 214 | } | 214 | } |
| 215 | 215 | ||
| 216 | .region-tel { | 216 | .region-tel { |
| 217 | margin-right: .8rem; | 217 | margin-right: 9.6px; |
| 218 | max-width: 30%; | 218 | max-width: 30%; |
| 219 | } | 219 | } |
| 220 | 220 | ||
| 221 | .verify-btn { | 221 | .verify-btn { |
| 222 | @extend .fcc; | 222 | @extend .fcc; |
| 223 | // font-family: Arial; | ||
| 224 | font-size: 18px; | 223 | font-size: 18px; |
| 225 | width: 8.5rem; | 224 | width: 102px; |
| 226 | border: solid 1px #dcdddd; | 225 | border: solid 1px #dcdddd; |
| 227 | background-color: #f2f2f2; | 226 | background-color: #f2f2f2; |
| 228 | flex: none; | 227 | flex: none; |
| 229 | margin-left: 1.5rem; | 228 | margin-left: 18px; |
| 230 | color: $cFontGray; | 229 | color: $cFontGray; |
| 231 | } | 230 | } |
| 232 | 231 | ||
| ... | @@ -239,7 +238,7 @@ | ... | @@ -239,7 +238,7 @@ |
| 239 | 238 | ||
| 240 | .ipt-code { | 239 | .ipt-code { |
| 241 | flex: 1; | 240 | flex: 1; |
| 242 | padding-right: 1.75rem; | 241 | padding-right: 21px; |
| 243 | } | 242 | } |
| 244 | 243 | ||
| 245 | .veri-btn { | 244 | .veri-btn { |
| ... | @@ -255,22 +254,22 @@ | ... | @@ -255,22 +254,22 @@ |
| 255 | 254 | ||
| 256 | .validator { | 255 | .validator { |
| 257 | color: $cOrange; | 256 | color: $cOrange; |
| 258 | margin-top: 0.5rem; | 257 | margin-top: 6px; |
| 259 | position: absolute; | 258 | position: absolute; |
| 260 | right: .5rem; | 259 | right: 6px; |
| 261 | display: flex; | 260 | display: flex; |
| 262 | align-items: center; | 261 | align-items: center; |
| 263 | 262 | ||
| 264 | img { | 263 | img { |
| 265 | display: inline-block; | 264 | display: inline-block; |
| 266 | margin-right: 0.4rem; | 265 | margin-right: 4.8px; |
| 267 | } | 266 | } |
| 268 | } | 267 | } |
| 269 | } | 268 | } |
| 270 | } | 269 | } |
| 271 | 270 | ||
| 272 | .box-shadow { | 271 | .box-shadow { |
| 273 | box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15); | 272 | box-shadow: 0 0 18px 0 rgba(255, 87, 0, 0.15); |
| 274 | } | 273 | } |
| 275 | 274 | ||
| 276 | @media (max-width: 1200px) { | 275 | @media (max-width: 1200px) { |
| ... | @@ -285,7 +284,7 @@ | ... | @@ -285,7 +284,7 @@ |
| 285 | } | 284 | } |
| 286 | 285 | ||
| 287 | .login { | 286 | .login { |
| 288 | padding: 2rem 1rem 3.5rem; | 287 | padding: 24px 12px 42px; |
| 289 | border-bottom: none; | 288 | border-bottom: none; |
| 290 | 289 | ||
| 291 | 290 | ||
| ... | @@ -295,20 +294,20 @@ | ... | @@ -295,20 +294,20 @@ |
| 295 | font-size: $fontSizeTitle; | 294 | font-size: $fontSizeTitle; |
| 296 | font-weight: bold; | 295 | font-weight: bold; |
| 297 | text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27); | 296 | text-shadow: 3px 5.2px 9px rgba(236, 100, 41, 0.27); |
| 298 | margin-top: 2rem; | 297 | margin-top: 24px; |
| 299 | } | 298 | } |
| 300 | 299 | ||
| 301 | &-tit2:lang(zh) { | 300 | &-tit2:lang(zh) { |
| 302 | letter-spacing: .2rem; | 301 | letter-spacing: 2.4px; |
| 303 | } | 302 | } |
| 304 | 303 | ||
| 305 | &-nav { | 304 | &-nav { |
| 306 | margin: 1.75rem auto 1rem; | 305 | margin: 21px auto 12px; |
| 307 | } | 306 | } |
| 308 | 307 | ||
| 309 | .form { | 308 | .form { |
| 310 | &-item { | 309 | &-item { |
| 311 | margin-top: 2rem; | 310 | margin-top: 24px; |
| 312 | } | 311 | } |
| 313 | } | 312 | } |
| 314 | 313 | ||
| ... | @@ -317,10 +316,10 @@ | ... | @@ -317,10 +316,10 @@ |
| 317 | } | 316 | } |
| 318 | 317 | ||
| 319 | &-submit { | 318 | &-submit { |
| 320 | margin: 3rem auto 0; | 319 | margin: 36px auto 0; |
| 321 | width: 17.25rem; | 320 | width: 207px; |
| 322 | height: 3.25rem; | 321 | height: 39px; |
| 323 | line-height: 3.25rem; | 322 | line-height: 39px; |
| 324 | } | 323 | } |
| 325 | } | 324 | } |
| 326 | 325 | ... | ... |
| 1 | @import '@/styles/_support.scss'; | 1 | @import '@/styles/_support.scss'; |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | // padding-bottom: 8.5rem; | 4 | // padding-bottom: 102px; |
| 5 | padding-bottom: 2.33rem; | 5 | padding-bottom: 28px; |
| 6 | } | 6 | } |
| 7 | 7 | ||
| 8 | .box { | 8 | .box { |
| 9 | position: relative; | 9 | position: relative; |
| 10 | max-width: $articleWidth; | 10 | max-width: $articleWidth; |
| 11 | // max-width: 64rem; | 11 | // max-width: 768px; |
| 12 | } | 12 | } |
| 13 | 13 | ||
| 14 | .top-space { | 14 | .top-space { |
| 15 | height: 3rem; | 15 | height: 36px; |
| 16 | } | 16 | } |
| 17 | 17 | ||
| 18 | .tit { | 18 | .tit { |
| ... | @@ -27,29 +27,29 @@ | ... | @@ -27,29 +27,29 @@ |
| 27 | 27 | ||
| 28 | .back { | 28 | .back { |
| 29 | text-align: right; | 29 | text-align: right; |
| 30 | margin-top: .75rem; | 30 | margin-top: 9px; |
| 31 | cursor: pointer; | 31 | cursor: pointer; |
| 32 | } | 32 | } |
| 33 | 33 | ||
| 34 | .dat { | 34 | .dat { |
| 35 | margin-top: 4rem; | 35 | margin-top: 48px; |
| 36 | display: flex; | 36 | display: flex; |
| 37 | 37 | ||
| 38 | .date { | 38 | .date { |
| 39 | display: flex; | 39 | display: flex; |
| 40 | margin-right: 4rem; | 40 | margin-right: 48px; |
| 41 | align-items: center; | 41 | align-items: center; |
| 42 | 42 | ||
| 43 | .icon-clock { | 43 | .icon-clock { |
| 44 | height: 1.25rem; | 44 | height: 15px; |
| 45 | margin-right: .5rem; | 45 | margin-right: 6px; |
| 46 | } | 46 | } |
| 47 | } | 47 | } |
| 48 | } | 48 | } |
| 49 | 49 | ||
| 50 | .desc { | 50 | .desc { |
| 51 | max-width: $articleWidth; | 51 | max-width: $articleWidth; |
| 52 | margin-top: 4rem; | 52 | margin-top: 48px; |
| 53 | line-height: 2; | 53 | line-height: 2; |
| 54 | } | 54 | } |
| 55 | 55 | ... | ... |
| ... | @@ -2,11 +2,11 @@ | ... | @@ -2,11 +2,11 @@ |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | position: relative; | 4 | position: relative; |
| 5 | min-height: 50rem; | 5 | min-height: 600px; |
| 6 | } | 6 | } |
| 7 | 7 | ||
| 8 | .top-space { | 8 | .top-space { |
| 9 | height: 2rem; | 9 | height: 24px; |
| 10 | } | 10 | } |
| 11 | 11 | ||
| 12 | .box { | 12 | .box { |
| ... | @@ -25,7 +25,7 @@ | ... | @@ -25,7 +25,7 @@ |
| 25 | .news { | 25 | .news { |
| 26 | color: #4c4948; | 26 | color: #4c4948; |
| 27 | margin: 0 auto; | 27 | margin: 0 auto; |
| 28 | max-width: 81.75rem; | 28 | max-width: 981px; |
| 29 | 29 | ||
| 30 | &-item { | 30 | &-item { |
| 31 | 31 | ||
| ... | @@ -33,7 +33,7 @@ | ... | @@ -33,7 +33,7 @@ |
| 33 | justify-content: space-between; | 33 | justify-content: space-between; |
| 34 | align-items: center; | 34 | align-items: center; |
| 35 | 35 | ||
| 36 | height: 5.5rem; | 36 | height: 66px; |
| 37 | border-bottom: solid 1px #dcdddd; | 37 | border-bottom: solid 1px #dcdddd; |
| 38 | cursor: pointer; | 38 | cursor: pointer; |
| 39 | 39 | ||
| ... | @@ -43,24 +43,24 @@ | ... | @@ -43,24 +43,24 @@ |
| 43 | // flex: 1; | 43 | // flex: 1; |
| 44 | 44 | ||
| 45 | .point { | 45 | .point { |
| 46 | width: .5rem; | 46 | width: 6px; |
| 47 | height: .5rem; | 47 | height: 6px; |
| 48 | background-color: #4c4948; | 48 | background-color: #4c4948; |
| 49 | margin: 0 1.75rem; | 49 | margin: 0 21px; |
| 50 | } | 50 | } |
| 51 | 51 | ||
| 52 | .tit{ | 52 | .tit { |
| 53 | // flex: 1; | 53 | // flex: 1; |
| 54 | flex-grow: 1; | 54 | flex-grow: 1; |
| 55 | } | 55 | } |
| 56 | 56 | ||
| 57 | .new { | 57 | .new { |
| 58 | margin: 0 1rem; | 58 | margin: 0 12px; |
| 59 | } | 59 | } |
| 60 | } | 60 | } |
| 61 | 61 | ||
| 62 | &-date { | 62 | &-date { |
| 63 | margin: 0 1rem; | 63 | margin: 0 12px; |
| 64 | } | 64 | } |
| 65 | 65 | ||
| 66 | &:last-child { | 66 | &:last-child { |
| ... | @@ -73,13 +73,14 @@ | ... | @@ -73,13 +73,14 @@ |
| 73 | 73 | ||
| 74 | 74 | ||
| 75 | .pagination { | 75 | .pagination { |
| 76 | padding: 2.25rem 0; | 76 | padding: 27px 0; |
| 77 | } | 77 | } |
| 78 | 78 | ||
| 79 | @media (max-width: 1200px) { | 79 | @media (max-width: 1200px) { |
| 80 | .content { | 80 | .content { |
| 81 | @include content-percent(); | 81 | @include content-percent(); |
| 82 | } | 82 | } |
| 83 | |||
| 83 | .ebg { | 84 | .ebg { |
| 84 | display: none; | 85 | display: none; |
| 85 | } | 86 | } |
| ... | @@ -90,12 +91,13 @@ | ... | @@ -90,12 +91,13 @@ |
| 90 | 91 | ||
| 91 | &-item { | 92 | &-item { |
| 92 | &-tit { | 93 | &-tit { |
| 93 | flex: 1; | 94 | flex: 1; |
| 95 | |||
| 94 | .point { | 96 | .point { |
| 95 | width: .5rem; | 97 | width: 6px; |
| 96 | height: .5rem; | 98 | height: 6px; |
| 97 | background-color: #4c4948; | 99 | background-color: #4c4948; |
| 98 | margin: 0 0.75rem; | 100 | margin: 0 9px; |
| 99 | } | 101 | } |
| 100 | } | 102 | } |
| 101 | } | 103 | } | ... | ... |
| ... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | ||
| 3 | .content { | 3 | .content { |
| 4 | position: relative; | 4 | position: relative; |
| 5 | padding-bottom: 2.25rem; | 5 | padding-bottom: 27px; |
| 6 | position: relative; | 6 | position: relative; |
| 7 | padding-bottom: $paddingMedium; | 7 | padding-bottom: $paddingMedium; |
| 8 | color: $cFontGray; | 8 | color: $cFontGray; |
| ... | @@ -28,17 +28,17 @@ | ... | @@ -28,17 +28,17 @@ |
| 28 | 28 | ||
| 29 | .step { | 29 | .step { |
| 30 | @extend .fcc; | 30 | @extend .fcc; |
| 31 | margin-bottom: 3rem; | 31 | margin-bottom: 36px; |
| 32 | } | 32 | } |
| 33 | 33 | ||
| 34 | .login { | 34 | .login { |
| 35 | @extend .bb; | 35 | @extend .bb; |
| 36 | padding: 2rem 6.25rem 2rem; | 36 | padding: 24px 75px 24px; |
| 37 | border-bottom: solid 0.9rem $cGreen; | 37 | border-bottom: solid 10.8px $cGreen; |
| 38 | // height: 38rem; | 38 | // height: 456px; |
| 39 | 39 | ||
| 40 | margin: auto; | 40 | margin: auto; |
| 41 | max-width: 51rem; | 41 | max-width: 612px; |
| 42 | border-radius: $borderRadius; | 42 | border-radius: $borderRadius; |
| 43 | @extend .box-shadow; | 43 | @extend .box-shadow; |
| 44 | background-color: #ffffff; | 44 | background-color: #ffffff; |
| ... | @@ -52,28 +52,28 @@ | ... | @@ -52,28 +52,28 @@ |
| 52 | } | 52 | } |
| 53 | 53 | ||
| 54 | &-tit:lang(zh) { | 54 | &-tit:lang(zh) { |
| 55 | letter-spacing: .2rem; | 55 | letter-spacing: 2.4px; |
| 56 | } | 56 | } |
| 57 | 57 | ||
| 58 | &-tit-space-1 { | 58 | &-tit-space-1 { |
| 59 | height: 5.25rem; | 59 | height: 63px; |
| 60 | } | 60 | } |
| 61 | 61 | ||
| 62 | &-tit-space-4 { | 62 | &-tit-space-4 { |
| 63 | height: 3rem; | 63 | height: 36px; |
| 64 | } | 64 | } |
| 65 | 65 | ||
| 66 | &-nav { | 66 | &-nav { |
| 67 | margin: 2.25rem 0 auto; | 67 | margin: 27px 0 auto; |
| 68 | display: flex; | 68 | display: flex; |
| 69 | justify-content: center; | 69 | justify-content: center; |
| 70 | align-items: center; | 70 | align-items: center; |
| 71 | 71 | ||
| 72 | &-v-line { | 72 | &-v-line { |
| 73 | width: .2rem; | 73 | width: 2.4px; |
| 74 | height: 1.25rem; | 74 | height: 15px; |
| 75 | background-color: $cFontGray; | 75 | background-color: $cFontGray; |
| 76 | margin: 0 2.25rem; | 76 | margin: 0 27px; |
| 77 | } | 77 | } |
| 78 | 78 | ||
| 79 | &-tit { | 79 | &-tit { |
| ... | @@ -90,14 +90,14 @@ | ... | @@ -90,14 +90,14 @@ |
| 90 | } | 90 | } |
| 91 | 91 | ||
| 92 | &-protocol { | 92 | &-protocol { |
| 93 | margin: 2.5rem auto 0; | 93 | margin: 30px auto 0; |
| 94 | display: flex; | 94 | display: flex; |
| 95 | align-items: center; | 95 | align-items: center; |
| 96 | padding-left: 1rem; | 96 | padding-left: 12px; |
| 97 | 97 | ||
| 98 | .check { | 98 | .check { |
| 99 | height: 1rem; | 99 | height: 12px; |
| 100 | margin-right: .6rem; | 100 | margin-right: 7.2px; |
| 101 | } | 101 | } |
| 102 | 102 | ||
| 103 | .protocol { | 103 | .protocol { |
| ... | @@ -106,12 +106,12 @@ | ... | @@ -106,12 +106,12 @@ |
| 106 | } | 106 | } |
| 107 | 107 | ||
| 108 | &-submit { | 108 | &-submit { |
| 109 | @include btc2(17.25rem, 5.25rem, 16px); | 109 | @include btc2(207px, 63px, 16px); |
| 110 | margin: 4.166667rem auto 0; | 110 | margin: 50px auto 0; |
| 111 | left: 0; | 111 | left: 0; |
| 112 | right: 0; | 112 | right: 0; |
| 113 | margin: 2rem auto 0; | 113 | margin: 24px auto 0; |
| 114 | bottom: 3rem; | 114 | bottom: 36px; |
| 115 | } | 115 | } |
| 116 | 116 | ||
| 117 | &-submit:lang(zh) { | 117 | &-submit:lang(zh) { |
| ... | @@ -119,12 +119,12 @@ | ... | @@ -119,12 +119,12 @@ |
| 119 | } | 119 | } |
| 120 | 120 | ||
| 121 | &-func { | 121 | &-func { |
| 122 | margin: 1.5rem auto 0; | 122 | margin: 18px auto 0; |
| 123 | display: flex; | 123 | display: flex; |
| 124 | justify-content: center; | 124 | justify-content: center; |
| 125 | 125 | ||
| 126 | &-btn { | 126 | &-btn { |
| 127 | margin: 0 1.25rem; | 127 | margin: 0 15px; |
| 128 | text-decoration: underline; | 128 | text-decoration: underline; |
| 129 | } | 129 | } |
| 130 | } | 130 | } |
| ... | @@ -151,13 +151,13 @@ | ... | @@ -151,13 +151,13 @@ |
| 151 | } | 151 | } |
| 152 | 152 | ||
| 153 | input:lang(zh) { | 153 | input:lang(zh) { |
| 154 | letter-spacing: .1rem; | 154 | letter-spacing: 1.2px; |
| 155 | } | 155 | } |
| 156 | 156 | ||
| 157 | 157 | ||
| 158 | &-item { | 158 | &-item { |
| 159 | position: relative; | 159 | position: relative; |
| 160 | margin-bottom: 3rem; | 160 | margin-bottom: 36px; |
| 161 | 161 | ||
| 162 | .label { | 162 | .label { |
| 163 | font-size: $fontSizeTitle; | 163 | font-size: $fontSizeTitle; |
| ... | @@ -165,11 +165,11 @@ | ... | @@ -165,11 +165,11 @@ |
| 165 | color: $cOrange; | 165 | color: $cOrange; |
| 166 | display: flex; | 166 | display: flex; |
| 167 | align-items: center; | 167 | align-items: center; |
| 168 | margin-bottom: 1.25rem; | 168 | margin-bottom: 15px; |
| 169 | 169 | ||
| 170 | img { | 170 | img { |
| 171 | height: 1.5rem; | 171 | height: 18px; |
| 172 | margin-right: .8rem; | 172 | margin-right: 9.6px; |
| 173 | } | 173 | } |
| 174 | } | 174 | } |
| 175 | 175 | ||
| ... | @@ -184,19 +184,19 @@ | ... | @@ -184,19 +184,19 @@ |
| 184 | } | 184 | } |
| 185 | 185 | ||
| 186 | .ipt:lang(zh) { | 186 | .ipt:lang(zh) { |
| 187 | letter-spacing: .1rem; | 187 | letter-spacing: 1.2px; |
| 188 | } | 188 | } |
| 189 | 189 | ||
| 190 | // 长文本 | 190 | // 长文本 |
| 191 | .textarea { | 191 | .textarea { |
| 192 | min-height: 8.75rem; | 192 | min-height: 105px; |
| 193 | border-radius: 1rem; | 193 | border-radius: 12px; |
| 194 | } | 194 | } |
| 195 | 195 | ||
| 196 | .down-arrow { | 196 | .down-arrow { |
| 197 | position: absolute; | 197 | position: absolute; |
| 198 | top: 2.2rem; | 198 | top: 26.4px; |
| 199 | right: 2rem; | 199 | right: 24px; |
| 200 | } | 200 | } |
| 201 | 201 | ||
| 202 | 202 | ||
| ... | @@ -204,11 +204,11 @@ | ... | @@ -204,11 +204,11 @@ |
| 204 | @extend .fcc; | 204 | @extend .fcc; |
| 205 | // font-family: Arial; | 205 | // font-family: Arial; |
| 206 | font-size: 18px; | 206 | font-size: 18px; |
| 207 | width: 8.5rem; | 207 | width: 102px; |
| 208 | border: solid 1px #dcdddd; | 208 | border: solid 1px #dcdddd; |
| 209 | background-color: #f2f2f2; | 209 | background-color: #f2f2f2; |
| 210 | flex: none; | 210 | flex: none; |
| 211 | margin-left: 1.5rem; | 211 | margin-left: 18px; |
| 212 | color: $cFontGray; | 212 | color: $cFontGray; |
| 213 | } | 213 | } |
| 214 | 214 | ||
| ... | @@ -221,7 +221,7 @@ | ... | @@ -221,7 +221,7 @@ |
| 221 | 221 | ||
| 222 | .ipt-code { | 222 | .ipt-code { |
| 223 | flex: 1; | 223 | flex: 1; |
| 224 | padding-right: 1.75rem; | 224 | padding-right: 21px; |
| 225 | } | 225 | } |
| 226 | 226 | ||
| 227 | .veri-btn { | 227 | .veri-btn { |
| ... | @@ -237,22 +237,22 @@ | ... | @@ -237,22 +237,22 @@ |
| 237 | 237 | ||
| 238 | .validator { | 238 | .validator { |
| 239 | color: $cOrange; | 239 | color: $cOrange; |
| 240 | margin-top: 0.5rem; | 240 | margin-top: 6px; |
| 241 | position: absolute; | 241 | position: absolute; |
| 242 | right: .5rem; | 242 | right: 6px; |
| 243 | display: flex; | 243 | display: flex; |
| 244 | align-items: center; | 244 | align-items: center; |
| 245 | 245 | ||
| 246 | img { | 246 | img { |
| 247 | display: inline-block; | 247 | display: inline-block; |
| 248 | margin-right: 0.4rem; | 248 | margin-right: 4.8px; |
| 249 | } | 249 | } |
| 250 | } | 250 | } |
| 251 | } | 251 | } |
| 252 | } | 252 | } |
| 253 | 253 | ||
| 254 | .box-shadow { | 254 | .box-shadow { |
| 255 | box-shadow: 0 0 1.5rem 0 rgba(255, 87, 0, 0.15); | 255 | box-shadow: 0 0 18px 0 rgba(255, 87, 0, 0.15); |
| 256 | } | 256 | } |
| 257 | 257 | ||
| 258 | @media (max-width: 1200px) { | 258 | @media (max-width: 1200px) { |
| ... | @@ -267,26 +267,26 @@ | ... | @@ -267,26 +267,26 @@ |
| 267 | } | 267 | } |
| 268 | 268 | ||
| 269 | .login { | 269 | .login { |
| 270 | padding: 3rem 1rem 3.5rem; | 270 | padding: 36px 12px 42px; |
| 271 | border-bottom: none; | 271 | border-bottom: none; |
| 272 | 272 | ||
| 273 | min-height: 42rem; | 273 | min-height: 504px; |
| 274 | 274 | ||
| 275 | &-tit-space-1 { | 275 | &-tit-space-1 { |
| 276 | height: 2.25rem; | 276 | height: 27px; |
| 277 | } | 277 | } |
| 278 | 278 | ||
| 279 | &-tit-space-4 { | 279 | &-tit-space-4 { |
| 280 | height: 1rem; | 280 | height: 12px; |
| 281 | } | 281 | } |
| 282 | 282 | ||
| 283 | &-nav { | 283 | &-nav { |
| 284 | margin: 1.75rem auto 1rem; | 284 | margin: 21px auto 12px; |
| 285 | } | 285 | } |
| 286 | 286 | ||
| 287 | .form { | 287 | .form { |
| 288 | &-item { | 288 | &-item { |
| 289 | margin: 2rem auto 0; | 289 | margin: 24px auto 0; |
| 290 | } | 290 | } |
| 291 | } | 291 | } |
| 292 | 292 | ||
| ... | @@ -295,10 +295,10 @@ | ... | @@ -295,10 +295,10 @@ |
| 295 | } | 295 | } |
| 296 | 296 | ||
| 297 | &-submit { | 297 | &-submit { |
| 298 | margin: 3.25rem auto 0; | 298 | margin: 39px auto 0; |
| 299 | width: 17.25rem; | 299 | width: 207px; |
| 300 | height: 3.25rem; | 300 | height: 39px; |
| 301 | line-height: 3.25rem; | 301 | line-height: 39px; |
| 302 | } | 302 | } |
| 303 | } | 303 | } |
| 304 | 304 | ... | ... |
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
-
Please register or sign in to post a comment