修改样式

v1.0.0
于肖磊 2024-10-19 13:31:53 +08:00
parent 1d7fdedc34
commit 8be2e92c24
1 changed files with 25 additions and 24 deletions

View File

@ -135,84 +135,85 @@ $size: 50;
} }
} }
$color_key: '#';
/* 常用颜色1 */ /* 常用颜色1 */
@each $color in c, d, e, f, 0, 3, 5, 6, 8, 9 { @each $color in c, d, e, f, 0, 3, 5, 6, 8, 9 {
.cr-#{$color} { .cr-#{$color} {
color: ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; color: #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.bg-#{$color} { .bg-#{$color} {
background-color: ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; background-color: #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-#{$color} { .br-#{$color} {
border: 1px solid ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border: 1px solid #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-t-#{$color} { .br-t-#{$color} {
border-top: 1px solid ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-top: 1px solid #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-l-#{$color} { .br-l-#{$color} {
border-left: 1px solid ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-left: 1px solid #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-r-#{$color} { .br-r-#{$color} {
border-right: 1px solid ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-right: 1px solid #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-b-#{$color} { .br-b-#{$color} {
border-bottom: 1px solid ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-bottom: 1px solid #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-#{$color}-dashed { .br-#{$color}-dashed {
border: 1px dashed ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border: 1px dashed #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-t-#{$color}-dashed { .br-t-#{$color}-dashed {
border-top: 1px dashed ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-top: 1px dashed #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-l-#{$color}-dashed { .br-l-#{$color}-dashed {
border-left: 1px dashed ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-left: 1px dashed #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-r-#{$color}-dashed { .br-r-#{$color}-dashed {
border-right: 1px dashed ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-right: 1px dashed #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
.br-b-#{$color}-dashed { .br-b-#{$color}-dashed {
border-bottom: 1px dashed ##{$color}#{$color}#{$color}#{$color}#{$color}#{$color}; border-bottom: 1px dashed #{$color_key}#{$color}#{$color}#{$color}#{$color}#{$color}#{$color};
} }
} }
/* 常用颜色2 */ /* 常用颜色2 */
@each $color in f5, f8, f7, e9, 80 { @each $color in f5, f8, f7, e9, 80 {
.cr-#{$color} { .cr-#{$color} {
color: ##{$color}#{$color}#{$color}; color: #{$color_key}#{$color}#{$color}#{$color};
} }
.bg-#{$color} { .bg-#{$color} {
background-color: ##{$color}#{$color}#{$color}; background-color: #{$color_key}#{$color}#{$color}#{$color};
} }
.br-#{$color} { .br-#{$color} {
border: 1px solid ##{$color}#{$color}#{$color}; border: 1px solid #{$color_key}#{$color}#{$color}#{$color};
} }
.br-t-#{$color} { .br-t-#{$color} {
border-top: 1px solid ##{$color}#{$color}#{$color}; border-top: 1px solid #{$color_key}#{$color}#{$color}#{$color};
} }
.br-l-#{$color} { .br-l-#{$color} {
border-left: 1px solid ##{$color}#{$color}#{$color}; border-left: 1px solid #{$color_key}#{$color}#{$color}#{$color};
} }
.br-r-#{$color} { .br-r-#{$color} {
border-right: 1px solid ##{$color}#{$color}#{$color}; border-right: 1px solid #{$color_key}#{$color}#{$color}#{$color};
} }
.br-b-#{$color} { .br-b-#{$color} {
border-bottom: 1px solid ##{$color}#{$color}#{$color}; border-bottom: 1px solid #{$color_key}#{$color}#{$color}#{$color};
} }
.br-#{$color}-dashed { .br-#{$color}-dashed {
border: 1px dashed ##{$color}#{$color}#{$color}; border: 1px dashed #{$color_key}#{$color}#{$color}#{$color};
} }
.br-t-#{$color}-dashed { .br-t-#{$color}-dashed {
border-top: 1px dashed ##{$color}#{$color}#{$color}; border-top: 1px dashed #{$color_key}#{$color}#{$color}#{$color};
} }
.br-l-#{$color}-dashed { .br-l-#{$color}-dashed {
border-left: 1px dashed ##{$color}#{$color}#{$color}; border-left: 1px dashed #{$color_key}#{$color}#{$color}#{$color};
} }
.br-r-#{$color}-dashed { .br-r-#{$color}-dashed {
border-right: 1px dashed ##{$color}#{$color}#{$color}; border-right: 1px dashed #{$color_key}#{$color}#{$color}#{$color};
} }
.br-b-#{$color}-dashed { .br-b-#{$color}-dashed {
border-bottom: 1px dashed ##{$color}#{$color}#{$color}; border-bottom: 1px dashed #{$color_key}#{$color}#{$color}#{$color};
} }
} }