cargo-ant/src/styles/common.less

A high quality UI components Library with Vue.js

// 文本对齐
.tar{text-align: right}
.tac{text-align: center;}
.tal{text-align: left;}

//垂直对齐
.vam{vertical-align: middle;}
.vat{vertical-align: top;}
.vab{vertical-align: bottom;}

// 文字大小
.fs12{font-size: 12px}
.fs14{font-size: 14px}
.fs16{font-size: 16px}
.fs18{font-size: 18px}
.fs24{font-size: 24px}

//文字粗细
.fwb{font-weight:bold;}
.fwn{font-weight:normal;}

.dpb{display: block;  }
.dpt{display: table;  }
.dpib{display:inline-block;}
.dpit{display:inline-table;}

// 颜色
.color-gray{color: @gray-color}
.color-primary{color: @primary-color}
.color-warning{color:@warning-color}
.color-success{color:@success-color}
.color-error{color:@error-color}
.color-info{color:@info-color}

// 背景色
.bg-white{  background-color: #fff;}
.bg-gray{  background-color: @background-color-base;}

// 鼠标样式
.cur-p{cursor: pointer}
.cur-d{cursor: default}

//line height
.lh-s{  line-height:1.2;}
.lh-n{  line-height:1.5;}
.lh-l{  line-height:1.8;}

//间距
.mt2{margin-top:2px;}
.mt4{margin-top:4px;}
.mt6{margin-top:6px;}
.mt8{margin-top:8px;}
.mt12{margin-top:12px;}
.mt16{margin-top:16px;}
.mt32{margin-top:32px;}
.mt48{margin-top:48px;}

.mb2{margin-bottom: 2px;}
.mb4{margin-bottom: 4px;}
.mb8{margin-bottom: 8px;}
.mb16{margin-bottom: 16px;}
.mb32{margin-bottom: 32px;}
.mb48{margin-bottom: 48px;}

.mr4{margin-right:4px;}
.mr6{margin-right:6px;}
.mr8{margin-right:8px;}
.mr16{margin-right:16px;}
.mr32{margin-right:32px;}
.mr48{margin-right:48px;}

.ml4{margin-left:4px;}
.ml6{margin-left:6px;}
.ml8{margin-left:8px;}
.ml16{margin-left:16px;}
.ml32{margin-left:32px;}
.ml48{margin-left:48px;}

.pt0{padding-top:0;}
.pt4{padding-top:4px;}
.pt8{padding-top:8px;}
.pt16{padding-top:16px;}
.pb0{padding-bottom:0;}

.pl4{padding-left:4px;}
.pl6{padding-left:6px;}
.pl8{padding-left:8px;}
.pl16{padding-left:16px;}

.pr4{padding-right:4px;}
.pr6{padding-right:6px;}
.pr8{padding-right:8px;}
.pr16{padding-right:16px;}
.pb4{padding-bottom:4px;}
.pb8{padding-bottom:8px;}

.pd-small{padding:4px}
.pd-default{padding:8px}
.pd-large{padding:16px}

//width
.w100p{width:100%;}
.w50p{width:50%;}
.w48{width: 48px}
.w56{width: 56px}
.w80{width: 80px}
.w100{width: 100px}

// float
.fr{float:right}
.fl{float:left}

// position
.psa{position: absolute}
.psr{position: relative}
.pss{position: static}

//
.uppercase{text-transform:uppercase}
.lowercase{text-transform:lowercase }

// 超出显示 点点点
.toe{
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}

// overflow
.ofa{overflow: auto}
.ofs{overflow: scroll}
.ofv{overflow: visible}
.ofh{overflow: hidden}
.ofa-y{overflow-y: auto}
.ofa-x{overflow-x: auto}

// display
.none{display: none;}
.hidden{visibility: hidden}
.cursor{cursor:pointer}