mirror of https://github.com/ElemeFE/element
100 lines
2.3 KiB
SCSS
100 lines
2.3 KiB
SCSS
@import "./common/var.scss";
|
|
|
|
.el-col-1, .el-col-2, .el-col-3, .el-col-4, .el-col-5, .el-col-6, .el-col-7, .el-col-8, .el-col-9, .el-col-10, .el-col-11, .el-col-12, .el-col-13, .el-col-14, .el-col-15, .el-col-16, .el-col-17, .el-col-18, .el-col-19, .el-col-20, .el-col-21, .el-col-22, .el-col-23, .el-col-24 {
|
|
float: left;
|
|
box-sizing: border-box;
|
|
}
|
|
.el-col-0 {
|
|
width: 0;
|
|
}
|
|
|
|
@for $i from 0 through 24 {
|
|
.el-col-#{$i} {
|
|
width: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-offset-#{$i} {
|
|
margin-left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-pull-#{$i} {
|
|
position: relative;
|
|
right: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-push-#{$i} {
|
|
position: relative;
|
|
left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
@for $i from 0 through 24 {
|
|
.el-col-xs-#{$i} {
|
|
width: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-xs-offset-#{$i} {
|
|
margin-left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-xs-pull-#{$i} {
|
|
position: relative;
|
|
right: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-xs-push-#{$i} {
|
|
position: relative;
|
|
left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
@for $i from 0 through 24 {
|
|
.el-col-sm-#{$i} {
|
|
width: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-sm-offset-#{$i} {
|
|
margin-left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-sm-pull-#{$i} {
|
|
position: relative;
|
|
right: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-sm-push-#{$i} {
|
|
position: relative;
|
|
left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
}
|
|
}
|
|
@media (min-width: 992px) {
|
|
@for $i from 0 through 24 {
|
|
.el-col-md-#{$i} {
|
|
width: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-md-offset-#{$i} {
|
|
margin-left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-md-pull-#{$i} {
|
|
position: relative;
|
|
right: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-md-push-#{$i} {
|
|
position: relative;
|
|
left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
}
|
|
}
|
|
@media (min-width: 1200px) {
|
|
@for $i from 0 through 24 {
|
|
.el-col-lg-#{$i} {
|
|
width: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-lg-offset-#{$i} {
|
|
margin-left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-lg-pull-#{$i} {
|
|
position: relative;
|
|
right: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
.el-col-lg-push-#{$i} {
|
|
position: relative;
|
|
left: (1 / 24 * $i * 100) * 1%;
|
|
}
|
|
}
|
|
} |