beefast-mini-deliveryman/app.wxss
2025-02-20 01:42:47 +08:00

350 lines
6.8 KiB
Plaintext

page{
font-size:32rpx;
line-height: 1;
--main-font-color:#222222;
--main-bgclolor:#F5F5F5;
--main-color:#FFC300;
--main-hover-color:#fcce39;
color:var(--main-font-color);
background-color:var(--main-bgclolor);
overflow: hidden;
}
button{
border-radius: 12rpx;
box-sizing: border-box;
}
button label{
display: inline-block;
margin-left: 10rpx;
}
button .icon,button label{
vertical-align: middle;
}
button:not([size=mini]){
width:auto;
/* height: 108rpx; */
padding:30rpx 25rpx;
font-size: 36rpx;
}
button:not([size=mini]) .icon{
width:32rpx;height:32rpx;
}
button[type=primary]{
background-color:var(--main-color);
color:#222222;
}
button[plain]{
border: 1rpx solid rgba(255, 195, 0, 0.5);
color: #FFC300;
}
button:not([plain]):not([disabled])[type=primary]:hover{
background-color:var(--main-hover-color);
}
button[type=default]{
color: #333333;
font-size:32rpx;
line-height: 1;
}
button[type=primary][plain]{
border-color: var(--main-color);
color:var(--main-color);
padding:28rpx 25rpx;
}
button[type=primary][plain]:hover{
border-color:var(--main-color);
color:var(--main-color);
}
button[loading][type=primary] {
background-color:var(--main-color);
color: hsla(0,0%,100%,.6);
}
radio-group{
line-height: 34rpx;
}
radio-group radio{
display: inline-block;
vertical-align: middle;
overflow: hidden;
}
radio-group label{
display: inline-block;
vertical-align: middle;
}
radio-group radio+label{
margin-left:10rpx;
}
radio-group label+label{
margin-left:20rpx;
}
radio{
width: 34rpx;
height: 34rpx;
position: relative;
}
radio .wx-radio-input{
border-radius: 50%;
border-color:var(--main-color);
box-sizing: border-box;
width: 100%;
height: 100%;
line-height: 20px;
position: absolute;
top: 0;left:0;
}
radio .wx-radio-input.wx-radio-input-checked{
background-color:transparent;
border-color: var(--main-color);
}
radio .wx-radio-input.wx-radio-input-checked::before{
content: '';
position: absolute;
width: 22rpx;
height:22rpx;
left:4rpx;top:4rpx;
border-radius: 50%;
background: var(--main-color);
transform: none;
-webkit-transform:none
}
checkbox .wx-checkbox-input{
width: 40rpx;
height: 40rpx;
border-radius: 50%;
}
page-container .content{
border-radius: 24rpx 24rpx 0 0;
background-color: #F5F5F5;
min-height: 200rpx;
/* padding:20rpx; */
}
.page-container{
background-color: #fff;
border-radius: 20rpx;
padding:40rpx 30rpx;
margin:20rpx;
}
.page-container.shadow{
box-shadow: 0px 6px 6px 1px rgba(0, 0, 0, 0.05);
}
.tags{
display: flex;
gap: 10rpx;
}
.tags .tag{
font-size:20rpx;
padding:6rpx 10rpx;
color: #888888;
border: 0.5px solid rgba(153, 153, 153, 0.5);
border-radius: 6rpx;
}
.tags .tag.yellow{
color: #FFC300;
border-color:#FFC300;
}
.spliter{
border-bottom: 1px solid rgba(153, 153, 153, 0.2);
}
.spliter.dashed{
border-bottom: 1px dashed rgba(153, 153, 153, 0.2);
}
.money,.money-promation,.money-normal,.money-disable{
font-size: 36rpx;
font-weight: 500;
}
.money::before,.money-promation::before,.money-normal::before,.money-disable::before{
content: "¥ ";
font-size: 80%;
}
.money{
color:#EB0000;
}
.money-promation{
color:#FF8400;
}
.money-yellow{
color:var(--main-color);
}
.money-blue{
color:#1A4DEB;
}
.money-promation::before{
content: "-¥ ";
}
.money-normal{
color:unset;
}
.money-disable{
color:#888888;
text-decoration: line-through;
font-size: 28rpx;
font-weight:normal;
}
.bottom-bar{
border-radius: 24rpx 24rpx 0 0;
padding:34rpx 40rpx;
position:fixed;
bottom:0;
left:0;right:0;
background-color: #fff;
}
.custom-scroll-view{
height:100vh;
display: flex;
flex-direction: column;
}
.custom-scroll-view .main{
flex:1;
overflow: auto;
}
.bottom-bar-v2{
border-radius: 24rpx 24rpx 0 0;
padding:34rpx 40rpx;
background-color: #fff;
text-align: right;
}
.cells{
margin:20rpx;
border-radius: 24rpx;
background-color: #fff;
overflow: hidden;
}
.cells .cell{
display: flex;
align-items: center;
padding:0 40rpx;
font-size: 30rpx;
position: relative;
}
.cells .cell.cell-active{
background-color:rgba(0,0,0,.1);
}
.cells .cell::after{
content: '';
border-bottom: 1rpx solid rgba(153, 153, 153, 0.2);
position: absolute;
bottom:0;
left:40rpx;
right:40rpx;
}
.cells .cell:last-child::after{
border:0;
}
.cells .cell-hd{
margin-right:20rpx;
}
.cells .cell-hd .icon{
width:40rpx;height:40rpx;
vertical-align: middle;
}
.cells .cell-bd{
flex:1;
display: flex;
align-items: center;
position:relative;
min-height: 116rpx;
}
.cells .cell-bd .error{
color:red;
position: absolute;
left:0;bottom:10rpx;
font-size: 24rpx;
}
.cells .cell-bd input{
height:100rpx;
}
.cells .cell-ft{
position: relative;
color:#999;
}
.cells.cells-access .cell-ft{
padding-right: 40rpx;
}
.cells.cells-access .cell-ft::after{
content:" ";
width:24rpx;height:48rpx;
-webkit-mask-position:0 0;
mask-position:0 0;
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:100%;
mask-size:100%;
background-color:currentColor;
color:var(--weui-FG-2);
-webkit-mask-image:url(data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.454%206.58l1.06-1.06%205.78%205.779a.996.996%200%20010%201.413l-5.78%205.779-1.06-1.061%205.425-5.425-5.425-5.424z%22%20fill%3D%22%23B2B2B2%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E);mask-image:url(data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.454%206.58l1.06-1.06%205.78%205.779a.996.996%200%20010%201.413l-5.78%205.779-1.06-1.061%205.425-5.425-5.425-5.424z%22%20fill%3D%22%23B2B2B2%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E);position:absolute;top:50%;right:0;margin-top:-24rpx
}
.tab-bar{
display: flex;
justify-content: space-between;
background-color: #fff;
font-size: 34rpx;
}
.tab-bar .item-container{
flex:1;
text-align: center;
}
.tab-bar .item{
position: relative;
padding:40rpx 0;
color: #555555;
transition-duration: .4s;
display: inline-block;
}
.tab-bar .item::before{
opacity: 0;
content: "";
height:8rpx;
width:100%;
position: absolute;
bottom:0;
background-color:var(--main-color);
transition-duration: .4s;
}
.tab-bar .current .item{
color: var(--main-font-color);
font-weight: 500;
}
.tab-bar .current .item::before{
opacity: 1;
}
navigator button{
vertical-align: middle;
}
.navigator-hover{
background-color: transparent;
opacity: 1;
}
.list-empty{
text-align: center;
}
.list-empty .icon{
width:160rpx;height:160rpx;
margin-top:360rpx;
}
.list-empty .title{
font-size: 30rpx;
font-weight: 500;
color:rgba(124, 134, 149, 0.6);
}
.scroll-view-dispatch{
height:100rpx;
}
.page-dispatch{
height:40rpx;
}