light.scss 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. @use './base.scss';
  2. @use '../variable.scss' as light_variable;
  3. [data-vxe-ui-theme="light"] {
  4. /*font color*/
  5. --vxe-ui-font-color: #{light_variable.$vxe-ui-font-color};
  6. --vxe-ui-font-tinge-color: #{light_variable.$vxe-ui-font-tinge-color};
  7. --vxe-ui-font-lighten-color: #{light_variable.$vxe-ui-font-lighten-color};
  8. --vxe-ui-font-darken-color: #{light_variable.$vxe-ui-font-darken-color};
  9. --vxe-ui-font-disabled-color: #{light_variable.$vxe-ui-font-disabled-color};
  10. /*font status color*/
  11. --vxe-ui-font-primary-color: #{light_variable.$vxe-ui-font-primary-color};
  12. --vxe-ui-font-primary-hover-color: #{light_variable.$vxe-ui-font-primary-hover-color};
  13. --vxe-ui-font-primary-tinge-color: #{light_variable.$vxe-ui-font-primary-tinge-color};
  14. --vxe-ui-font-primary-lighten-color: #{light_variable.$vxe-ui-font-primary-lighten-color};
  15. --vxe-ui-font-primary-darken-color: #{light_variable.$vxe-ui-font-primary-darken-color};
  16. --vxe-ui-font-primary-disabled-color: #{light_variable.$vxe-ui-font-primary-disabled-color};
  17. --vxe-ui-status-success-color: #{light_variable.$vxe-ui-status-success-color};
  18. --vxe-ui-status-info-color: #{light_variable.$vxe-ui-status-info-color};
  19. --vxe-ui-status-warning-color: #{light_variable.$vxe-ui-status-warning-color};
  20. --vxe-ui-status-danger-color: #{light_variable.$vxe-ui-status-danger-color};
  21. --vxe-ui-status-error-color: #{light_variable.$vxe-ui-status-error-color};
  22. --vxe-ui-status-success-tinge-color: #{light_variable.$vxe-ui-status-success-tinge-color};
  23. --vxe-ui-status-info-tinge-color: #{light_variable.$vxe-ui-status-info-tinge-color};
  24. --vxe-ui-status-warning-tinge-color: #{light_variable.$vxe-ui-status-warning-tinge-color};
  25. --vxe-ui-status-danger-tinge-color: var(--vxe-ui-status-error-tinge-color);
  26. --vxe-ui-status-error-tinge-color: #{light_variable.$vxe-ui-status-error-tinge-color};
  27. --vxe-ui-status-success-lighten-color: #{light_variable.$vxe-ui-status-success-lighten-color};
  28. --vxe-ui-status-info-lighten-color: #{light_variable.$vxe-ui-status-info-lighten-color};
  29. --vxe-ui-status-warning-lighten-color: #{light_variable.$vxe-ui-status-warning-lighten-color};
  30. --vxe-ui-status-danger-lighten-color: var(--vxe-ui-status-error-lighten-color);
  31. --vxe-ui-status-error-lighten-color: #{light_variable.$vxe-ui-status-error-lighten-color};
  32. --vxe-ui-status-success-darken-color: #{light_variable.$vxe-ui-status-success-darken-color};
  33. --vxe-ui-status-info-darken-color: #{light_variable.$vxe-ui-status-info-darken-color};
  34. --vxe-ui-status-warning-darken-color: #{light_variable.$vxe-ui-status-warning-darken-color};
  35. --vxe-ui-status-danger-darken-color: var(--vxe-ui-status-error-darken-color);
  36. --vxe-ui-status-error-darken-color: #{light_variable.$vxe-ui-status-error-darken-color};
  37. --vxe-ui-status-success-disabled-color: #{light_variable.$vxe-ui-status-success-disabled-color};
  38. --vxe-ui-status-info-disabled-color: #{light_variable.$vxe-ui-status-info-disabled-color};
  39. --vxe-ui-status-warning-disabled-color: #{light_variable.$vxe-ui-status-warning-disabled-color};
  40. --vxe-ui-status-danger-disabled-color: var(--vxe-ui-status-error-disabled-color);
  41. --vxe-ui-status-error-disabled-color: #{light_variable.$vxe-ui-status-error-disabled-color};
  42. /*base*/
  43. --vxe-ui-base-popup-border-color: #{light_variable.$vxe-ui-base-popup-border-color};
  44. --vxe-ui-base-popup-box-shadow: #{light_variable.$vxe-ui-base-popup-box-shadow};
  45. --vxe-ui-base-drag-background-color: #{light_variable.$vxe-ui-base-drag-background-color};
  46. --vxe-ui-base-active-background-color: #{light_variable.$vxe-ui-base-active-background-color};
  47. --vxe-ui-base-hover-background-color: #{light_variable.$vxe-ui-base-hover-background-color};
  48. /*layout*/
  49. --vxe-ui-layout-background-color: #{light_variable.$vxe-ui-layout-background-color};
  50. /*input*/
  51. --vxe-ui-input-border-color: #{light_variable.$vxe-ui-input-border-color};
  52. --vxe-ui-input-placeholder-color: #{light_variable.$vxe-ui-input-placeholder-color};
  53. --vxe-ui-input-disabled-background-color: #{light_variable.$vxe-ui-input-disabled-background-color};
  54. /*number-input*/
  55. --vxe-ui-number-input-control-button-color: #f5f7fa;
  56. /*modal*/
  57. --vxe-ui-modal-header-background-color: #{light_variable.$vxe-ui-modal-header-background-color};
  58. /*tabs*/
  59. --vxe-ui-tabs-card-header-background-color: #{light_variable.$vxe-ui-tabs-card-header-background-color};
  60. --vxe-ui-tabs-close-hover-background-color: #{light_variable.$vxe-ui-tabs-close-hover-background-color};
  61. --vxe-ui-tabs-bar-scrolling-box-shadow-color: #{light_variable.$vxe-ui-tabs-bar-scrolling-box-shadow-color};
  62. /*menu*/
  63. --vxe-ui-menu-item-hover-color: #{light_variable.$vxe-ui-menu-item-hover-color};
  64. --vxe-ui-menu-collapse-wrapper-box-shadow: var(--vxe-ui-base-popup-box-shadow);
  65. /*loading*/
  66. --vxe-ui-loading-background-color: #{light_variable.$vxe-ui-loading-background-color};
  67. /*form*/
  68. --vxe-ui-form-title-background-color: #{light_variable.$vxe-ui-form-title-background-color};
  69. --vxe-ui-form-border-color: #{light_variable.$vxe-ui-form-border-color};
  70. /*form-design*/
  71. --vxe-ui-form-design-widget-hover-background-color: var(--vxe-ui-base-hover-background-color);
  72. --vxe-ui-form-design-sub-widget-hover-background-color: #{light_variable.$vxe-ui-form-design-sub-widget-hover-background-color};
  73. /*list-design*/
  74. --vxe-ui-list-design-table-border-color: #{light_variable.$vxe-ui-list-design-table-border-color};
  75. --vxe-ui-list-design-table-header-background-color: #{light_variable.$vxe-ui-list-design-table-header-background-color};
  76. /*switch*/
  77. --vxe-ui-switch-close-background-color: #{light_variable.$vxe-ui-switch-close-background-color};
  78. /*upload*/
  79. --vxe-ui-upload-drag-over-background-color:#{light_variable.$vxe-ui-upload-drag-over-background-color};
  80. /*tree*/
  81. --vxe-ui-tree-node-hover-background-color: #{light_variable.$vxe-ui-tree-node-hover-background-color};
  82. --vxe-ui-tree-node-radio-checked-background-color: #{light_variable.$vxe-ui-tree-node-radio-checked-background-color};
  83. --vxe-ui-tree-node-hover-radio-checked-background-color: #{light_variable.$vxe-ui-tree-node-hover-radio-checked-background-color};
  84. --vxe-ui-tree-node-checkbox-checked-background-color: #{light_variable.$vxe-ui-tree-node-checkbox-checked-background-color};
  85. --vxe-ui-tree-node-hover-checkbox-checked-background-color: #{light_variable.$vxe-ui-tree-node-hover-checkbox-checked-background-color};
  86. --vxe-ui-tree-node-current-background-color: #{light_variable.$vxe-ui-tree-node-current-background-color};
  87. --vxe-ui-tree-node-hover-current-background-color: #{light_variable.$vxe-ui-tree-node-hover-current-background-color};
  88. /*rate*/
  89. --vxe-ui-rate-item-color: #{light_variable.$vxe-ui-rate-item-color};
  90. /*split*/
  91. --vxe-ui-split-handle-button-background-color: #{light_variable.$vxe-ui-split-handle-button-background-color};
  92. --vxe-ui-split-handle-bar-background-color: #{light_variable.$vxe-ui-split-handle-bar-background-color};
  93. --vxe-ui-split-handle-bar-hover-background-color: #{light_variable.$vxe-ui-split-handle-bar-hover-background-color};
  94. }