You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
1.5 KiB
103 lines
1.5 KiB
9 years ago
|
@import "../../style/themes/default";
|
||
|
@import "../../style/mixins/index";
|
||
|
@import "./mixin";
|
||
|
|
||
10 years ago
|
// Grid system
|
||
|
.row {
|
||
|
.make-row();
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.row-flex {
|
||
|
display: flex;
|
||
|
flex-direction: row;
|
||
|
flex-wrap: wrap;
|
||
|
|
||
|
&:before,
|
||
|
&:after {
|
||
|
display: flex;
|
||
|
}
|
||
|
}
|
||
|
|
||
10 years ago
|
// x轴原点
|
||
10 years ago
|
.row-flex-start {
|
||
10 years ago
|
justify-content: flex-start;
|
||
|
}
|
||
|
|
||
|
// x轴居中
|
||
10 years ago
|
.row-flex-center {
|
||
10 years ago
|
justify-content: center;
|
||
|
}
|
||
|
|
||
|
// x轴反方向
|
||
10 years ago
|
.row-flex-end {
|
||
10 years ago
|
justify-content: flex-end;
|
||
|
}
|
||
|
|
||
|
// x轴平分
|
||
10 years ago
|
.row-flex-space-between {
|
||
10 years ago
|
justify-content: space-between;
|
||
|
}
|
||
|
|
||
|
// x轴有间隔地平分
|
||
10 years ago
|
.row-flex-space-around {
|
||
10 years ago
|
justify-content: space-around;
|
||
|
}
|
||
|
|
||
|
// 顶部对齐
|
||
10 years ago
|
.row-flex-top {
|
||
10 years ago
|
align-items: flex-start;
|
||
|
}
|
||
|
|
||
|
// 居中对齐
|
||
10 years ago
|
.row-flex-middle {
|
||
9 years ago
|
align-items: center;
|
||
10 years ago
|
}
|
||
|
|
||
|
// 底部对齐
|
||
10 years ago
|
.row-flex-bottom {
|
||
9 years ago
|
align-items: flex-end;
|
||
10 years ago
|
}
|
||
|
|
||
|
.col {
|
||
|
position: relative;
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
10 years ago
|
.make-grid-columns();
|
||
|
.make-grid();
|
||
9 years ago
|
|
||
|
// Extra small grid
|
||
|
//
|
||
|
// Columns, offsets, pushes, and pulls for extra small devices like
|
||
|
// smartphones.
|
||
|
|
||
|
.make-grid(-xs);
|
||
|
|
||
|
// Small grid
|
||
|
//
|
||
|
// Columns, offsets, pushes, and pulls for the small device range, from phones
|
||
|
// to tablets.
|
||
|
|
||
|
@media (min-width: @screen-sm-min) {
|
||
|
.make-grid(-sm);
|
||
|
}
|
||
|
|
||
|
|
||
|
// Medium grid
|
||
|
//
|
||
|
// Columns, offsets, pushes, and pulls for the desktop device range.
|
||
|
|
||
|
@media (min-width: @screen-md-min) {
|
||
|
.make-grid(-md);
|
||
|
}
|
||
|
|
||
|
|
||
|
// Large grid
|
||
|
//
|
||
|
// Columns, offsets, pushes, and pulls for the large desktop device range.
|
||
|
|
||
|
@media (min-width: @screen-lg-min) {
|
||
|
.make-grid(-lg);
|
||
|
}
|