Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
928b71b3 by simon
Options

默认提交

1 parent 66706665
Inline Side-by-side
Showing 10 changed files with 115 additions and 91 deletions
1
2 .cell-group { 1 .cell-group {
3 margin-bottom: 1rem /* 12/12 */; 2 margin-bottom: 1rem;
4 div{ 3
5 font-size: 1rem /* 12/12 */; 4 &:last-child {
5 margin-bottom: 0;
6 }
7
8 div {
9 font-size: 1rem;
6 color: #4c4948; 10 color: #4c4948;
7 } 11 }
8 12
9 .w1 { 13 .w1 {
10 min-width: 9.166667rem /* 110/12 */; 14 min-width: 9.166667rem;
11 text-align: center; 15 text-align: center;
12 } 16 }
13 17
14 .w2 { 18 .w2 {
15 min-width: 6.25rem /* 75/12 */; 19 min-width: 6.25rem;
16 text-align: center; 20 text-align: center;
17 } 21 }
18 22
19 .table-header { 23 .table-header {
20 width: 64.166667rem /* 770/12 */; 24 width: 64.166667rem;
21 height: 2.5rem /* 30/12 */; 25 height: 2.5rem;
22 border-top-left-radius: .666667rem /* 8/12 */; 26 border-top-left-radius: .666667rem;
23 border-top-right-radius: .666667rem /* 8/12 */; 27 border-top-right-radius: .666667rem;
24 background-color: #f2f2f2; 28 background-color: #f2f2f2;
25 display: flex; 29 display: flex;
26 align-items: center; 30 align-items: center;
27 31
28 .normal-header { 32 .normal-header {
29 width: 58.833333rem /* 706/12 */; 33 width: 58.833333rem;
30 margin: auto; 34 margin: auto;
31 display: flex; 35 display: flex;
32 justify-content: space-between; 36 justify-content: space-between;
33 align-items: center; 37 align-items: center;
34 38
35 .title { 39 .title {
36 font-size: 1rem /* 12/12 */; 40 font-size: 1rem;
37 font-weight: bold; 41 font-weight: bold;
38 color: #575453; 42 color: #575453;
39 } 43 }
...@@ -41,8 +45,8 @@ ...@@ -41,8 +45,8 @@
41 .guide { 45 .guide {
42 transition: all 0.5s; 46 transition: all 0.5s;
43 cursor: pointer; 47 cursor: pointer;
44 width: 1rem /* 12/12 */; 48 width: 1rem;
45 height: .666667rem /* 8/12 */ ; 49 height: .666667rem;
46 background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center; 50 background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center;
47 background-size: 100% 100%; 51 background-size: 100% 100%;
48 } 52 }
...@@ -55,56 +59,58 @@ ...@@ -55,56 +59,58 @@
55 } 59 }
56 60
57 .table-content { 61 .table-content {
58 width: 64.166667rem /* 770/12 */; 62 width: 64.166667rem;
59 height: auto; 63 height: auto;
60 display: inline-block; 64 display: inline-block;
61 border-bottom-left-radius: .666667rem /* 8/12 */; 65 border-bottom-left-radius: .666667rem;
62 border-bottom-right-radius: .666667rem /* 8/12 */; 66 border-bottom-right-radius: .666667rem;
63 border-left: solid .083333rem /* 1/12 */ #f2f2f2; 67 border-left: solid .083333rem #f2f2f2;
64 border-right: solid .083333rem /* 1/12 */ #f2f2f2; 68 border-right: solid .083333rem #f2f2f2;
65 border-bottom: solid .083333rem /* 1/12 */ #f2f2f2; 69 border-bottom: solid .083333rem #f2f2f2;
66 padding: 0 2.583333rem /* 31/12 */; 70 padding: 0 2.583333rem;
67 max-height: 41.666667rem /* 500/12 */; 71 max-height: 41.666667rem;
68 transition: max-height ease-out 0.3s !important; 72 transition: max-height ease-out 0.3s !important;
69 overflow: hidden; 73 overflow: hidden;
70 74
71 .data-line { 75 .data-line {
72 height: 4.416667rem /* 53/12 */; 76 height: 4.416667rem;
73 margin: auto; 77 margin: auto;
74 display: flex; 78 display: flex;
75 justify-content: space-between; 79 justify-content: space-between;
76 align-items: center; 80 align-items: center;
77 81
78 .cell1 { 82 .cell1 {
79 width: 29.166667rem /* 350/12 */; 83 width: 29.166667rem;
80 display: flex; 84 display: flex;
81 justify-content: space-between; 85 justify-content: space-between;
82 margin: auto; 86 margin: auto;
83 } 87 }
84 88
85 .separator-v { 89 .separator-v {
86 height: 2.5rem /* 30/12 */; 90 height: 2.5rem;
87 width: .166667rem /* 2/12 */; 91 width: .166667rem;
88 background-color: #f2f2f2; 92 background-color: #f2f2f2;
89 margin: 0 .916667rem /* 11/12 */; 93 margin: 0 .916667rem;
90 } 94 }
91 } 95 }
92 96
93 .label span { 97 .label span {
94 color: #f05a23; 98 color: #f05a23;
95 margin-left: .583333rem /* 7/12 */; 99 margin-left: .583333rem;
96 cursor: pointer; 100 cursor: pointer;
97 text-decoration: underline; 101 text-decoration: underline;
98 } 102 }
99 103
100 .separator-h { 104 .separator-h {
101 width: 58.833333rem /* 706/12 */; 105 width: 58.833333rem;
102 height: .083333rem /* 1/12 */; 106 height: .083333rem;
103 background-color: #f2f2f2; 107 background-color: #f2f2f2;
104 } 108 }
105 } 109 }
110
106 .orange { 111 .orange {
107 background-color: #f05a23 !important; 112 background-color: #f05a23 !important;
113
108 div { 114 div {
109 color: #ffffff; 115 color: #ffffff;
110 } 116 }
...@@ -112,7 +118,7 @@ ...@@ -112,7 +118,7 @@
112 118
113 .hide { 119 .hide {
114 max-height: 0; 120 max-height: 0;
115 border-bottom:none; 121 border-bottom: none;
116 } 122 }
117 123
118 } 124 }
......
1 @import '@/styles/_support'; 1 @import '@/styles/_support';
2 2
3 input { 3 input {
4 padding: 0 2.083333rem /* 25/12 */; 4 padding: 0 2.083333rem;
5 } 5 }
6 6
7 .content { 7 .content {
8 padding-bottom: 6rem; 8 // padding-bottom: 6rem;
9 } 9 }
10 10
11 .top-space { 11 .top-space {
12 height: 4.25rem; 12 // height: 4.25rem;
13 } 13 }
14 14
15 .reservation-container { 15 .reservation-container {
16 width: 64.25rem /* 771/12 */; 16 width: 64.25rem;
17 border-radius: .666667rem /* 8/12 */; 17 border-radius: .666667rem;
18 border: solid .083333rem /* 1/12 */ #f2f2f2; 18 border: solid .083333rem #f2f2f2;
19 background-color: #ffffff; 19 background-color: #ffffff;
20 padding: 2.166667rem /* 26/12 */ .916667rem /* 11/12 */; 20 padding: 2.166667rem .916667rem 0;
21 } 21 }
22 22
23 .form { 23 .form {
...@@ -27,10 +27,8 @@ input { ...@@ -27,10 +27,8 @@ input {
27 27
28 &-item { 28 &-item {
29 position: relative; 29 position: relative;
30 // padding: 0 1.75rem; 30 padding: 0 1.25rem;
31 padding:0 1.25rem /* 15/12 */; 31 margin-bottom: 2.333333rem;
32 // margin-bottom: 2.5rem;
33 margin-bottom: 2.333333rem /* 28/12 */;
34 32
35 .label { 33 .label {
36 color: #f05a23; 34 color: #f05a23;
...@@ -39,13 +37,12 @@ input { ...@@ -39,13 +37,12 @@ input {
39 margin-bottom: .7rem; 37 margin-bottom: .7rem;
40 38
41 .icon { 39 .icon {
42 width: 2.166667rem /* 26/12 */; 40 width: 2.166667rem;
43 display: flex; 41 display: flex;
44 } 42 }
45 43
46 img { 44 img {
47 height: 1rem; 45 height: 1rem;
48 // margin-right: .8rem;
49 } 46 }
50 } 47 }
51 48
...@@ -61,7 +58,7 @@ input { ...@@ -61,7 +58,7 @@ input {
61 border: solid 1px #dcdddd; 58 border: solid 1px #dcdddd;
62 background-color: #ffffff; 59 background-color: #ffffff;
63 border-radius: 3.5rem; 60 border-radius: 3.5rem;
64 padding: 0 2.083333rem /* 25/12 */; 61 padding: 0 2.083333rem;
65 } 62 }
66 63
67 // 长文本 64 // 长文本
...@@ -76,6 +73,11 @@ input { ...@@ -76,6 +73,11 @@ input {
76 position: absolute; 73 position: absolute;
77 top: 1.6rem; 74 top: 1.6rem;
78 right: 2rem; 75 right: 2rem;
76 background-image: url('~@/assets/images/reservation/re-down-arrow.png');
77 width: 1rem;
78 height: .666667rem;
79 pointer-events: none;
80 cursor: default;
79 } 81 }
80 } 82 }
81 83
...@@ -84,11 +86,10 @@ input { ...@@ -84,11 +86,10 @@ input {
84 // 不换行 86 // 不换行
85 &-item2 { 87 &-item2 {
86 display: flex; 88 display: flex;
87 margin-bottom: 2.25rem /* 27/12 */; 89 margin-bottom: 2.25rem;
88 90
89 .label { 91 .label {
90 // min-width: 13.75rem; 92 min-width: 12.833333rem;
91 min-width: 12.833333rem /* 154/12 */;
92 height: 2.5rem; 93 height: 2.5rem;
93 } 94 }
94 95
...@@ -125,16 +126,15 @@ input { ...@@ -125,16 +126,15 @@ input {
125 flex-wrap: wrap; 126 flex-wrap: wrap;
126 127
127 .label { 128 .label {
128 // min-width: 13.75rem; 129 min-width: 8.833333rem;
129 min-width: 8.833333rem /* 106/12 */;
130 } 130 }
131 131
132 .ipt-wrap { 132 .ipt-wrap {
133 width: 50%; 133 width: 50%;
134 134
135 input { 135 input {
136 font-size: 1.166667rem /* 14/12 */; 136 font-size: 1.166667rem;
137 letter-spacing: .116667rem /* 1.4/12 */; 137 letter-spacing: .116667rem;
138 color: #4c4948; 138 color: #4c4948;
139 font-family: Arial; 139 font-family: Arial;
140 } 140 }
...@@ -148,8 +148,9 @@ input { ...@@ -148,8 +148,9 @@ input {
148 } 148 }
149 } 149 }
150 } 150 }
151
151 .mt8 { 152 .mt8 {
152 margin-top: .666667rem /* 8/12 */; 153 margin-top: .666667rem;
153 } 154 }
154 } 155 }
155 156
...@@ -166,7 +167,6 @@ input { ...@@ -166,7 +167,6 @@ input {
166 margin-bottom: 1rem; 167 margin-bottom: 1rem;
167 168
168 &-icon { 169 &-icon {
169 // display: inline-block;
170 position: absolute; 170 position: absolute;
171 top: .5rem; 171 top: .5rem;
172 } 172 }
...@@ -174,16 +174,16 @@ input { ...@@ -174,16 +174,16 @@ input {
174 } 174 }
175 175
176 .submit-btn { 176 .submit-btn {
177 width: 13.583333rem /* 163/12 */; 177 width: 13.583333rem;
178 height: 4.083333rem /* 49/12 */; 178 height: 4.083333rem;
179 margin: 2.5rem /* 30/12 */ auto; 179 margin: 2.5rem auto;
180 line-height: 4.083333rem /* 49/12 */; 180 line-height: 4.083333rem;
181 box-shadow: 0px 10px 13px 0 rgba(236, 100, 41, 0.2); 181 box-shadow: 0px 10px 13px 0 rgba(236, 100, 41, 0.2);
182 background-blend-mode: soft-light, ; 182 background-blend-mode: soft-light, ;
183 background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429); 183 background-image: linear-gradient(to top, #000000, #ffffff), linear-gradient(to bottom, #ec6429, #ec6429);
184 text-align: center; 184 text-align: center;
185 font-size: 1.291667rem /* 15.5/12 */; 185 font-size: 1.291667rem;
186 letter-spacing: .129167rem /* 1.55/12 */; 186 letter-spacing: .129167rem;
187 color: #ffffff; 187 color: #ffffff;
188 border-radius: 3.5rem; 188 border-radius: 3.5rem;
189 cursor: pointer; 189 cursor: pointer;
......
1 1
2 <template> 2 <template>
3 <div class="reservation-container"> 3 <div class="reservation-container">
4 <div class=""> 4 <div class="temp">
5 <div class="gird-g form"> 5 <div class="gird-g form">
6 6
7 <div class="pure-u-1 pure-u-md-1-2 form-item"> 7 <div class="pure-u-1 pure-u-md-1-2 form-item">
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
18 <div class="icon"><img src="@/assets/images/reservation/icon-re-contact.png"></div>{{$t('reservation.contactType')}} 18 <div class="icon"><img src="@/assets/images/reservation/icon-re-contact.png"></div>{{$t('reservation.contactType')}}
19 </div> 19 </div>
20 <div class="ipt-wrap"> 20 <div class="ipt-wrap">
21 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> 21 <div class="down-arrow"></div>
22 <select class="ipt"> 22 <select class="ipt">
23 <option v-if="locale !='zh'">電話</option> 23 <option v-if="locale !='zh'">電話</option>
24 <option v-else>电话</option> 24 <option v-else>电话</option>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
40 <div class="icon"><img src="@/assets/images/reservation/icon-re-clock.png"></div>{{$t('reservation.reservationType')}} 40 <div class="icon"><img src="@/assets/images/reservation/icon-re-clock.png"></div>{{$t('reservation.reservationType')}}
41 </div> 41 </div>
42 <div class="ipt-wrap"> 42 <div class="ipt-wrap">
43 <img class="down-arrow" src="@/assets/images/reservation/re-down-arrow.png" alt=""> 43 <div class="down-arrow"></div>
44 <select class="ipt"> 44 <select class="ipt">
45 <template v-if="locale =='zh'"> 45 <template v-if="locale =='zh'">
46 <option>投保咨询</option> 46 <option>投保咨询</option>
...@@ -112,6 +112,6 @@ ...@@ -112,6 +112,6 @@
112 </template> 112 </template>
113 113
114 <script src="./reservation.js"></script> 114 <script src="./reservation.js"></script>
115 <style lang="scss" > 115 <style lang="scss" scoped>
116 @import "./reservation.scss"; 116 @import "./reservation.scss";
117 </style> 117 </style>
......
1
2
3 .content { 1 .content {
4 display: flex; 2 display: flex;
3 // margin-top: 2.333333rem;
4 margin: 2.333333rem 0;
5 } 5 }
6 6
7 .left-panel { 7 .left-panel {
8 width: 12.833333rem ; 8 width: 12.833333rem;
9 height: 42.333333rem ; 9 height: 42.333333rem;
10 margin-left: 3.166667rem; 10 margin-left: 3.166667rem;
11 11
12 .separator { 12 .separator {
13 margin:auto; 13 margin: auto;
14 width: 10.5rem ; 14 width: 10.5rem;
15 height: .083333rem; 15 height: .083333rem;
16 background-color: #dcdddd; 16 background-color: #dcdddd;
17 } 17 }
18
18 .menu-item { 19 .menu-item {
19 height: 5.916667rem; 20 height: 5.916667rem;
20 line-height: 5.916667rem; 21 line-height: 5.916667rem;
21 font-size: 1.5rem ; 22 font-size: 1.5rem;
22 font-weight: bold; 23 font-weight: bold;
23 color: #4c4948; 24 color: #4c4948;
24 text-align: center; 25 text-align: center;
...@@ -29,45 +30,53 @@ ...@@ -29,45 +30,53 @@
29 30
30 i { 31 i {
31 display: inline-block; 32 display: inline-block;
32 width: 3.416667rem /* 41/12 */; 33 width: 3.416667rem;
33 height: 3.416667rem /* 41/12 */; 34 height: 3.416667rem;
34 // margin-right: 1.333333rem; 35 margin-right: .166667rem;
35 margin-right: .166667rem /* 2/12 */;
36 vertical-align: middle; 36 vertical-align: middle;
37 } 37 }
38
38 .m1 { 39 .m1 {
39 background: url("~@/assets/images/insurance-query/m1-unselect.png") no-repeat center center; 40 background: url("~@/assets/images/insurance-query/m1-unselect.png") no-repeat center center;
40 background-size: 100% 100%; 41 background-size: 100% 100%;
41 } 42 }
43
42 .m2 { 44 .m2 {
43 background: url("~@/assets/images/insurance-query/m2-unselect.png") no-repeat center center; 45 background: url("~@/assets/images/insurance-query/m2-unselect.png") no-repeat center center;
44 background-size: 100% 100%; 46 background-size: 100% 100%;
45 } 47 }
48
46 .m3 { 49 .m3 {
47 background: url("~@/assets/images/insurance-query/m3-unselect.png") no-repeat center center; 50 background: url("~@/assets/images/insurance-query/m3-unselect.png") no-repeat center center;
48 background-size: 100% 100%; 51 background-size: 100% 100%;
49 } 52 }
53
50 .m4 { 54 .m4 {
51 background: url("~@/assets/images/insurance-query/m4-unselect.png") no-repeat center center; 55 background: url("~@/assets/images/insurance-query/m4-unselect.png") no-repeat center center;
52 background-size: 100% 100%; 56 background-size: 100% 100%;
53 } 57 }
58
54 .m5 { 59 .m5 {
55 background: url("~@/assets/images/insurance-query/m5-unselect.png") no-repeat center center; 60 background: url("~@/assets/images/insurance-query/m5-unselect.png") no-repeat center center;
56 background-size: 100% 100%; 61 background-size: 100% 100%;
57 } 62 }
63
58 .m6 { 64 .m6 {
59 background: url("~@/assets/images/insurance-query/m6-unselect.png") no-repeat center center; 65 background: url("~@/assets/images/insurance-query/m6-unselect.png") no-repeat center center;
60 background-size: 100% 100%; 66 background-size: 100% 100%;
61 } 67 }
68
62 .m7 { 69 .m7 {
63 background: url("~@/assets/images/insurance-query/m7-unselect.png") no-repeat center center; 70 background: url("~@/assets/images/insurance-query/m7-unselect.png") no-repeat center center;
64 background-size: 100% 100%; 71 background-size: 100% 100%;
65 } 72 }
73
66 .m8 { 74 .m8 {
67 background: url("~@/assets/images/insurance-query/m8-unselect.png") no-repeat center center; 75 background: url("~@/assets/images/insurance-query/m8-unselect.png") no-repeat center center;
68 background-size: 100% 100%; 76 background-size: 100% 100%;
69 } 77 }
70 } 78 }
79
71 .menu-item.activity { 80 .menu-item.activity {
72 color: #f05a23 !important; 81 color: #f05a23 !important;
73 82
...@@ -75,30 +84,37 @@ ...@@ -75,30 +84,37 @@
75 background: url("~@/assets/images/insurance-query/m1.png") no-repeat center center; 84 background: url("~@/assets/images/insurance-query/m1.png") no-repeat center center;
76 background-size: 100% 100%; 85 background-size: 100% 100%;
77 } 86 }
87
78 .m2 { 88 .m2 {
79 background: url("~@/assets/images/insurance-query/m2.png") no-repeat center center; 89 background: url("~@/assets/images/insurance-query/m2.png") no-repeat center center;
80 background-size: 100% 100%; 90 background-size: 100% 100%;
81 } 91 }
92
82 .m3 { 93 .m3 {
83 background: url("~@/assets/images/insurance-query/m3.png") no-repeat center center; 94 background: url("~@/assets/images/insurance-query/m3.png") no-repeat center center;
84 background-size: 100% 100%; 95 background-size: 100% 100%;
85 } 96 }
97
86 .m4 { 98 .m4 {
87 background: url("~@/assets/images/insurance-query/m4.png") no-repeat center center; 99 background: url("~@/assets/images/insurance-query/m4.png") no-repeat center center;
88 background-size: 100% 100%; 100 background-size: 100% 100%;
89 } 101 }
102
90 .m5 { 103 .m5 {
91 background: url("~@/assets/images/insurance-query/m5.png") no-repeat center center; 104 background: url("~@/assets/images/insurance-query/m5.png") no-repeat center center;
92 background-size: 100% 100%; 105 background-size: 100% 100%;
93 } 106 }
107
94 .m6 { 108 .m6 {
95 background: url("~@/assets/images/insurance-query/m6.png") no-repeat center center; 109 background: url("~@/assets/images/insurance-query/m6.png") no-repeat center center;
96 background-size: 100% 100%; 110 background-size: 100% 100%;
97 } 111 }
112
98 .m7 { 113 .m7 {
99 background: url("~@/assets/images/insurance-query/m7.png") no-repeat center center; 114 background: url("~@/assets/images/insurance-query/m7.png") no-repeat center center;
100 background-size: 100% 100%; 115 background-size: 100% 100%;
101 } 116 }
117
102 .m8 { 118 .m8 {
103 background: url("~@/assets/images/insurance-query/m8.png") no-repeat center center; 119 background: url("~@/assets/images/insurance-query/m8.png") no-repeat center center;
104 background-size: 100% 100%; 120 background-size: 100% 100%;
...@@ -112,7 +128,7 @@ ...@@ -112,7 +128,7 @@
112 width: 1.166667rem; 128 width: 1.166667rem;
113 129
114 .item { 130 .item {
115 width: 1.166667rem ; 131 width: 1.166667rem;
116 height: 6rem; 132 height: 6rem;
117 display: flex; 133 display: flex;
118 justify-content: flex-start; 134 justify-content: flex-start;
...@@ -121,7 +137,7 @@ ...@@ -121,7 +137,7 @@
121 137
122 .activity .triangle { 138 .activity .triangle {
123 width: .583333rem; 139 width: .583333rem;
124 height: 1.166667rem ; 140 height: 1.166667rem;
125 background: url("~@/assets/images/insurance-query/triangle.png") no-repeat center center; 141 background: url("~@/assets/images/insurance-query/triangle.png") no-repeat center center;
126 background-size: 100% 100%; 142 background-size: 100% 100%;
127 } 143 }
...@@ -129,7 +145,7 @@ ...@@ -129,7 +145,7 @@
129 145
130 .right-panel { 146 .right-panel {
131 margin-left: 1.166667rem; 147 margin-left: 1.166667rem;
132 width: 64.166667rem ; 148 width: 64.166667rem;
133 background-color: #ffffff; 149 background-color: #ffffff;
134 150
135 .panel { 151 .panel {
...@@ -142,5 +158,5 @@ ...@@ -142,5 +158,5 @@
142 } 158 }
143 159
144 .empty-line { 160 .empty-line {
145 height: 1.333333rem /* 16/12 */; 161 height: 1.333333rem;
146 } 162 }
......
...@@ -64,15 +64,18 @@ ...@@ -64,15 +64,18 @@
64 <div class="panel" :class="{activity : activity == 'm1'}"></div> 64 <div class="panel" :class="{activity : activity == 'm1'}"></div>
65 <div class="panel" :class="{activity : activity == 'm2'}"> 65 <div class="panel" :class="{activity : activity == 'm2'}">
66 <payment-type></payment-type> 66 <payment-type></payment-type>
67 <div class="empty-line"></div></div> 67 <!-- <div class="empty-line"></div> -->
68 </div>
68 <div class="panel" :class="{activity : activity == 'm3'}"> 69 <div class="panel" :class="{activity : activity == 'm3'}">
69 <insurance-query></insurance-query> 70 <insurance-query></insurance-query>
70 <div class="empty-line"></div></div> 71 <!-- <div class="empty-line"></div> -->
72 </div>
71 <div class="panel" :class="{activity : activity == 'm4'}"></div> 73 <div class="panel" :class="{activity : activity == 'm4'}"></div>
72 <div class="panel" :class="{activity : activity == 'm5'}"></div> 74 <div class="panel" :class="{activity : activity == 'm5'}"></div>
73 <div class="panel" :class="{activity : activity == 'm6'}"> 75 <div class="panel" :class="{activity : activity == 'm6'}">
74 <reservation></reservation> 76 <reservation></reservation>
75 <div class="empty-line"></div></div> 77 <!-- <div class="empty-line"></div> -->
78 </div>
76 <div class="panel" :class="{activity : activity == 'm7'}"></div> 79 <div class="panel" :class="{activity : activity == 'm7'}"></div>
77 <div class="panel" :class="{activity : activity == 'm8'}"></div> 80 <div class="panel" :class="{activity : activity == 'm8'}"></div>
78 </div> 81 </div>
......
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
49 // width: auto; 49 // width: auto;
50 text-align: center; 50 text-align: center;
51 justify-content: space-between; 51 justify-content: space-between;
52 max-width: 79.166667rem /* 950/12 */; 52 max-width: 79.166667rem;
53 // max-width: 1200px; 53 // max-width: 1200px;
54 54
55 55
......
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
78 margin: 2.5rem auto 0; 78 margin: 2.5rem auto 0;
79 display: flex; 79 display: flex;
80 align-items: center; 80 align-items: center;
81 padding-left: 1rem /* 12/12 */; 81 padding-left: 1rem;
82 82
83 .check { 83 .check {
84 height: 1rem; 84 height: 1rem;
...@@ -118,7 +118,7 @@ ...@@ -118,7 +118,7 @@
118 &-item { 118 &-item {
119 position: relative; 119 position: relative;
120 // margin-top: 2.75rem; 120 // margin-top: 2.75rem;
121 margin-top: 2.5rem /* 30/12 */; 121 margin-top: 2.5rem;
122 122
123 .label { 123 .label {
124 font-family: MicrosoftYaHei; 124 font-family: MicrosoftYaHei;
......
...@@ -85,7 +85,7 @@ ...@@ -85,7 +85,7 @@
85 margin: 2.5rem auto 0; 85 margin: 2.5rem auto 0;
86 display: flex; 86 display: flex;
87 align-items: center; 87 align-items: center;
88 padding-left: 1rem /* 12/12 */; 88 padding-left: 1rem;
89 89
90 .check { 90 .check {
91 height: 1rem; 91 height: 1rem;
...@@ -99,8 +99,7 @@ ...@@ -99,8 +99,7 @@
99 99
100 &-submit { 100 &-submit {
101 @include btc2(13.5rem, 4rem, 16px); 101 @include btc2(13.5rem, 4rem, 16px);
102 margin: 4.166667rem /* 50/12 */auto 0 ; 102 margin: 4.166667rem auto 0 ;
103 // margin: 8.25rem auto 0;
104 letter-spacing: 1.6px; 103 letter-spacing: 1.6px;
105 } 104 }
106 105
......
1 @import '@/styles/_support'; 1 @import '@/styles/_support';
2 2
3 input { 3 input {
4 padding: 0 2.083333rem /* 25/12 */; 4 padding: 0 2.083333rem;
5 } 5 }
6 6
7 .content { 7 .content {
...@@ -48,7 +48,7 @@ input { ...@@ -48,7 +48,7 @@ input {
48 border: solid 1px #dcdddd; 48 border: solid 1px #dcdddd;
49 background-color: #ffffff; 49 background-color: #ffffff;
50 border-radius: 3.5rem; 50 border-radius: 3.5rem;
51 padding: 0 2.083333rem /* 25/12 */; 51 padding: 0 2.083333rem;
52 } 52 }
53 53
54 // 长文本 54 // 长文本
......
...@@ -100,6 +100,6 @@ ...@@ -100,6 +100,6 @@
100 </template> 100 </template>
101 101
102 <script src="./reservation.js"></script> 102 <script src="./reservation.js"></script>
103 <style lang="scss" > 103 <style lang="scss" scoped>
104 @import "./reservation.scss"; 104 @import "./reservation.scss";
105 </style> 105 </style>
......