index.scss 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. @import '../common/abstracts/variable';
  2. @import '../common/abstracts/mixin';
  3. .wot-theme-dark {
  4. @include b(select-picker) {
  5. :deep(.wd-select-picker__arrow),
  6. :deep(.wd-select-picker__close),
  7. :deep(.wd-select-picker__clear) {
  8. color: $-dark-color;
  9. }
  10. :deep(.wd-select-picker__cell--placeholder) {
  11. .wd-cell__value {
  12. color: $-dark-color-gray;
  13. }
  14. }
  15. }
  16. }
  17. @include b(select-picker) {
  18. @include edeep(cell) {
  19. @include when(disabled) {
  20. .wd-cell__value {
  21. color: $-input-disabled-color;
  22. cursor: not-allowed;
  23. }
  24. }
  25. @include when(error) {
  26. .wd-cell__value {
  27. color: $-input-error-color;
  28. }
  29. .wd-select-picker__arrow {
  30. color: $-input-error-color;
  31. }
  32. }
  33. @include m(placeholder) {
  34. .wd-cell__value {
  35. color: $-input-placeholder-color;
  36. }
  37. }
  38. @include when(large) {
  39. .wd-select-picker__arrow,
  40. .wd-select-picker__clear {
  41. font-size: $-cell-icon-size-large;
  42. }
  43. }
  44. }
  45. @include edeep(arrow, clear) {
  46. display: block;
  47. font-size: $-cell-icon-size;
  48. color: $-cell-arrow-color;
  49. line-height: $-cell-line-height;
  50. }
  51. @include edeep(clear) {
  52. color: $-cell-clear-color;
  53. }
  54. @include e(loading) {
  55. position: absolute;
  56. display: flex;
  57. top: 0;
  58. right: 0;
  59. bottom: 0;
  60. left: 0;
  61. align-items: center;
  62. justify-content: center;
  63. z-index: 3;
  64. background: $-picker-loading-bg;
  65. }
  66. @include edeep(header) {
  67. height: 72px;
  68. line-height: 72px;
  69. }
  70. @include e(wrapper) {
  71. padding: 0 10px;
  72. position: relative;
  73. max-height: 356px;
  74. box-sizing: border-box;
  75. overflow: auto;
  76. @include when(filterable) {
  77. height: 314px;
  78. max-height: 314px;
  79. }
  80. @include when(loading) {
  81. overflow: hidden;
  82. }
  83. }
  84. @include e(text-active) {
  85. color: $-color-theme;
  86. }
  87. @include e(footer) {
  88. padding: 24px 15px;
  89. }
  90. }