新增若干sass常用场景样式:内外边距,吸顶,悬浮

This commit is contained in:
aixianling
2023-01-12 11:11:01 +08:00
parent 5aff9d6bc2
commit 1d0f10ddca

View File

@@ -18,12 +18,36 @@ $--font-path: '~element-ui/lib/theme-chalk/fonts';
常用内外边距样式
*/
@each $padMar, $pm in (mar:margin, pad:padding) {
@each $pos, $p in (l:left, r:right, t:top, b:bottom) {
@each $v in (8, 10, 16, 20, 32, 48, 60) {
@each $v in (8, 10, 16, 20, 32, 48, 56, 64, 80) {
@each $pos, $p in (l:left, r:right, t:top, b:bottom) {
.#{$padMar}-#{$pos+$v} {
#{$pm}-#{$p}: #{$v}px
}
}
.#{$padMar}-#{$v} {
#{$pm}: #{$v}px
}
//纵向
.#{$padMar}-v#{$v} {
#{$pm}-top: #{$v}px;
#{$pm}-bottom: #{$v}px;
}
//横向
.#{$padMar}-h#{$v} {
#{$pm}-left: #{$v}px;
#{$pm}-right: #{$v}px;
}
}
}
@each $where in (sticky, fixed) {
@each $pos, $p in (l:left, r:right, t:top, b:bottom) {
.#{$where}-#{$pos} {
position: fixed;
#{$p}: 0;
z-index: 202301031019;
width: 100%;
}
}
}