420b6e3a4250fbf301524d20f17f611f4e3e2389ec1e060e08bdeb02d153267f3e59270fae8d4bc1468ff3bb82caac54e6cf862402102eea1f15d9cfc46d28 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. @import "mixins/mixins";
  2. @import "common/var";
  3. @import "button";
  4. @import "button-group";
  5. @include b(calendar) {
  6. background-color:#fff;
  7. @include e(header) {
  8. display: flex;
  9. justify-content: space-between;
  10. padding: 12px 20px;
  11. border-bottom: $--table-border;
  12. }
  13. @include e(title) {
  14. color: #000000;
  15. align-self: center;
  16. }
  17. @include e(body) {
  18. padding: 12px 20px 35px;
  19. }
  20. }
  21. @include b(calendar-table) {
  22. table-layout: fixed;
  23. width: 100%;
  24. thead th {
  25. padding: 12px 0;
  26. color: $--color-text-regular;
  27. font-weight: normal;
  28. }
  29. &:not(.is-range) {
  30. td.prev,
  31. td.next {
  32. color: $--color-text-placeholder;
  33. }
  34. }
  35. td {
  36. border-bottom: $--calendar-border;
  37. border-right: $--calendar-border;
  38. vertical-align: top;
  39. transition: background-color 0.2s ease;
  40. @include when(selected) {
  41. background-color: $--calendar-selected-background-color;
  42. }
  43. @include when(today) {
  44. color: $--color-primary;
  45. }
  46. }
  47. tr:first-child td {
  48. border-top: $--calendar-border;
  49. }
  50. tr td:first-child {
  51. border-left: $--calendar-border;
  52. }
  53. tr.el-calendar-table__row--hide-border td {
  54. border-top: none;
  55. }
  56. @include b(calendar-day) {
  57. box-sizing: border-box;
  58. padding: 8px;
  59. height: $--calendar-cell-width;
  60. &:hover {
  61. cursor: pointer;
  62. background-color: $--calendar-selected-background-color;
  63. }
  64. }
  65. }