card4 add
This commit is contained in:
parent
d7756178e6
commit
d7d3260ac2
|
@ -167,7 +167,17 @@
|
||||||
{{ message.text }}
|
{{ message.text }}
|
||||||
</div>
|
</div>
|
||||||
<div class="c_bt">
|
<div class="c_bt">
|
||||||
<div class="helper">
|
<div class="switch">
|
||||||
|
<div class="sw_itm sw_itm_slected">
|
||||||
|
<div>立即就诊</div>
|
||||||
|
<div class="heng"></div>
|
||||||
|
</div>
|
||||||
|
<div class="sw_itm">
|
||||||
|
<div>更多医生</div>
|
||||||
|
<div class="heng"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="helper" v-for="dd in 3">
|
||||||
<div class="help_top">
|
<div class="help_top">
|
||||||
推荐指数:98
|
推荐指数:98
|
||||||
</div>
|
</div>
|
||||||
|
@ -197,7 +207,7 @@
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="book_btn">预约</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -671,7 +681,7 @@ const scollToButtom = () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
.card4 {
|
.card4 {
|
||||||
width: 300px;
|
width: 330px;
|
||||||
height: 580px;
|
height: 580px;
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
@ -684,12 +694,66 @@ const scollToButtom = () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
.c_bt {
|
.c_bt {
|
||||||
|
.switch {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
border-top: 1px #333 solid;
|
||||||
|
border: 1px #333 solid;
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: PingFang SC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #333333;
|
||||||
|
|
||||||
|
.sw_itm {
|
||||||
|
width: 50%;
|
||||||
|
height: 60px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
.heng{
|
||||||
|
width: 21px;
|
||||||
|
height: 1px;
|
||||||
|
border: 1px solid transparentd;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sw_itm_slected {
|
||||||
|
font-weight: 600;
|
||||||
|
color: #4379FF;
|
||||||
|
.heng{
|
||||||
|
width: 21px;
|
||||||
|
height: 1px;
|
||||||
|
border: 1px solid #4379FF ;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* .sw_itm_slected::before {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
height: 1px;
|
||||||
|
width: 6px;
|
||||||
|
border: 1px solid #333;
|
||||||
|
|
||||||
|
} */
|
||||||
|
}
|
||||||
|
|
||||||
.helper {
|
.helper {
|
||||||
|
background-color: #EFF3FC;
|
||||||
|
border-radius: 16px;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-top: 8px;
|
||||||
|
|
||||||
.help_top {
|
.help_top {
|
||||||
|
background: linear-gradient(90deg, #6491FF 0%, #4379FF 100%);
|
||||||
|
padding-left: 16px;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.help_botom {
|
.help_botom {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
.card_top {
|
.card_top {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
|
@ -768,6 +832,7 @@ const scollToButtom = () => {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
|
|
||||||
.fill_tag {
|
.fill_tag {
|
||||||
height: 16px;
|
height: 16px;
|
||||||
background: #C2D2FC;
|
background: #C2D2FC;
|
||||||
|
@ -801,6 +866,18 @@ const scollToButtom = () => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.book_btn {
|
||||||
|
width: 48px;
|
||||||
|
height: 24px;
|
||||||
|
background: linear-gradient(90deg, #6591FF 0%, #4379FF 100%);
|
||||||
|
border-radius: 22px 22px 22px 22px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 24px;
|
||||||
|
color: #fff;
|
||||||
|
position: absolute;
|
||||||
|
right: 16px;
|
||||||
|
top: 16px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue