默认提交
Showing
4 changed files
with
52 additions
and
11 deletions
| ... | @@ -96,6 +96,23 @@ | ... | @@ -96,6 +96,23 @@ | 
| 96 | 96 | ||
| 97 | @media (max-width: 1100px) { | 97 | @media (max-width: 1100px) { | 
| 98 | .drop-list { | 98 | .drop-list { | 
| 99 | margin: 0 -2px; | 99 | margin: 0 28px; | 
| 100 | min-width: auto; | ||
| 101 | |||
| 102 | .list { | ||
| 103 | width: 11rem; | ||
| 104 | left: 50%; | ||
| 105 | transform: translateX(-50%); //居中处理 | ||
| 106 | } | ||
| 100 | } | 107 | } | 
| 108 | .drop-list:lang(en) { | ||
| 109 | margin: 0 22px; | ||
| 110 | } | ||
| 111 | } | ||
| 112 | |||
| 113 | |||
| 114 | @media (max-width: 1000px) { | ||
| 115 | // .drop-list { | ||
| 116 | // margin: 0 20px; | ||
| 117 | // } | ||
| 101 | } | 118 | } | ... | ... | 
| ... | @@ -62,6 +62,7 @@ $navHeiM: 6rem; | ... | @@ -62,6 +62,7 @@ $navHeiM: 6rem; | 
| 62 | 62 | ||
| 63 | .nav-item.search { | 63 | .nav-item.search { | 
| 64 | flex: 1 1 auto; | 64 | flex: 1 1 auto; | 
| 65 | // width: 0; | ||
| 65 | } | 66 | } | 
| 66 | 67 | ||
| 67 | .nav-item.auth { | 68 | .nav-item.auth { | 
| ... | @@ -115,12 +116,23 @@ $navHeiM: 6rem; | ... | @@ -115,12 +116,23 @@ $navHeiM: 6rem; | 
| 115 | 116 | ||
| 116 | @media (max-width: 1200px) { | 117 | @media (max-width: 1200px) { | 
| 117 | .v-header { | 118 | .v-header { | 
| 118 | @include content-percent(2%); | 119 | @include content-percent(1%); | 
| 119 | } | 120 | } | 
| 120 | } | 121 | } | 
| 121 | 122 | ||
| 123 | |||
| 124 | @media (max-width: 1100px) { | ||
| 125 | .pc { | ||
| 126 | .auth { | ||
| 127 | margin-right: 20px; | ||
| 128 | } | ||
| 129 | } | ||
| 130 | } | ||
| 131 | |||
| 132 | |||
| 122 | @media (max-width: 980px) { | 133 | @media (max-width: 980px) { | 
| 123 | .v-header { | 134 | .v-header { | 
| 135 | |||
| 124 | @include content-percent(); | 136 | @include content-percent(); | 
| 125 | 137 | ||
| 126 | .main-nav {} | 138 | .main-nav {} | 
| ... | @@ -148,7 +160,7 @@ $navHeiM: 6rem; | ... | @@ -148,7 +160,7 @@ $navHeiM: 6rem; | 
| 148 | .v-header { | 160 | .v-header { | 
| 149 | 161 | ||
| 150 | // 原1200px临界样式 | 162 | // 原1200px临界样式 | 
| 151 | @include content-percent(); | 163 | |
| 152 | 164 | ||
| 153 | .pc { | 165 | .pc { | 
| 154 | display: none; | 166 | display: none; | ... | ... | 
| ... | @@ -23,8 +23,7 @@ | ... | @@ -23,8 +23,7 @@ | 
| 23 | <v-dropdown v-for="item in navList" :key="item.id" :data-obj="item" :data-list="item.list"> | 23 | <v-dropdown v-for="item in navList" :key="item.id" :data-obj="item" :data-list="item.list"> | 
| 24 | </v-dropdown> | 24 | </v-dropdown> | 
| 25 | </div> | 25 | </div> | 
| 26 | <div class="nav-item search"> | 26 | <div class="nav-item search"></div> | 
| 27 | </div> | ||
| 28 | <div class="nav-item auth"> | 27 | <div class="nav-item auth"> | 
| 29 | <v-dropdown class="lang" :type="'login'" :data-obj="loginData" :data-list="loginData.list" ref="mobileMenu"></v-dropdown> | 28 | <v-dropdown class="lang" :type="'login'" :data-obj="loginData" :data-list="loginData.list" ref="mobileMenu"></v-dropdown> | 
| 30 | <v-dropdown class="lang" :type="'lang'" :data-obj="langData" :data-list="langData.list"></v-dropdown> | 29 | <v-dropdown class="lang" :type="'lang'" :data-obj="langData" :data-list="langData.list"></v-dropdown> | ... | ... | 
| ... | @@ -683,6 +683,14 @@ $borderSize: 6px; | ... | @@ -683,6 +683,14 @@ $borderSize: 6px; | 
| 683 | } | 683 | } | 
| 684 | } | 684 | } | 
| 685 | } | 685 | } | 
| 686 | |||
| 687 | .guarantee2{ | ||
| 688 | .container{ | ||
| 689 | .table{ | ||
| 690 | width: 48%; | ||
| 691 | } | ||
| 692 | } | ||
| 693 | } | ||
| 686 | } | 694 | } | 
| 687 | 695 | ||
| 688 | } | 696 | } | 
| ... | @@ -765,19 +773,21 @@ $borderSize: 6px; | ... | @@ -765,19 +773,21 @@ $borderSize: 6px; | 
| 765 | .table { | 773 | .table { | 
| 766 | font-size: $fontSize-M2; | 774 | font-size: $fontSize-M2; | 
| 767 | 775 | ||
| 776 | |||
| 768 | &-item { | 777 | &-item { | 
| 769 | flex-wrap: wrap; | 778 | display: flex; | 
| 779 | flex-wrap: nowrap; | ||
| 770 | 780 | ||
| 771 | .tt { | 781 | .tt { | 
| 772 | width: 100%; | 782 | // width: 100%; | 
| 773 | } | 783 | } | 
| 774 | 784 | ||
| 775 | .label { | 785 | .label { | 
| 776 | padding: 18px; | 786 | padding: 12px; | 
| 777 | } | 787 | } | 
| 778 | 788 | ||
| 779 | .val { | 789 | .val { | 
| 780 | padding: 18px; | 790 | padding: 12px; | 
| 781 | } | 791 | } | 
| 782 | } | 792 | } | 
| 783 | } | 793 | } | 
| ... | @@ -794,15 +804,18 @@ $borderSize: 6px; | ... | @@ -794,15 +804,18 @@ $borderSize: 6px; | 
| 794 | .table { | 804 | .table { | 
| 795 | margin-top: 24px; | 805 | margin-top: 24px; | 
| 796 | font-size: $fontSize-M2; | 806 | font-size: $fontSize-M2; | 
| 807 | width: auto; | ||
| 797 | 808 | ||
| 798 | .smal { | 809 | .smal { | 
| 799 | font-size: $fontSizeSmall-M2; | 810 | font-size: $fontSizeSmall-M2; | 
| 800 | } | 811 | } | 
| 801 | 812 | ||
| 802 | &-item { | 813 | &-item { | 
| 814 | flex-wrap: nowrap; | ||
| 815 | min-height: auto; | ||
| 816 | |||
| 803 | .val { | 817 | .val { | 
| 804 | // box-sizing: border-box; | 818 | padding: 12px; | 
| 805 | padding: 18px; | ||
| 806 | } | 819 | } | 
| 807 | } | 820 | } | 
| 808 | 821 | ... | ... | 
- 
Please register or sign in to post a comment