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.
30 lines
892 B
30 lines
892 B
/**
|
|
* 响应式类,控制元素的显示隐藏
|
|
**/
|
|
@import (reference) "../var.less";
|
|
|
|
@xs-only: e('max-width: @{sm}');
|
|
@sm-and-up: e('min-width: @{sm}');
|
|
@sm-only: e('min-width: @{sm}) and (max-width: @{md}');
|
|
@sm-and-down: e('max-width: @{md}');
|
|
@md-and-up: e('min-width: @{md}');
|
|
@md-only: e('min-width: @{md}) and (max-width: @{lg}');
|
|
@md-and-down: e('max-width: @{lg}');
|
|
@lg-and-up: e('min-width: @{lg}');
|
|
@lg-only: e('min-width: @{lg}) and (max-width: @{xl}');
|
|
@lg-and-down: e('max-width: @{xl}');
|
|
@xl-only: e('min-width: @{xl}');
|
|
|
|
|
|
@hide-array: xs-only, sm-and-up, sm-only, sm-and-down, md-and-up, md-only, md-and-down, lg-and-up, lg-only, lg-and-down, xl-only;
|
|
|
|
.hide(@i: 1) when(@i <= length(@hide-array)) {
|
|
@name: extract(@hide-array, @i);
|
|
.hidden-@{name} {
|
|
@media screen and (@@name) {
|
|
display: none !important;
|
|
}
|
|
}
|
|
.hide((@i + 1));
|
|
}
|
|
.hide();
|