From 13272e92a6c98daad06aa166a6674bf4dac7cc4b Mon Sep 17 00:00:00 2001
From: hcong <1050828145@qq.com>
Date: 星期一, 21 十月 2024 11:06:55 +0800
Subject: [PATCH] 问题审核1021
---
src/styles/element/base.scss | 100 +++++++++++++++++++++++++-------------------------
1 files changed, 50 insertions(+), 50 deletions(-)
diff --git a/src/styles/element/base.scss b/src/styles/element/base.scss
index 7ed2e32..6a2dabe 100644
--- a/src/styles/element/base.scss
+++ b/src/styles/element/base.scss
@@ -1,54 +1,34 @@
-//
-@mixin font-size($size) {
- font-size: var($size);
+/************************************** font size **************************************/
+$fontsize: (
+ s: var(--el-font-size-small),
+ b: var(--el-font-size-base),
+ m: var(--el-font-size-medium),
+ l: var(--el-font-size-large)
+);
+
+@each $dName, $dValue in $fontsize {
+ .f-#{$dName} {
+ font-size: #{$dValue};
+ }
}
-.f-s {
- @include font-size(--el-font-size-small);
-}
+/************************************** color **************************************/
+$colors: (
+ p: var(--el-color-primary),
+ s: var(--el-color-success),
+ w: var(--el-color-warning),
+ d: var(--el-color-danger),
+ e: var(--el-color-error),
+ i: var(--el-color-info)
+);
-.f-b {
- @include font-size(--el-font-size-base);
-}
-
-.f-m {
- @include font-size(--el-font-size-medium);
-}
-
-.f-l {
- @include font-size(--el-font-size-large);
-}
-
-@mixin color($value) {
- color: var($value);
-}
-
-.color-p {
- @include color(--el-color-primary);
-}
-
-.color-s {
- @include color(--el-color-success);
-}
-
-.color-w {
- @include color(--el-color-warning);
-}
-
-.color-d {
- @include color(--el-color-danger);
-}
-
-.color-e {
- @include color(--el-color-error);
-}
-
-.color-i {
- @include color(--el-color-info);
-}
-
-.b-color-aqua {
- background-color: aqua;
+@each $dName, $dValue in $colors {
+ .color-#{$dName} {
+ color: #{$dValue};
+ }
+ .b-color-#{$dName} {
+ background-color: #{$dValue};
+ }
}
/************************************** 鍐呭杈硅窛 **************************************/
@@ -85,8 +65,28 @@
}
}
-.w-300px {
- width: 300px;
+/************************************** 瀹介珮 **************************************/
+$csize: (
+ small: var(--el-component-size-small),
+ default: var(--el-component-size-default),
+ large: var(--el-component-size-large)
+);
+$ws: (20px, 40px, 60px, 100px, 150px, 250px, 300px);
+@each $name, $value in $csize {
+ .w-#{$name} {
+ width: #{$value};
+ }
+ .h-#{$name} {
+ height: #{$value};
+ }
+}
+@each $i in $ws {
+ .w-#{$i} {
+ width: #{$i};
+ }
+ .h-#{$i} {
+ height: #{$i};
+ }
}
//
--
Gitblit v1.9.3