css-vars.scss 1.0 KB

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