Mauve
448 lines
7.4 KiB
SCSS
448 lines
7.4 KiB
SCSS
page{
|
|
background-color: $page-color-light;
|
|
font-size:$font-base;
|
|
font-family: "Inter-Regular";
|
|
font-weight:600;
|
|
}
|
|
.hz-page{
|
|
padding-bottom:calc(var(--window-bottom) + 20px);
|
|
}
|
|
.hz-bg-white{
|
|
background-color: $page-color-light;
|
|
}
|
|
.hz-bg-primary{
|
|
background-color: $base-color;
|
|
}
|
|
.hz-bg-primary:active{
|
|
background-color: $base-color-active;
|
|
}
|
|
.hz-bg-disPrimary{
|
|
background-color: $base-color-disActive;
|
|
}
|
|
.hz-bg-light{
|
|
background-color: $base-color-light;
|
|
}
|
|
.hz-font-color-black{
|
|
color: $font-color-black;
|
|
}
|
|
.hz-font-color-dark{
|
|
color: $font-color-dark;
|
|
}
|
|
.hz-spacing{
|
|
margin-left:$page-col-spacing;
|
|
margin-right:$page-col-spacing;
|
|
}
|
|
.hz-split{
|
|
border-top:1rpx solid #dddddd;
|
|
margin-top:6px;
|
|
margin-bottom:6px;
|
|
}
|
|
.hz-split-primary{
|
|
border-top:1rpx solid $base-color;
|
|
margin-top:6px;
|
|
margin-bottom:6px;
|
|
}
|
|
.text-truncate {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.hz-row-spacing{
|
|
margin-top:$page-row-spacing;
|
|
}
|
|
.hz-font-min{
|
|
font-size:$font-min;
|
|
}
|
|
.hz-font-12px{
|
|
font-size:$font-12px;
|
|
}
|
|
.hz-font-sm{
|
|
font-size:$font-sm;
|
|
}
|
|
.hz-font-base{
|
|
font-size:$font-base;
|
|
}
|
|
.hz-font-md{
|
|
font-size:$font-md;
|
|
}
|
|
.hz-font-lg{
|
|
font-size:$font-lg;
|
|
}
|
|
.hz-font-xl{
|
|
font-size:$font-xl;
|
|
}
|
|
.hz-font-color-danger{
|
|
color:$font-color-highlight1;
|
|
}
|
|
.hz-font-color-primary{
|
|
color:$font-color-highlight2;
|
|
}
|
|
.hz-font-color-light{
|
|
color:$base-color-light;
|
|
}
|
|
.hz-font-color-white{
|
|
color:$font-color-white;
|
|
}
|
|
.hz-font-normal{
|
|
font-family: "Inter-Regular";
|
|
}
|
|
.hz-font-bold{
|
|
font-family: "Inter-Medium";
|
|
}
|
|
.hz-font-bolder{
|
|
font-family: "Inter-Bold";
|
|
}
|
|
.hz-text-left{
|
|
text-align: left;
|
|
}
|
|
.hz-text-center{
|
|
text-align: center;
|
|
}
|
|
.hz-text-right{
|
|
text-align: right;
|
|
}
|
|
.hz-banner-bg{
|
|
border-radius: 0 0 5% 5%;
|
|
}
|
|
.hz-card-profile{
|
|
border-radius: 12px;
|
|
padding:18px;
|
|
background-color: $font-color-highlight2;
|
|
color:$font-color-white;
|
|
}
|
|
.hz-card-booking{
|
|
border-radius: 12px;
|
|
padding:18px;
|
|
background-color: $page-color-greylight;
|
|
color:$font-color-black;
|
|
}
|
|
.hz-card-extend{
|
|
border-radius: 12px;
|
|
padding:18px;
|
|
background-color: $base-color-light;
|
|
color:$font-color-black;
|
|
}
|
|
.hz-card-level{
|
|
border-radius: 4px;
|
|
padding:0px 4px;
|
|
font-size:9px;
|
|
height:12px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background-color: $uni-color-error;
|
|
color:$font-color-white;
|
|
}
|
|
.hz-mr-t-30{
|
|
margin-top:30rpx;
|
|
}
|
|
.hz-mr-b-30{
|
|
margin-bottom:30rpx;
|
|
}
|
|
.hz-mr-t-20{
|
|
margin-top:20rpx;
|
|
}
|
|
.hz-mr-b-20{
|
|
margin-bottom:20rpx;
|
|
}
|
|
.hz-pd-16{
|
|
padding:16rpx;
|
|
}
|
|
.hz-pd-30{
|
|
padding:30rpx;
|
|
}
|
|
.hz-pd-l-30{
|
|
padding-left:30rpx;
|
|
}
|
|
.hz-pd-r-30{
|
|
padding-right:30rpx;
|
|
}
|
|
.hz-nav-btn{
|
|
width:22px;
|
|
height:22px;
|
|
}
|
|
.hz-flex-row{
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
.hz-flex-col{
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.hz-flex-vertical-mid{
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.hz-btn-status{
|
|
border-radius: 4px;
|
|
padding: 3px 2px;
|
|
font-size:20rpx;
|
|
color:#ffffff;
|
|
text-align:center;
|
|
}
|
|
.hz-status-duein{
|
|
background-color: $font-color-spec;
|
|
}
|
|
.hz-status-reserved{
|
|
background-color: $uni-color-primary;
|
|
}
|
|
.hz-status-cancel{
|
|
background-color: $font-color-highlight2;
|
|
}
|
|
.hz-status-checkedin{
|
|
background-color: $font-color-spec;
|
|
}
|
|
.hz-status-dueout{
|
|
background-color: $font-color-spec;
|
|
}
|
|
.hz-status-pending{
|
|
background-color: $uni-text-color-placeholder;
|
|
}
|
|
.hz-status-waitlist{
|
|
background-color: $uni-color-error;
|
|
}
|
|
.hz-status-approval{
|
|
background-color: $uni-color-error;
|
|
}
|
|
.hz-status-font-duein{
|
|
color: $font-color-spec;
|
|
}
|
|
.hz-status-font-reserved{
|
|
color: $uni-color-primary;
|
|
}
|
|
.hz-status-font-cancel{
|
|
color: $font-color-highlight2;
|
|
}
|
|
.hz-status-font-approval{
|
|
color: $uni-color-error;
|
|
}
|
|
.hz-status-font-checkedin{
|
|
color: $font-color-spec;
|
|
}
|
|
.hz-status-font-dueout{
|
|
color: $font-color-spec;
|
|
}
|
|
.hz-status-font-pending{
|
|
color: $uni-text-color-placeholder;
|
|
}
|
|
.hz-status-font-waitlist{
|
|
color: $uni-color-error;
|
|
}
|
|
.hz-status-font-pendingApproval{
|
|
color: #E8D9BA
|
|
}
|
|
.hz-btn-extend{
|
|
border-radius: 4px;
|
|
padding: 3px 2px;
|
|
background-color: $base-color;
|
|
color:#ffffff;
|
|
text-align:center;
|
|
font-size: 20rpx;
|
|
width:30%;
|
|
}
|
|
.hz-btn-group{
|
|
border-radius: 4px;
|
|
padding: 3px 2px;
|
|
background-color: $font-color-spec;
|
|
color:#ffffff;
|
|
text-align:center;
|
|
font-size: 20rpx;
|
|
width:30%;
|
|
}
|
|
.hz-btn-sharer{
|
|
border-radius: 4px;
|
|
padding: 3px 2px;
|
|
background-color: #4bc397;
|
|
color:#ffffff;
|
|
text-align:center;
|
|
font-size: 20rpx;
|
|
width:30%;
|
|
}
|
|
.hz-btn-sm{
|
|
border-radius: 6rpx;
|
|
padding: 10rpx 20rpx;
|
|
background-color: $base-color;
|
|
color:#ffffff;
|
|
text-align:center;
|
|
font-size: $font-sm;
|
|
}
|
|
.hz-date-title{
|
|
border-radius: 12rpx;
|
|
padding: 10rpx 20rpx;
|
|
background-color: $base-color;
|
|
font-size: $font-lg;
|
|
color:$font-color-white;
|
|
font-weight:bold;
|
|
}
|
|
.hz-date-des {
|
|
font-size: $font-12px;
|
|
color: $font-color-base;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: block;
|
|
}
|
|
.hz-btn{
|
|
background-color: $base-color;
|
|
width:100%;
|
|
margin-top:6px;
|
|
height:44px;
|
|
line-height:44px;
|
|
border-radius:22px;
|
|
}
|
|
.hz-btn-line{
|
|
background-color: #ffffff;
|
|
border:1px solid $base-color;
|
|
width:100%;
|
|
color:$base-color;
|
|
margin-top:6px;
|
|
height:44px;
|
|
line-height:44px;
|
|
border-radius:22px;
|
|
}
|
|
.hz-btn:active{
|
|
background-color: $base-color-active;
|
|
}
|
|
.hz-btn-light{
|
|
background-color: $base-color-light;
|
|
width:100%;
|
|
margin-top:6px;
|
|
height:44px;
|
|
line-height:44px;
|
|
border-radius:22px;
|
|
}
|
|
.hz-btn-danger{
|
|
background-color: $base-color-danger;
|
|
width:100%;
|
|
margin-top:6px;
|
|
height:44px;
|
|
line-height:44px;
|
|
border-radius:22px;
|
|
}
|
|
.hz-circle{
|
|
width: 20px;
|
|
height: 20px;
|
|
background-color: $base-color;
|
|
border-radius: 50%;
|
|
}
|
|
.hz-placeholder{
|
|
color:#666;
|
|
font-size:$font-md;
|
|
}
|
|
.hz-disabled{
|
|
opacity: 0.4;
|
|
background-color: #dddddd;
|
|
}
|
|
.hz-btn-leftRight {
|
|
background-color: #ffffff;
|
|
border-top:1rpx solid #f4f4f4;
|
|
width:100%;
|
|
.hz-btn-left {
|
|
width: 50%;
|
|
text-align: center;
|
|
margin-top:12rpx;
|
|
height:44px;
|
|
line-height:44px;
|
|
border-top-left-radius:22px;
|
|
border-bottom-left-radius:22px;
|
|
}
|
|
.hz-btn-right {
|
|
width: 50%;
|
|
text-align: center;
|
|
margin-top:12rpx;
|
|
height:44px;
|
|
line-height:44px;
|
|
border-top-right-radius:22px;
|
|
border-bottom-right-radius:22px;
|
|
}
|
|
}
|
|
.hz-card-waitlist{
|
|
border-radius: 12px;
|
|
padding:18px;
|
|
background-color:$base-color-notice;
|
|
color:$font-color-black;
|
|
}
|
|
.hz-card-approval{
|
|
border-radius: 12px;
|
|
padding:18px;
|
|
background-color:$base-color-approval;
|
|
color:$font-color-black;
|
|
}
|
|
.book {
|
|
background-color: #ffffff;
|
|
border-top:1rpx solid #f4f4f4;
|
|
width:100%;
|
|
}
|
|
/* textarea */
|
|
.uni-textarea{
|
|
width:100%;
|
|
background:#FFF;
|
|
}
|
|
.uni-textarea textarea{
|
|
width:96%;
|
|
padding:18rpx 2%;
|
|
line-height:1.6;
|
|
font-size:28rpx;
|
|
height:150rpx;
|
|
}
|
|
.scroll-list {
|
|
@include flex(column);
|
|
|
|
&__goods-item {
|
|
margin-right: 20px;
|
|
|
|
&__image {
|
|
width: 60px;
|
|
height: 60px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
&__text {
|
|
color: #f56c6c;
|
|
text-align: center;
|
|
font-size: 12px;
|
|
margin-top: 5px;
|
|
}
|
|
}
|
|
|
|
&__show-more {
|
|
background-color: #fff0f0;
|
|
border-radius: 3px;
|
|
padding: 3px 6px;
|
|
@include flex(column);
|
|
align-items: center;
|
|
|
|
&__text {
|
|
font-size: 12px;
|
|
width: 12px;
|
|
color: #f56c6c;
|
|
line-height: 16px;
|
|
}
|
|
}
|
|
|
|
&__line {
|
|
@include flex;
|
|
margin-top: 10px;
|
|
text-align:center;
|
|
|
|
&__item {
|
|
margin-right: 15px;
|
|
|
|
&__image {
|
|
width: 60px;
|
|
height: 60px;
|
|
}
|
|
|
|
&__text {
|
|
margin-top: 5px;
|
|
color: $u-content-color;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
}
|
|
|
|
&--no-margin-right {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
}
|
|
} |