You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

136 lines
3.1 KiB

4 years ago
  1. .datepicker {
  2. position: absolute;
  3. background-color: #fff;
  4. padding: 20px;
  5. border: 0 solid transparent;
  6. border-radius: 4px;
  7. box-shadow: 0 6px 24px rgba(17, 17, 19, 0.12); }
  8. .datepicker.is-embed {
  9. border: 1px solid rgba(17, 17, 19, 0.05);
  10. max-width: 288px;
  11. position: static;
  12. box-shadow: none; }
  13. .datepicker-head {
  14. display: flex;
  15. align-items: center;
  16. margin-top: -4px;
  17. margin-bottom: 8px; }
  18. .datepicker-control {
  19. width: 24px;
  20. height: 24px;
  21. color: rgba(17, 17, 19, 0.75);
  22. font-size: 18px;
  23. font-weight: bold;
  24. text-align: center;
  25. cursor: pointer;
  26. -webkit-user-select: none;
  27. -moz-user-select: none;
  28. -khtml-user-select: none;
  29. -ms-user-select: none;
  30. user-select: none; }
  31. .datepicker-month-box {
  32. flex: 1;
  33. font-size: 12px;
  34. font-weight: bold;
  35. text-transform: uppercase;
  36. color: #111113;
  37. text-align: center;
  38. padding: 8px 0 4px 0; }
  39. .datepicker-month-box span {
  40. margin: 0 1px; }
  41. .datepicker-select-year {
  42. display: inline-block;
  43. cursor: pointer;
  44. position: relative;
  45. height: 24px;
  46. line-height: 24px; }
  47. .datepicker-select-year .datepicker-select-year-caret {
  48. position: relative;
  49. top: -1px;
  50. display: inline-block;
  51. width: 0;
  52. height: 0;
  53. margin-left: .3em;
  54. vertical-align: middle;
  55. border-top: 4px solid;
  56. border-right: 4px solid transparent;
  57. border-left: 4px solid transparent; }
  58. .datepicker-select-year select {
  59. z-index: 2;
  60. position: absolute;
  61. top: 0;
  62. left: 0;
  63. opacity: 0;
  64. height: 24px;
  65. -webkit-appearance: menulist-button;
  66. -moz-appearance: menulist-button;
  67. -ms-appearance: menulist-button;
  68. appearance: menulist-button; }
  69. .datepicker-weekdays {
  70. white-space: nowrap; }
  71. .datepicker-weekdays span {
  72. display: inline-block;
  73. text-align: center;
  74. width: 36px;
  75. height: 24px;
  76. margin-top: -1px;
  77. margin-left: -1px;
  78. font-size: 11px;
  79. font-weight: bold;
  80. color: #111113; }
  81. .datepicker-row:after {
  82. content: '';
  83. display: table;
  84. clear: both; }
  85. .datepicker-cell {
  86. float: left;
  87. text-align: center;
  88. width: 36px;
  89. height: 32px;
  90. line-height: 32px;
  91. margin-top: -1px;
  92. margin-left: -1px;
  93. font-size: 12px;
  94. border: 1px solid #fff; }
  95. .datepicker-cell a {
  96. display: block;
  97. color: #111113;
  98. line-height: 31px;
  99. text-decoration: none;
  100. border-radius: 4px;
  101. background: #fff; }
  102. .datepicker-cell.is-out a {
  103. background-color: transparent;
  104. color: rgba(17, 17, 19, 0.5); }
  105. .datepicker-cell.is-out a:hover {
  106. color: #fff;
  107. background-color: #158df7; }
  108. .datepicker-cell.is-today {
  109. border-color: #fff; }
  110. .datepicker-cell.is-today a {
  111. background: #ee2455;
  112. color: #fff; }
  113. .datepicker-cell.is-today a:hover {
  114. color: #fff; }
  115. .datepicker-cell.is-selected {
  116. border-color: #fff; }
  117. .datepicker-cell.is-selected a {
  118. background: #111113;
  119. color: #fff; }
  120. .datepicker-cell.is-selected a:hover {
  121. color: #fff; }
  122. .datepicker-cell a:hover {
  123. background: #158df7;
  124. color: #fff; }
  125. .datepicker-cell.is-disabled a,
  126. .datepicker-cell.is-disabled a:hover {
  127. background-color: #fff;
  128. color: rgba(17, 17, 19, 0.4);
  129. cursor: default; }