css-vars.scss 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. // CSS3 var
  2. @use './var' as *;
  3. @use '../mixins/_var.scss' as *;
  4. @use '../mixins/mixins.scss' as *;
  5. html.dark {
  6. color-scheme: dark;
  7. // hex colors
  8. @each $type in (primary, success, warning, danger, error, info) {
  9. @include set-css-color-type($colors, $type);
  10. }
  11. // --el-box-shadow-#{$type}
  12. @include set-component-css-var('box-shadow', $box-shadow);
  13. // color-scheme
  14. // Background --el-bg-color-#{$type}
  15. @include set-component-css-var('bg-color', $bg-color);
  16. // --el-text-color-#{$type}
  17. @include set-component-css-var('text-color', $text-color);
  18. // --el-border-color-#{$type}
  19. @include set-component-css-var('border-color', $border-color);
  20. // Fill --el-fill-color-#{$type}
  21. @include set-component-css-var('fill-color', $fill-color);
  22. @include set-component-css-var('mask-color', $mask-color);
  23. }
  24. @include dark(button) {
  25. @include set-component-css-var('button', $button);
  26. }
  27. @include dark(card) {
  28. @include set-component-css-var('card', $card);
  29. }
  30. @include dark(empty) {
  31. @include set-component-css-var('empty', $empty);
  32. }