// @import './button.scss';
@import './var.scss';
@import './each.scss';
@import './color.scss';

/* 文字排版 */
.text-left {
	text-align: left;
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.text-justify {
	text-align: justify;
}
.text-last-justify {
	text-align-last: justify;
}
/* 边框 */
.border-top {
	border-top: solid 2rpx $yl-border-color;
}
.border-bottom {
	border-bottom: solid 2rpx $yl-border-color;
}
.border-left {
	border-left: solid 2rpx $yl-border-color;
}
.border-right {
	border-right: solid 2rpx $yl-border-color;
}
.border {
	border: solid 2rpx $yl-border-color;
}

.border-top-primary {
	border-top: solid 2rpx $yl-color-primary;
}
.border-top-primary-dark {
	border-top: solid 2rpx $yl-color-primary-dark;
}
.border-top-primary-light {
	border-top: solid 2rpx $yl-color-primary-light;
}

/* 字体粗细 */
.font-weight-bold {
	font-weight: $yl-font-weight-bold;
}
.font-weight-primary {
	font-weight: $yl-font-weight-primary;
}
.font-weight-light {
	font-weight: $yl-font-weight-secondary;
}

/* 边框圆角 */
.border-radius-base {
	border-radius: $yl-border-radius-base;
}
.border-radius-small {
	border-radius: $yl-border-radius-small;
}
.border-radius-circle {
	border-radius: $yl-border-radius-circle;
}
.border-radius-zero {
	border-radius: $yl-border-radius-zero;
}

/* 内容区域 */
.yl-container {
	padding-right: 24rpx;
	padding-left: 24rpx;
}
// 宽高占满盒子
.fill-width {
	width: 100%;
}
.fill-height {
	height: 100%;
}

// iphoneX以上底部有黑线操作栏的安全高度
.bottom-safe-area {
	padding-bottom: $bottomSafeArea;
}
// 内容高度为100%
uni-page-body {
	height: 100%;
}
// 隐藏scroll-view的滚动条
::-webkit-scrollbar {
	display: none;
	width: 0 !important;
	height: 0 !important;
	-webkit-appearance: none;
	background: transparent;
}
// 激活状态
.yl-hover-class {
	opacity: 0.7;
}

/* flex 布局 */
.flex {
	/* #ifndef APP-PLUS-NVUE */
	display: flex;
	/* #endif */
}
@for $i from 1 through 5 {
	.flex-#{$i} {
		flex: #{$i};
	}
}

// 超出行数，自动显示行尾省略号，最多10行
@for $i from 1 through 10 {
	.yl-line-#{$i} {
		// vue下，单行和多行显示省略号需要单独处理
		@if $i == 1 {
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		} @else {
			display: -webkit-box !important;
			overflow: hidden;
			text-overflow: ellipsis;
			word-break: break-all;
			-webkit-line-clamp: $i;
			-webkit-box-orient: vertical !important;
		}
	}
}

/* 定位 */
.position-relative {
	position: relative;
}
.position-absolute {
	position: absolute;
}
.position-fixed {
	position: fixed;
}
/* 定位 - 固定顶部 */
.fixed-top {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	/* 设置太高会影响其他显示 默认即可*/
	// z-index: 1030;
}
/* 定位 - 固定底部 */
.fixed-bottom {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	// z-index: 1030;
}
.top-0 {
	top: 0;
}
.left-0 {
	left: 0;
}
.right-0 {
	right: 0;
}
.bottom-0 {
	bottom: 0;
}

//字体
.yl-font-h1 {
	font-size: $yl-font-h1;
}
.yl-font-h2 {
	font-size: $yl-font-h2;
}
.yl-font-h3 {
	font-size: $yl-font-h3;
}
.yl-font-h4 {
	font-size: $yl-font-h4;
}
.yl-font-h5 {
	font-size: $yl-font-h5;
}
.yl-font-content {
	font-size: $yl-font-content;
}
.yl-font-middle-content {
	font-size: $yl-font-middle-content;
}
.yl-font-small {
	font-size: $yl-font-small;
}
.yl-font-mini {
	font-size: $yl-font-mini;
}
.overflow-hidden {
	overflow: hidden;
}
.yl-page {
	height: 100vh;
}
.font-weight-500 {
	font-weight: 500;
}
.font-weight-600 {
	font-weight: 600;
}
.font-weight-700 {
	font-weight: 700;
}
.font-weight-800 {
	font-weight: 800;
}
.font-weight-900 {
	font-weight: 900;
}
.font-22 {
	font-size: 22rpx;
}
.border-radius-24{
	border-radius: 24rpx;
}
image  {
   width: 100%;
   height: 100%;
   display: block;
}