mekari-ui-toolkit/dist/css/components/mekari-ui-date-picker.css

Mekari ui toolkit

.date-picker-container {
  position: absolute;
  z-index: 11;
  width: 392px;
  height: auto;
}

.date-picker-calendar-view, .date-picker-collapse-view {
  position: absolute;
  width: 392px;
  padding: 0 16px;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid #e2e2e2;
  border-radius: 4px;
  box-shadow: 0 2px 4px 0 rgba(119, 119, 119, 0.1), 0 4px 8px 0 rgba(119, 119, 119, 0.2);
}

.date-picker-calendar-view {
  height: auto;
  min-height: 284px;
}

.date-picker-collapse-view {
  height: auto;
  min-height: 244px;
}

.date-picker-header {
  display: flex;
  align-items: center;
  height: 52px;
  text-align: center;
}

.date-picker-header-title {
  flex-grow: 5;
  font-weight: 500;
  cursor: pointer;
}

.date-picker-previous-button {
  flex-grow: 1;
  padding-right: 16px;
  text-align: left;
}

.date-picker-previous-button .ic:hover {
  cursor: pointer;
}

.date-picker-next-button {
  flex-grow: 1;
  padding-left: 16px;
  text-align: right;
}

.date-picker-next-button .ic:hover {
  cursor: pointer;
}

.date-picker-row .date-picker-cell .date-picker-date-cell.current-date, .date-picker-row .date-picker-cell .date-picker-month-cell.current-month, .date-picker-row .date-picker-cell .date-picker-year-cell.current-year {
  border-radius: 100%;
  box-shadow: inset 0 0 0 1px #005fbf;
}

.date-picker-row .date-picker-cell .date-picker-date-cell.selected-date, .date-picker-row .date-picker-cell .date-picker-month-cell.selected-month, .date-picker-row .date-picker-cell .date-picker-year-cell.selected-year {
  color: #fff !important;
  background-color: #005fbf !important;
  border-radius: 100%;
}

.date-picker-row .date-picker-cell .date-picker-date-cell.disabled-date, .date-picker-row .date-picker-cell .date-picker-month-cell.disabled-month, .date-picker-row .date-picker-cell .date-picker-year-cell.disabled-year {
  color: #b4b4b4 !important;
  background-color: transparent !important;
  border-radius: 100%;
}

.date-picker-row .date-picker-cell .date-picker-date-cell.disabled-date:hover, .date-picker-row .date-picker-cell .date-picker-month-cell.disabled-month:hover, .date-picker-row .date-picker-cell .date-picker-year-cell.disabled-year:hover {
  cursor: default;
}

.date-picker-row .date-picker-cell .date-picker-date-cell:hover, .date-picker-row .date-picker-cell .date-picker-month-cell:hover, .date-picker-row .date-picker-cell .date-picker-year-cell:hover, .date-picker-row .date-picker-cell:hover .date-picker-date-cell {
  color: #212121;
  cursor: pointer;
  background-color: #f2f4f7;
  border-radius: 100%;
  box-shadow: none;
}

.date-picker-row {
  display: flex;
  flex-wrap: wrap;
}

.date-picker-row .date-picker-cell {
  flex: 1 1 0;
  margin: 2px 0;
  text-align: center;
}

.date-picker-row .date-picker-cell .date-picker-date-cell {
  width: 32px;
  height: 32px;
  margin: 0 auto;
  line-height: 32px;
}

.date-picker-row .date-picker-cell .date-picker-month-cell {
  width: 40px;
  height: 40px;
  margin: 0 auto;
  margin-bottom: 12px;
  line-height: 40px;
}

.date-picker-row .date-picker-cell .date-picker-year-cell {
  width: 48px;
  height: 48px;
  margin: 0 auto;
  margin-bottom: 4px;
  line-height: 48px;
}

.date-picker-day-container {
  display: flex;
  margin-bottom: 16px;
}

.date-picker-day-container .date-picker-day {
  flex: 1 1 0;
  color: #777;
  text-align: center;
}

.date-picker-shortcut-button {
  width: 360px;
  padding: 16px 0;
  color: #777;
  text-align: center;
  cursor: pointer;
}

.date-picker-shortcut-button.disabled {
  color: #b4b4b4;
  cursor: not-allowed;
}

.date-picker-break {
  flex-basis: 100%;
  height: 0;
}

.date-picker--no-outline {
  outline: none;
}
/*# sourceMappingURL=mekari-ui-date-picker.css.map */