zhibo/assets/css/common.less

 
page {
  background: #f5f5f5;
  height: 100%;
}
.container{
  height: 100%;
}
rich-text {
  width: 100%;
  display: block;
  img,
  image {
    display: block;
    width: 100%;
  }
}

/*单行文本溢出省略号*/
.one-t {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: all linear 0.2s;
}

/*多行文本溢出省略号*/
.more-t {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  transition: all linear 0.2s;
}

/* ==================
          flex布局(colorui里面也有相关基础样式)
 ==================== */
/* x水平排列*/
.x-f {
  display: flex;
  align-items: center;
}

/*x两端且水平居中*/
.x-bc {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/*x平分且水平居中*/
.x-ac {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

/*x水平靠上对齐*/
.x-start {
  display: flex;
  align-items: flex-start;
}

/*x水平靠下对齐*/
.x-end {
  display: flex;
  align-items: flex-end;
}

/*上下左右居中*/
.x-c {
  display: flex;
  justify-content: center;
  align-items: center;
}

/*y竖直靠左*/
.y-start {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/*y竖直靠右*/
.y-end {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

/*y竖直居中*/
.y-f {
  display: flex;
  flex-direction: column;
  align-items: center;
}

// y竖直两端
.y-b {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/*y竖直两端居中*/
.y-bc {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
/* layout */
.acea-row {
  display: flex;
  flex-wrap: wrap;
  /* 辅助类 */
}
.acea-row.row-middle {
  align-items: center;
}
.acea-row.row-top {
  align-items: flex-start;
}
.acea-row.row-bottom {
  align-items: flex-end;
}
.acea-row.row-center {
  justify-content: center;
}
.acea-row.row-right {
  justify-content: flex-end;
}
.acea-row.row-left {
  justify-content: flex-start;
}
.acea-row.row-between {
  justify-content: space-between;
}
.acea-row.row-around {
  justify-content: space-around;
}
.acea-row.row-column-around {
  flex-direction: column;
  justify-content: space-around;
}
.acea-row.row-column {
  flex-direction: column;
}
.acea-row.row-column-between {
  flex-direction: column;
  justify-content: space-between;
}
/* 上下左右垂直居中 */
.acea-row.row-center-wrapper {
  align-items: center;
  justify-content: center;
}
/* 上下两边居中对齐 */
.acea-row.row-between-wrapper {
  align-items: center;
  justify-content: space-between;
}

/*每个页面公共css */
.ellipsis{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ellipsis2{
	overflow:hidden; 
	text-overflow:ellipsis;
	display:-webkit-box; 
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2; 
}
radio .wx-radio-input{
  width: 36rpx;
  height: 36rpx;
  border: 1px solid #CCCCCC;
}
/* 选中后的 背景样式  */
radio .wx-radio-input.wx-radio-input-checked{
	background: linear-gradient(135deg, #2BC7B9 0%, #60CDC3 100%);
	border: 1px solid #2BC7B9;
}
/* 选中后的 对勾样式 （白色对勾） */
radio .wx-radio-input.wx-radio-input-checked::before{
	color: #ffffff;
}
checkbox .wx-checkbox-input{
	width: 36rpx;
	height: 36rpx;
	border: 1px solid #CCCCCC;
	border-radius: 50%;
}
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
	background: linear-gradient(135deg, #2BC7B9 0%, #60CDC3 100%);
	border: 1px solid #2BC7B9;
	border-radius: 50%;
}
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
	color: #ffffff;
}
::-webkit-scrollbar {
   width: 0;
   height: 0;
   color: transparent;
 }
 /* 暂无数据 */
.no-data-box{
	padding: 100upx 50upx;
	text-align: center;
	image{
		width: 372rpx;
		height: 240rpx;
	}
	.empty-title{
		margin-top: 20rpx;
		font-size: 32rpx;
		color: #bbbbbb;
		 
	}
}
.Loads {
  height: 0.8*100rpx;
  font-size: 0.25*100rpx;
  color: #000;
}
.Loads .iconfont {
  font-size: 0.3*100rpx;
  margin-right: 0.1*100rpx;
  height: 0.32*100rpx;
  line-height: 0.32*100rpx;
}
/*加载动画*/
@keyframes load {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.loadingpic {
  animation: load 3s linear 1s infinite;
}
.loading {
  animation: load linear 1s infinite;
}

 .back-box{
	position: relative;
	.title{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
	}
}