583 lines
11 KiB
SCSS
583 lines
11 KiB
SCSS
|
html,
|
||
|
|
body {
|
||
|
|
height: 100%;
|
||
|
|
position: relative;
|
||
|
|
background: #f5f5f5;
|
||
|
|
}
|
||
|
|
|
||
|
|
i {
|
||
|
|
font-style: normal;
|
||
|
|
}
|
||
|
|
|
||
|
|
#myapp {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
[v-cloak] {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#Header {
|
||
|
|
color: rgba(255, 255, 255, 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.van-notice-bar {
|
||
|
|
height: 40*2upx;
|
||
|
|
background: #fff !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.width-s {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* .title-header {
|
||
|
|
width: 100%;
|
||
|
|
height: 1.2*37*2upx;
|
||
|
|
height: 50*2upx;
|
||
|
|
background: #348cf2;
|
||
|
|
} */
|
||
|
|
|
||
|
|
/* .btn-header h1 {
|
||
|
|
width: 2*37*2upx;
|
||
|
|
height: .666667*37*2upx;
|
||
|
|
font-size: .373333*37*2upx;
|
||
|
|
background: #348cf2;
|
||
|
|
color: #fff;
|
||
|
|
font-weight: 500;
|
||
|
|
} */
|
||
|
|
/* .btn-header {
|
||
|
|
height: .666667*37*2upx;
|
||
|
|
overflow: hidden;
|
||
|
|
font-size: .48*37*2upx;
|
||
|
|
color: #fff;
|
||
|
|
line-height: .666667*37*2upx;
|
||
|
|
} */
|
||
|
|
.btns-header {
|
||
|
|
width: 100%;
|
||
|
|
height: 1.066667*37*2upx;
|
||
|
|
background: #ffffff;
|
||
|
|
font-size: 0.32*37*2upx;
|
||
|
|
color: #333333;
|
||
|
|
/* padding-left: 0.8*37*2upx; */
|
||
|
|
}
|
||
|
|
|
||
|
|
.btns-header p :nth-child(2) {
|
||
|
|
color: #333333;
|
||
|
|
font-size: 0.32*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btns-header .round {
|
||
|
|
width: 0.32*37*2upx;
|
||
|
|
height: 0.32*37*2upx;
|
||
|
|
display: inline-block;
|
||
|
|
border-radius: 50%;
|
||
|
|
background: #cccccc;
|
||
|
|
margin-right: 0.266667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btns-header .left {
|
||
|
|
margin-right: 3.493333*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btns-header p,
|
||
|
|
.barber>div,
|
||
|
|
.kind>div {
|
||
|
|
display: flex;
|
||
|
|
|
||
|
|
line-height: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* .borderLeftH1{
|
||
|
|
border-left: 1*2upx solid #fff;
|
||
|
|
border-top: 1*2upx solid #fff;
|
||
|
|
border-bottom: 1*2upx solid #fff;
|
||
|
|
border-right: 0*2upx;
|
||
|
|
border-radius: .133333*37*2upx 0*37*2upx 0*37*2upx .133333*37*2upx!important;
|
||
|
|
}
|
||
|
|
.borderRightH1{
|
||
|
|
border-right: 1*2upx solid #fff;
|
||
|
|
border-top: 1*2upx solid #fff;
|
||
|
|
border-bottom: 1*2upx solid #fff;
|
||
|
|
border-left: 0*2upx;
|
||
|
|
border-radius: 0*37*2upx .133333*37*2upx .133333*37*2upx 0*37*2upx!important;
|
||
|
|
} */
|
||
|
|
|
||
|
|
.height-fz {
|
||
|
|
/* height: calc(100% - 1.2*37*2upx ); */
|
||
|
|
height: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* .btn-header .show{
|
||
|
|
color: #fff;
|
||
|
|
background: #348cf2;
|
||
|
|
} */
|
||
|
|
|
||
|
|
.zb {
|
||
|
|
background: #00c277 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.zbLeft {
|
||
|
|
border-radius: 0.133333*37*2upx 0*37*2upx 0*37*2upx 0.133333*37*2upx !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.zbRight {
|
||
|
|
border-radius: 0*37*2upx 0.133333*37*2upx 0.133333*37*2upx 0*37*2upx !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.yz {
|
||
|
|
color: #348cf2;
|
||
|
|
background: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* 内容区 */
|
||
|
|
.content {
|
||
|
|
// padding: 0.266667*37*2upx 0*37*2upx 0 0*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content,
|
||
|
|
.content:nth-child(1) div {
|
||
|
|
width: 100%;
|
||
|
|
/* padding-bottom: 2.56*37*2upx; */
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-header {
|
||
|
|
/* height: 1.2*37*2upx; */
|
||
|
|
width: 100%;
|
||
|
|
background: #ffffff;
|
||
|
|
color: #333333;
|
||
|
|
font-size: 0.293333*37*2upx;
|
||
|
|
overflow-x: scroll;
|
||
|
|
display: flex;
|
||
|
|
padding: .2*37*2upx 0.4*37*2upx;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-content {
|
||
|
|
font-size: 0.373333*37*2upx;
|
||
|
|
position: relative;
|
||
|
|
color: #00c277;
|
||
|
|
width: 2.6*37*2upx !important;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
border-radius: .3*37*2upx;
|
||
|
|
margin-right: .3*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.dataactive {
|
||
|
|
font-size: 0.373333*37*2upx;
|
||
|
|
position: relative;
|
||
|
|
color: #00c277;
|
||
|
|
width: 2.6*37*2upx !important;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
border-radius: .3*37*2upx;
|
||
|
|
margin-right: .3*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.dataactives {
|
||
|
|
font-size: 16*2upx;
|
||
|
|
position: relative;
|
||
|
|
color: #ffffff;
|
||
|
|
width: 2.6*37*2upx !important;
|
||
|
|
border-bottom: none;
|
||
|
|
background-color: #00c277;
|
||
|
|
}
|
||
|
|
|
||
|
|
.dataactive .line {
|
||
|
|
width: 0.773333*37*2upx;
|
||
|
|
height: 0.08*37*2upx;
|
||
|
|
background: #00c277;
|
||
|
|
position: absolute;
|
||
|
|
left: center;
|
||
|
|
bottom: -1%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-header span {
|
||
|
|
height: 100%;
|
||
|
|
width: 1.8*37*2upx;
|
||
|
|
box-sizing: border-box;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-header span .week {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
margin-top: 0.08*37*2upx;
|
||
|
|
margin-bottom: 0.08*37*2upx;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-headers {
|
||
|
|
width: 100%;
|
||
|
|
background: #ffffff;
|
||
|
|
color: #333333;
|
||
|
|
font-size: 14*2upx;
|
||
|
|
overflow-x: scroll;
|
||
|
|
display: flex;
|
||
|
|
padding: 10*2upx;
|
||
|
|
border-bottom: 1*2upx solid #f5f5f5;
|
||
|
|
height: 90*2upx;
|
||
|
|
border-radius: 10*2upx;
|
||
|
|
padding-left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-contents {
|
||
|
|
border-left: 1*2upx solid #f5f5f5;
|
||
|
|
border-top: 1*2upx solid #f5f5f5;
|
||
|
|
border-bottom: 1*2upx solid #f5f5f5;
|
||
|
|
text-align: center;
|
||
|
|
padding-top: 10*2upx;
|
||
|
|
border-radius: 15*2upx;
|
||
|
|
margin-right: .2703*37*2upx;
|
||
|
|
box-shadow: 0 2*2upx 4*2upx rgba(0, 0, 0, 0.12), 0 0 6*2upx rgba(0, 0, 0, 0.04);
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-around;
|
||
|
|
width: 80rpx;
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time {
|
||
|
|
background: #fff;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time img {
|
||
|
|
width: 0.48*37*2upx;
|
||
|
|
height: 0.48*37*2upx;
|
||
|
|
position: absolute;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-wrap {
|
||
|
|
background: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-item {
|
||
|
|
box-sizing: border-box;
|
||
|
|
width: 50%;
|
||
|
|
height: 1.333333*37*2upx;
|
||
|
|
border-right: 0.013333*37*2upx solid #eeeeee;
|
||
|
|
border-top: 0.013333*37*2upx solid #ffffff;
|
||
|
|
border-left: 0.013333*37*2upx solid #ffffff;
|
||
|
|
border-bottom: 0.013333*37*2upx solid #eeeeee;
|
||
|
|
color: #333333;
|
||
|
|
text-align: center;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: space-between;
|
||
|
|
display: inline-block;
|
||
|
|
margin-top: 0.2*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-wrap :nth-child(4) {
|
||
|
|
border-right: 0.013333*37*2upx solid #ffffff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-wrap :nth-child(8) {
|
||
|
|
border-right: 0.013333*37*2upx solid #ffffff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.showcommit {
|
||
|
|
position: absolute;
|
||
|
|
z-index: 999;
|
||
|
|
width: 280*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.active {
|
||
|
|
display: inline-block !important;
|
||
|
|
/* color: #fff; */
|
||
|
|
/* background-color: #00c277 !important; */
|
||
|
|
border-right: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-bottom: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-top: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-left: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.actives {
|
||
|
|
display: inline-block !important;
|
||
|
|
color: #fff;
|
||
|
|
background-color: #00c277 !important;
|
||
|
|
border-right: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-bottom: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-top: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-left: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.active1 {
|
||
|
|
border-right: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-bottom: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-top: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
border-left: 0.013333*37*2upx solid #00c277 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time .yiyue {
|
||
|
|
color: #348cf2;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-item p {
|
||
|
|
font-size: 0.32*37*2upx;
|
||
|
|
margin-top: 0.3*37*2upx;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
|
||
|
|
.time-item span {
|
||
|
|
font-size: 0.266667*37*2upx;
|
||
|
|
color: #333333;
|
||
|
|
}
|
||
|
|
|
||
|
|
.kind {
|
||
|
|
background: #fff;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-around;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0 0.4*37*2upx;
|
||
|
|
height: 1.333333*37*2upx;
|
||
|
|
/* margin-bottom: 0.266667*37*2upx; */
|
||
|
|
/* border-bottom-right-radius: 0.133333*37*2upx;
|
||
|
|
border-bottom-left-radius: 0.133333*37*2upx; */
|
||
|
|
}
|
||
|
|
|
||
|
|
.kind_item .round {
|
||
|
|
width: 0.32*37*2upx;
|
||
|
|
height: 0.32*37*2upx;
|
||
|
|
border-radius: 50%;
|
||
|
|
background: #cccccc;
|
||
|
|
display: inline-block;
|
||
|
|
margin-right: 0.266667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.kind span,
|
||
|
|
.barber-item {
|
||
|
|
color: #333333;
|
||
|
|
font-size: 0.32*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.barber> :last-child {
|
||
|
|
margin-left: 3.08*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.left {
|
||
|
|
margin-right: 3.493333*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.kindactive {
|
||
|
|
background: #00c277 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.new_name {
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
height: .8*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.barber {
|
||
|
|
background: #fff;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: .2*37*2upx 0.533333*37*2upx;
|
||
|
|
/* height: 1.333333*37*2upx; */
|
||
|
|
/* border-bottom: 0.013333*37*2upx solid #eeeeee;
|
||
|
|
border-top-left-radius: 0.133333*37*2upx;
|
||
|
|
border-top-right-radius: 0.133333*37*2upx; */
|
||
|
|
}
|
||
|
|
|
||
|
|
.barberactive {
|
||
|
|
background: #00c277 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* .tip-s {
|
||
|
|
color: #333333;
|
||
|
|
font-size: .373333*37*2upx;
|
||
|
|
margin-right: .293333*37*2upx;
|
||
|
|
} */
|
||
|
|
|
||
|
|
.barber-item .round {
|
||
|
|
width: 0.32*37*2upx;
|
||
|
|
height: 0.32*37*2upx;
|
||
|
|
border-radius: 0.32*37*2upx;
|
||
|
|
background: #cccccc;
|
||
|
|
display: inline-block;
|
||
|
|
margin-right: 0.266667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.detail {
|
||
|
|
/* margin-bottom: 0.266667*37*2upx; */
|
||
|
|
background: #fff;
|
||
|
|
border-radius: 0.133333*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.detail p {
|
||
|
|
height: 1.2*37*2upx;
|
||
|
|
color: #333333;
|
||
|
|
font-size: 0.346667*37*2upx;
|
||
|
|
border-bottom: 0.013333*37*2upx solid #eeeeee;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding-left: 0.266667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.detail p img {
|
||
|
|
width: 0.24*37*2upx;
|
||
|
|
height: 0.466667*37*2upx;
|
||
|
|
position: absolute;
|
||
|
|
right: 0.266667*37*2upx;
|
||
|
|
top: 0.36*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.detail p input {
|
||
|
|
font-size: 0.346667*37*2upx;
|
||
|
|
border: 0;
|
||
|
|
outline: none;
|
||
|
|
color: #333333;
|
||
|
|
width: 70%;
|
||
|
|
font-weight: 400;
|
||
|
|
}
|
||
|
|
|
||
|
|
.detail p input::-webkit-input-placeholder {
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
|
||
|
|
.detail span {
|
||
|
|
border: 0;
|
||
|
|
outline: none;
|
||
|
|
padding-left: 1*37*2upx;
|
||
|
|
color: #999;
|
||
|
|
font-weight: 400;
|
||
|
|
}
|
||
|
|
|
||
|
|
.part {
|
||
|
|
margin-left: 1.066667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.name {
|
||
|
|
/* margin-left: 0.666667*37*2upx; */
|
||
|
|
}
|
||
|
|
|
||
|
|
.tel {
|
||
|
|
margin-left: 0.32*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.detail .last {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.maska {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
position: fixed;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
background: rgba(0, 0, 0, 0.4);
|
||
|
|
}
|
||
|
|
|
||
|
|
.deptBg {
|
||
|
|
width: 100%;
|
||
|
|
height: 33%;
|
||
|
|
position: fixed;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
background-color: #fff;
|
||
|
|
overflow-y: scroll;
|
||
|
|
padding-left: 0.4*37*2upx;
|
||
|
|
box-sizing: border-box;
|
||
|
|
}
|
||
|
|
|
||
|
|
.deptBg span {
|
||
|
|
width: 100%;
|
||
|
|
height: 1.067*37*2upx;
|
||
|
|
border-bottom: 0.013333*37*2upx solid #ccc;
|
||
|
|
font-size: 0.373*37*2upx;
|
||
|
|
color: #333333;
|
||
|
|
line-height: 1.067*37*2upx;
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
|
||
|
|
.deptBg span:last-child {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* 评论 */
|
||
|
|
.evaluate {
|
||
|
|
background: #fff;
|
||
|
|
border-radius: 0.133333*37*2upx;
|
||
|
|
padding-bottom: 1*37*2upx
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate>p {
|
||
|
|
font-size: 0.373333*37*2upx;
|
||
|
|
color: #333333;
|
||
|
|
height: 1.2*37*2upx;
|
||
|
|
line-height: 1.2*37*2upx;
|
||
|
|
border-bottom: 0.013333*37*2upx solid #eeeeee;
|
||
|
|
padding-left: 0.266667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate .evaluate_item {
|
||
|
|
border-bottom: 0.013333*37*2upx solid #eeeeee;
|
||
|
|
padding-left: 0.266667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate .evaluate_item:last-child {
|
||
|
|
border: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate .evaluate_item .user {
|
||
|
|
padding: 0.4*37*2upx 0 0.293333*37*2upx 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate .evaluate_item .user .username {
|
||
|
|
color: #333333;
|
||
|
|
font-size: 0.373333*37*2upx;
|
||
|
|
display: inline-block;
|
||
|
|
margin-right: 0.266667*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate .evaluate_item .user span {
|
||
|
|
display: inline-block;
|
||
|
|
vertical-align: middle;
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate .evaluate_item .user span img {
|
||
|
|
width: 0.413333*37*2upx;
|
||
|
|
height: 0.4*37*2upx;
|
||
|
|
margin-right: 0.053333*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.evaluate .evaluate_item p {
|
||
|
|
color: #999999;
|
||
|
|
font-size: 0.32*37*2upx;
|
||
|
|
word-break: break-all;
|
||
|
|
padding-right: 0.4*37*2upx;
|
||
|
|
padding-bottom: 0.4*37*2upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* iphone 6plus screen-width:414*2upx */
|
||
|
|
@media only screen and (max-width: 768*2upx) {
|
||
|
|
.title-header {
|
||
|
|
height: 1.242*37*2upx;
|
||
|
|
padding-top: 0.012*37*2upx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media only screen and (-webkit-device-pixel-ratio: 2) {
|
||
|
|
.title-header {
|
||
|
|
height: 1.242*37*2upx;
|
||
|
|
padding-top: 0.012*37*2upx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* @media only screen and (-webkit-device-pixel-ratio: 3) {
|
||
|
|
.title-header {
|
||
|
|
height: 2.374*37*2upx;
|
||
|
|
padding-top: 1.173*37*2upx;
|
||
|
|
|
||
|
|
}
|
||
|
|
} */
|