3c0523ac37c2d2e7399b8c514f20d233ea76e94f4a1b4ba50b57395cbcfca52893215f23499401e4b795c05453e4fe86e271bc5a8ac9e28bbad33c64216b8e 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. @import "../common/var";
  2. @include b(picker-panel) {
  3. color: $--color-text-regular;
  4. border: 1px solid $--datepicker-border-color;
  5. box-shadow: $--box-shadow-light;
  6. background: $--color-white;
  7. border-radius: $--border-radius-base;
  8. line-height: 30px;
  9. margin: 5px 0;
  10. @include e((body, body-wrapper)) {
  11. &::after {
  12. content: "";
  13. display: table;
  14. clear: both;
  15. }
  16. }
  17. @include e(content) {
  18. position: relative;
  19. margin: 15px;
  20. }
  21. @include e(footer) {
  22. border-top: 1px solid $--datepicker-inner-border-color;
  23. padding: 4px;
  24. text-align: right;
  25. background-color: $--color-white;
  26. position: relative;
  27. font-size: 0;
  28. }
  29. @include e(shortcut) {
  30. display: block;
  31. width: 100%;
  32. border: 0;
  33. background-color: transparent;
  34. line-height: 28px;
  35. font-size: 14px;
  36. color: $--datepicker-font-color;
  37. padding-left: 12px;
  38. text-align: left;
  39. outline: none;
  40. cursor: pointer;
  41. &:hover {
  42. color: $--datepicker-hover-font-color;
  43. }
  44. &.active {
  45. background-color: #e6f1fe;
  46. color: $--datepicker-active-color;
  47. }
  48. }
  49. @include e(btn) {
  50. border: 1px solid #dcdcdc;
  51. color: #333;
  52. line-height: 24px;
  53. border-radius: 2px;
  54. padding: 0 20px;
  55. cursor: pointer;
  56. background-color: transparent;
  57. outline: none;
  58. font-size: 12px;
  59. &[disabled] {
  60. color: #cccccc;
  61. cursor: not-allowed;
  62. }
  63. }
  64. @include e(icon-btn) {
  65. font-size: 12px;
  66. color: $--datepicker-icon-color;
  67. border: 0;
  68. background: transparent;
  69. cursor: pointer;
  70. outline: none;
  71. margin-top: 8px;
  72. &:hover {
  73. color: $--datepicker-hover-font-color;
  74. }
  75. @include when(disabled) {
  76. color: $--font-color-disabled-base;
  77. &:hover {
  78. cursor: not-allowed;
  79. }
  80. }
  81. }
  82. @include e(link-btn) {
  83. vertical-align: middle;
  84. }
  85. }
  86. .el-picker-panel *[slot=sidebar],
  87. .el-picker-panel__sidebar {
  88. position: absolute;
  89. top: 0;
  90. bottom: 0;
  91. width: 110px;
  92. border-right: 1px solid $--datepicker-inner-border-color;
  93. box-sizing: border-box;
  94. padding-top: 6px;
  95. background-color: $--color-white;
  96. overflow: auto;
  97. }
  98. .el-picker-panel *[slot=sidebar] + .el-picker-panel__body,
  99. .el-picker-panel__sidebar + .el-picker-panel__body {
  100. margin-left: 110px;
  101. }