482 lines
5.4 KiB
CSS
482 lines
5.4 KiB
CSS
/* 安全区域距离顶部边界距离 */
|
|
|
|
.safe-area-inset-top {
|
|
padding-top: 0 !important;
|
|
padding-top: constant(safe-area-inset-top) !important;
|
|
padding-top: env(safe-area-inset-top) !important;
|
|
}
|
|
|
|
.safe-area-inset-bottom {
|
|
padding-bottom: 0 !important;
|
|
padding-bottom: constant(safe-area-inset-bottom) !important;
|
|
padding-bottom: env(safe-area-inset-bottom) !important;
|
|
}
|
|
|
|
.flex-con {
|
|
flex: 1;
|
|
}
|
|
|
|
.main-c {
|
|
color: #0D111A !important
|
|
}
|
|
|
|
.light-c {
|
|
color: #1E293B !important
|
|
}
|
|
|
|
.content-c {
|
|
color: #31353D !important
|
|
}
|
|
|
|
.tips-c {
|
|
color: #6C7380 !important
|
|
}
|
|
|
|
.error-c {
|
|
color: #F44336 !important
|
|
}
|
|
|
|
.primary-c {
|
|
color: #2979FF !important
|
|
}
|
|
|
|
.w-c {
|
|
color: white !important
|
|
}
|
|
|
|
.fs-2 {
|
|
font-size: 20rpx !important
|
|
}
|
|
|
|
.fs-24 {
|
|
font-size: 24rpx !important
|
|
}
|
|
|
|
.fs-28 {
|
|
font-size: 28rpx !important
|
|
}
|
|
|
|
.fs-3 {
|
|
font-size: 30rpx !important
|
|
}
|
|
|
|
.fs-32 {
|
|
font-size: 32rpx !important
|
|
}
|
|
|
|
.fs-36 {
|
|
font-size: 36rpx !important
|
|
}
|
|
|
|
.fs-4 {
|
|
font-size: 40rpx !important
|
|
}
|
|
|
|
.fs-44 {
|
|
font-size: 44rpx !important
|
|
}
|
|
|
|
.fs-48 {
|
|
font-size: 48rpx !important
|
|
}
|
|
|
|
.ff_pfsc {
|
|
font-family: 'PingFang SC' !important;
|
|
}
|
|
|
|
.fw-700 {
|
|
font-weight: 700;
|
|
}
|
|
|
|
.flex {
|
|
display: flex;
|
|
}
|
|
|
|
|
|
/* 竖直排列 */
|
|
|
|
.flex-col {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
|
|
/* 水平排列 */
|
|
|
|
.flex-row {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.flex-nowrap {
|
|
flex-wrap: nowrap;
|
|
}
|
|
|
|
.flex-wrap {
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.flex-1 {
|
|
flex: 1;
|
|
}
|
|
|
|
.flex-jus-center {
|
|
justify-content: center;
|
|
}
|
|
|
|
.flex-jus-sp {
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.flex-jus-sa {
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.flex-jus-se {
|
|
justify-content: space-evenly;
|
|
}
|
|
|
|
.flex-jus-start {
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.flex-jus-end {
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.flex-ali-center {
|
|
align-items: center;
|
|
}
|
|
|
|
.flex-ali-end {
|
|
align-items: flex-end;
|
|
}
|
|
|
|
.flex-ali-start {
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.flex-ali-baseline {
|
|
align-items: baseline;
|
|
}
|
|
|
|
.grid-tem-col-2 {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
}
|
|
|
|
.grid-tem-col-3 {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
}
|
|
|
|
.vain-btn {
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
border: none !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
.vain-btn::after {
|
|
border: none !important;
|
|
}
|
|
|
|
.m-l-1 {
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
.m-l-12 {
|
|
margin-left: 12rpx;
|
|
}
|
|
|
|
.m-r-16 {
|
|
margin-right: 16rpx;
|
|
}
|
|
|
|
.m-l-16 {
|
|
margin-left: 16rpx;
|
|
}
|
|
|
|
.m-l-2 {
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
.m-r-2 {
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.m-r08 {
|
|
margin-right: 8rpx;
|
|
}
|
|
|
|
.m-l-24 {
|
|
margin-left: 24upx;
|
|
}
|
|
|
|
.m-l-32 {
|
|
margin-left: 32rpx;
|
|
}
|
|
|
|
.m-l-4 {
|
|
margin-left: 40rpx;
|
|
}
|
|
|
|
.m-l-48 {
|
|
margin-left: 48rpx;
|
|
}
|
|
|
|
.m-b-16 {
|
|
margin-bottom: 16rpx;
|
|
}
|
|
|
|
.m-b-2 {
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.m-b-32 {
|
|
margin-bottom: 32rpx;
|
|
}
|
|
|
|
.m-b-48 {
|
|
margin-bottom: 48rpx;
|
|
}
|
|
|
|
.m-l-8 {
|
|
margin-left: 80rpx;
|
|
}
|
|
|
|
.m-t08 {
|
|
margin-top: 8rpx;
|
|
}
|
|
|
|
.p-col-08 {
|
|
padding: 8rpx 0;
|
|
}
|
|
|
|
.m-t-1 {
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.m-t-12 {
|
|
margin-top: 12rpx;
|
|
}
|
|
|
|
.m-t-16 {
|
|
margin-top: 16rpx;
|
|
}
|
|
|
|
.m-t-2 {
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.m-t-3 {
|
|
margin-top: 30rpx;
|
|
}
|
|
|
|
.m-t-32 {
|
|
margin-top: 30rpx;
|
|
}
|
|
|
|
.m-t-50 {
|
|
margin-top: 50rpx;
|
|
}
|
|
|
|
.m-t-4 {
|
|
margin-top: 40rpx;
|
|
}
|
|
|
|
.m-t-48 {
|
|
margin-top: 48rpx;
|
|
}
|
|
|
|
.m-t-8 {
|
|
margin-top: 80rpx;
|
|
}
|
|
|
|
.m-t-32 {
|
|
margin-top: 32rpx;
|
|
}
|
|
|
|
.m-t-24 {
|
|
margin-top: 24rpx;
|
|
}
|
|
|
|
.p-col-32 {
|
|
padding: 32rpx 0;
|
|
}
|
|
|
|
.p-col-12 {
|
|
padding: 12rpx 0;
|
|
}
|
|
|
|
.p-col-16 {
|
|
padding: 16rpx 0;
|
|
}
|
|
|
|
.p-col-2 {
|
|
padding: 20rpx 0;
|
|
}
|
|
|
|
.p-row-16 {
|
|
padding: 0 16rpx;
|
|
}
|
|
|
|
.p-16 {
|
|
padding: 16rpx;
|
|
}
|
|
|
|
.p-row-32 {
|
|
padding: 0 32rpx;
|
|
}
|
|
|
|
.p-row-48 {
|
|
padding: 0 48rpx;
|
|
}
|
|
|
|
.p-row-52 {
|
|
padding: 0 52rpx;
|
|
}
|
|
|
|
.p-t-32 {
|
|
padding-top: 32rpx;
|
|
}
|
|
|
|
.p-32 {
|
|
padding: 32rpx;
|
|
}
|
|
|
|
.p-t-0 {
|
|
padding-top: 0;
|
|
}
|
|
|
|
.p-2 {
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.p-col-4 {
|
|
padding: 40rpx 0;
|
|
}
|
|
|
|
.white {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.bg {
|
|
background-color: #F9FAFB;
|
|
}
|
|
|
|
.p-row-2 {
|
|
padding: 0 20rpx;
|
|
}
|
|
|
|
.full-width {
|
|
width: 100% !important;
|
|
}
|
|
|
|
.b-r-8 {
|
|
border-radius: 8rpx;
|
|
}
|
|
|
|
.b-r-16 {
|
|
border-radius: 16rpx;
|
|
}
|
|
|
|
.full-height {
|
|
height: 100% !important;
|
|
}
|
|
|
|
.seperator {
|
|
width: 1px;
|
|
background-color: #F7F6F6;
|
|
}
|
|
|
|
.seperator-h {
|
|
width: 100%;
|
|
height: 1px;
|
|
background-color: #F7F6F6;
|
|
}
|
|
|
|
.bottom-border {
|
|
border-bottom: 1px solid #F7F8FA;
|
|
}
|
|
|
|
.bottom-col-border {
|
|
border-top: 1px solid #000;
|
|
border-bottom: 1px solid #000;
|
|
}
|
|
|
|
.b-r-half {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
|
|
/* 字体超出一行显示省略号 ,宽度自行设置,不支持多行*/
|
|
|
|
.text-hide {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.text-cut {
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.text-twoline {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 2;
|
|
}
|
|
|
|
.btn-none {
|
|
padding: 0 !important;
|
|
border: none !important;
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
.btn-none::after {
|
|
border: none !important;
|
|
}
|
|
|
|
.size-32 {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
}
|
|
|
|
.text-align-justify {
|
|
text-align-last: justify !important;
|
|
-ms-text-align-last: justify !important;
|
|
-moz-text-align-last: justify !important
|
|
}
|
|
|
|
.text-align-start {
|
|
text-align-last: start !important;
|
|
-ms-text-align-last: start !important;
|
|
-moz-text-align-last: start !important
|
|
}
|
|
|
|
.text-align-end {
|
|
text-align-last: end !important;
|
|
-ms-text-align-last: end !important;
|
|
-moz-text-align-last: end !important;
|
|
}
|
|
|
|
.text-align-cen {
|
|
text-align: center !important;
|
|
}
|
|
|
|
.box-border {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.box-content {
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
.min-w-140 {
|
|
min-width: 140rpx;
|
|
} |