// @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;
}
.yl-page {
	padding-right: 24rpx;
	padding-left: 24rpx;
	height: 100%;
	background-color: $yl-bg-color;
	overflow-y: auto;
}
// 宽高占满盒子
.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;
}
