vuestic-ui/dist/esm-node/VaDatePickerCell.css

Vue 3 UI Framework

.va-date-picker-cell {
  position: relative;
  color: var(--va-date-picker-text-color);
  line-height: var(--va-date-picker-cell-size);
  min-height: var(--va-date-picker-cell-size);
  min-width: var(--va-date-picker-cell-size);
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  border-radius: var(--va-date-picker-cell-radius);
  box-sizing: border-box;
  text-align: center;
  z-index: 1;
}
.va-date-picker-cell::after, .va-date-picker-cell::before {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  z-index: -1;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  box-sizing: border-box;
  border-radius: var(--va-date-picker-cell-radius);
}
.va-date-picker-cell_clear {
  cursor: default;
  opacity: 0;
}
.va-date-picker-cell_highlighted-weekend {
  color: var(--va-date-picker-weekends-color);
}
.va-date-picker-cell_in-range::after {
  background-color: var(--va-bg);
  opacity: var(--va-date-picker-cell-background-opacity-in-range);
}
.va-date-picker-cell_today {
  font-weight: bold;
}
.va-date-picker-cell_today::before {
  border: 2px solid var(--va-date-picker-color);
}
.va-date-picker-cell_selected {
  background-color: var(--va-bg);
  color: var(--va-text-color-computed);
}
.va-date-picker-cell_other-month {
  opacity: var(--va-date-picker-cell-opacity);
}
.va-date-picker-cell:hover:not(.va-date-picker-cell_selected):not(.va-date-picker-cell_readonly):not(.va-date-picker-cell_disabled):not(.va-date-picker-cell_other-month)::after, .va-date-picker-cell_focused:not(.va-date-picker-cell_selected):not(.va-date-picker-cell_readonly):not(.va-date-picker-cell_disabled):not(.va-date-picker-cell_other-month)::after, .va-date-picker-cell_focused:hover:not(.va-date-picker-cell_selected):not(.va-date-picker-cell_readonly):not(.va-date-picker-cell_disabled):not(.va-date-picker-cell_other-month)::after {
  background-color: var(--va-date-picker-selected-background);
  opacity: var(--va-date-picker-cell-background-opacity-hover);
}
.va-date-picker-cell_disabled {
  cursor: not-allowed;
  opacity: var(--va-date-picker-cell-opacity);
}
.va-date-picker-cell_disabled:not(.va-date-picker-cell_today) {
  opacity: 0.5;
}
.va-date-picker-cell_disabled::after {
  opacity: var(--va-date-picker-cell-opacity);
  border: none;
  height: 2px;
  width: 50%;
  background: currentColor;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.va-date-picker-cell_readonly {
  cursor: default;
}