yijianbao_user_uniapp/assets/css/common.scss

@mixin colBox($isBtw) {
  display: flex;
  flex-direction: column;
  @if $isBtw {
    justify-content: space-between;
  }
}

@mixin centerBox {
  display: flex;
  justify-content: center;
  align-items: center;
}

@mixin vCenterBox {
  display: flex;
  align-items: center;
}

@mixin btwBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@mixin nomalEllipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  white-space: nowrap;
}

@mixin ellipsisWithLine($line) {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: $line;
  overflow: hidden;
  word-break: break-all;
}
// 字体
@for $i from 20 through 100{
    .fs#{$i} {
			font-size: #{$i}rpx;
    }
}
// 颜色
@for $i from 0 through 9{
    .color#{$i} {
			color: #{$i}#{$i}#{$i};
    }
}
// padding
@for $i from 1 through 100{
    .p#{$i} {
			padding: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .ptb#{$i} {
			padding-top: #{$i}rpx ;
			padding-bottom: #{$i}rpx ;
    }
}
@for $i from 1 through 100{
    .plr#{$i} {
			padding-left: #{$i}rpx;
			padding-right: #{$i}rpx;
    }
}
@for $i from 1 through 200{
    .pt#{$i} {
			padding-top: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .pl#{$i} {
			padding-left: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .pr#{$i} {
			padding-right: #{$i}rpx;
    }
}
@for $i from 1 through 200{
    .pb#{$i} {
			padding-bottom: #{$i}rpx;
    }
}
// margin
@for $i from 1 through 100{
    .m#{$i} {
			margin: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mtb#{$i} {
			margin-top: #{$i}rpx ;
			margin-bottom: #{$i}rpx ;
    }
}
@for $i from 1 through 100{
    .mlr#{$i} {
			margin-left: #{$i}rpx;
			margin-right: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mt#{$i} {
			margin-top: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .ml#{$i} {
			margin-left: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mr#{$i} {
			margin-right: #{$i}rpx;
    }
}
@for $i from 1 through 100{
    .mb#{$i} {
			margin-bottom: #{$i}rpx;
    }
}
// 圆角
@for $i from 0 through 100{
    .radius#{$i} {
			border-radius: #{$i}rpx;
    }
}
// padding 左右+width自动计算
@for $i from 10 through 60{
    .w-calc-#{$i} {
			width: calc(100% - #{$i*2}rpx);
			padding-left:  #{$i}rpx;
			padding-right:  #{$i}rpx;
    }
}

// gap
@for $i from 1 through 100{
	.gap#{$i} {
		gap: #{$i}rpx;
	}
}

// 高
@for $i from 1 through 900{
	.h#{$i} {
		height: #{$i}rpx;
	}
}
// 宽
@for $i from 1 through 900{
	.w#{$i} {
		width: #{$i}rpx;
	}
}
// 宽
@for $i from 1 through 900{
	.lh#{$i} {
		line-height: #{$i}rpx;
	}
}


// font-weight
$steps: 100 200 300 400 500 600 700 800 bold;
@each $i in $steps {
	.weight-#{$i} {
		font-weight: $i;
	}
}

.bold {
	font-weight: bold;
}
.scrollx {
	overflow-x: scroll;
}

.scrolly {
	overflow-y: scroll;
}
.color9{
	color: #999;
}
.color6{
	color: #666;
}
.bgf{
	background-color: #fff;
}
.base-color{
	color: #018C39;
}
.colorf {
			color: #fff;
		}
	
		.bgf {
			background: #fff;
		}
	
		.fixed {
			position: fixed;
		}
	
		.absolute {
			position: absolute;
		}
	
		.relative {
			position: relative;
		}
	
		.w100 {
			width: 100%;
		}
	
		.h100 {
			height: 100%;
		}
	
		.card {
			background: #fff;
			border-radius: 15rpx;
		}
	
		.cover-height {
			height: 100%;
			display: flex;
			flex-direction: column;
			box-sizing: border-box;
		}
	
		.row {
			display: flex;
			flex-direction: row;
		}
	
		.column {
			display: flex;
			flex-direction: column;
		}
	
		.justify-start {
			display: flex;
			justify-content: flex-start;
		}
	
		.justify-center {
			display: flex;
			justify-content: center;
		}
	
		.justify-end {
			display: flex;
			justify-content: flex-end;
		}
	
		.justify-around {
			display: flex;
			justify-content: space-around;
		}
		.justify-evenly {
			display: flex;
			justify-content: space-evenly;
		}
	
		.justify-between {
			display: flex;
			justify-content: space-between;
		}
	
		.align-start {
			display: flex;
			align-items: flex-start;
		}
	
		.align-center {
			display: flex;
			align-items: center;
		}
	
		.align-end {
			display: flex;
			align-items: flex-end;
		}
	
		.center {
			display: flex;
			justify-content: center;
			align-items: center;
		}
	
		.centerV {
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
		}
	
		.wrap {
			flex-wrap: wrap;
		}
	
		.flex-1 {
			flex: 1;
		}
	
		.ellipsis {
			overflow: hidden;
			text-overflow: ellipsis;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			box-sizing: border-box;
			width: 100%;
			-webkit-line-clamp: 1;
		}
	
		.lines-2 {
			-webkit-line-clamp: 2 !important;
		}
	
		.lines-3 {
			-webkit-line-clamp: 3 !important;
		}
	
		.bold {
			font-weight: bold;
		}
	
		.line-through {
			text-decoration: line-through;
		}
	
		.nowrap {
			white-space: nowrap;
		}
	
		.scrollx {
			overflow-x: scroll;
		}
	
		.scrolly {
			overflow-y: scroll;
		}
	
		.cvauto {
			content-visibility: auto;
		}