form-flat-pickr.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
  1. .flatpickr-calendar .flatpickr-day {
  2. color: #6e6b7b; }
  3. .flatpickr-calendar .flatpickr-day.today {
  4. border-color: #7367f0; }
  5. .flatpickr-calendar .flatpickr-day.today:hover {
  6. background: transparent;
  7. color: #6e6b7b; }
  8. .flatpickr-calendar .flatpickr-day.selected, .flatpickr-calendar .flatpickr-day.selected:hover {
  9. background: #7367f0;
  10. color: #fff;
  11. border-color: #7367f0; }
  12. .flatpickr-calendar .flatpickr-day.inRange, .flatpickr-calendar .flatpickr-day.inRange:hover {
  13. background: #f3f2fe;
  14. border-color: #f3f2fe;
  15. box-shadow: -5px 0 0 #f3f2fe, 5px 0 0 #f3f2fe; }
  16. .flatpickr-calendar .flatpickr-day.startRange, .flatpickr-calendar .flatpickr-day.endRange, .flatpickr-calendar .flatpickr-day.startRange:hover, .flatpickr-calendar .flatpickr-day.endRange:hover {
  17. background: #7367f0;
  18. color: #fff;
  19. border-color: #7367f0; }
  20. .flatpickr-calendar .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n + 1)),
  21. .flatpickr-calendar .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n + 1)),
  22. .flatpickr-calendar .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n + 1)) {
  23. box-shadow: -10px 0 0 #7367f0; }
  24. .flatpickr-calendar .flatpickr-day.flatpickr-disabled, .flatpickr-calendar .flatpickr-day.prevMonthDay, .flatpickr-calendar .flatpickr-day.nextMonthDay {
  25. color: #dae1e7; }
  26. .flatpickr-calendar .flatpickr-day:hover {
  27. background: #f6f6f6; }
  28. .flatpickr-calendar:after, .flatpickr-calendar:before {
  29. display: none; }
  30. .flatpickr-calendar .flatpickr-months .flatpickr-prev-month,
  31. .flatpickr-calendar .flatpickr-months .flatpickr-next-month {
  32. top: -5px; }
  33. .flatpickr-calendar .flatpickr-months .flatpickr-prev-month:hover i,
  34. .flatpickr-calendar .flatpickr-months .flatpickr-prev-month:hover svg,
  35. .flatpickr-calendar .flatpickr-months .flatpickr-next-month:hover i,
  36. .flatpickr-calendar .flatpickr-months .flatpickr-next-month:hover svg {
  37. fill: #7367f0; }
  38. .flatpickr-calendar .flatpickr-current-month span.cur-month {
  39. font-weight: 300; }
  40. .flatpickr-time {
  41. height: 2.714rem; }
  42. .flatpickr-time input:hover,
  43. .flatpickr-time .flatpickr-am-pm:hover,
  44. .flatpickr-time input:focus,
  45. .flatpickr-time .flatpickr-am-pm:focus {
  46. background: #fff; }
  47. .dark-layout .flatpickr-calendar {
  48. background: #161d31;
  49. border-color: #161d31;
  50. box-shadow: none; }
  51. .dark-layout .flatpickr-calendar .flatpickr-months i,
  52. .dark-layout .flatpickr-calendar .flatpickr-months svg {
  53. fill: #b4b7bd; }
  54. .dark-layout .flatpickr-calendar .flatpickr-month {
  55. color: #b4b7bd; }
  56. .dark-layout .flatpickr-calendar .flatpickr-weekwrapper .flatpickr-weeks {
  57. box-shadow: 1px 0 0 #3b4253; }
  58. .dark-layout .flatpickr-calendar .flatpickr-weekday {
  59. color: #b4b7bd; }
  60. .dark-layout .flatpickr-calendar .flatpickr-day, .dark-layout .flatpickr-calendar .flatpickr-day.today:hover {
  61. color: #b4b7bd; }
  62. .dark-layout .flatpickr-calendar .flatpickr-day.selected {
  63. color: #fff; }
  64. .dark-layout .flatpickr-calendar .flatpickr-day.prevMonthDay, .dark-layout .flatpickr-calendar .flatpickr-day.nextMonthDay, .dark-layout .flatpickr-calendar .flatpickr-day.flatpickr-disabled {
  65. color: #4e5154 !important; }
  66. .dark-layout .flatpickr-calendar .flatpickr-day.inRange, .dark-layout .flatpickr-calendar .flatpickr-day.inRange:hover {
  67. background: #283046;
  68. border-color: #283046;
  69. box-shadow: -5px 0 0 #283046, 5px 0 0 #283046; }
  70. .dark-layout .flatpickr-calendar .flatpickr-day:hover:not(.selected):not(.today):not(.startRange):not(.endRange) {
  71. color: #b4b7bd;
  72. border-color: #283046; }
  73. .dark-layout .flatpickr-calendar .flatpickr-days .flatpickr-day:hover:not(.selected):not(.today):not(.startRange):not(.endRange) {
  74. background: #283046; }
  75. .dark-layout .flatpickr-calendar .flatpickr-time {
  76. border-color: #161d31 !important; }
  77. .dark-layout .flatpickr-calendar .flatpickr-time .numInput,
  78. .dark-layout .flatpickr-calendar .flatpickr-time .flatpickr-am-pm {
  79. color: #b4b7bd; }
  80. .dark-layout .flatpickr-calendar .flatpickr-time .numInput:hover,
  81. .dark-layout .flatpickr-calendar .flatpickr-time .flatpickr-am-pm:hover {
  82. background: #161d31; }
  83. .dark-layout .flatpickr-calendar .flatpickr-time .arrowUp:after {
  84. border-bottom-color: #b4b7bd; }
  85. .dark-layout .flatpickr-calendar .flatpickr-time .arrowDown:after {
  86. border-top-color: #b4b7bd; }
  87. .dark-layout .flatpickr-time input:hover,
  88. .dark-layout .flatpickr-time .flatpickr-am-pm:hover,
  89. .dark-layout .flatpickr-time input:focus,
  90. .dark-layout .flatpickr-time .flatpickr-am-pm:focus {
  91. background: #161d31; }
  92. .flatpickr-input[readonly],
  93. .flatpickr-input ~ .form-control[readonly],
  94. .flatpickr-human-friendly[readonly] {
  95. background-color: inherit;
  96. opacity: 1 !important; }
  97. .flatpickr-weekdays {
  98. margin-top: 8px; }
  99. .flatpickr-current-month .flatpickr-monthDropdown-months {
  100. -webkit-appearance: none; }
  101. .flatpickr-current-month .flatpickr-monthDropdown-months,
  102. .flatpickr-current-month .numInputWrapper {
  103. font-size: 1.1rem;
  104. border-radius: 4px;
  105. padding: 2px;
  106. transition: all 0.15s ease-out; }
  107. .flatpickr-current-month .flatpickr-monthDropdown-months span,
  108. .flatpickr-current-month .numInputWrapper span {
  109. display: none; }