src/app/shared/date-control/component/date-control.component.scss

/********************************************************************************
 * Copyright (c) 2020 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0
 *
 * SPDX-License-Identifier: EPL-2.0
 ********************************************************************************/

@import "src/styles/openk.styles";

:host {
  display: inline-flex;
  position: relative;
  font-size: 0.875em;
}

.calendar-control-input {
  width: 100%;
  height: 100%;
  font-size: 1em;

  &::-webkit-clear-button,
  &::-webkit-inner-spin-button,
  &::-webkit-inner-spin-button,
  &::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
  }
}

.calendar-control-input-opened {
  @include rounded-border-mixin($bottom-left: 0, $bottom-right: 0);
}

.calendar-control-day {
  @include rounded-border-mixin();

  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0.5em;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 150ms ease-in-out;

  &.calendar-control-day-today {
    background: $openk-background;
    border-color: $openk-form-border;
  }

  &:hover:not(.calendar-control-day-disabled),
  &:focus:not(.calendar-control-day-disabled) {
    background: $openk-background-highlight;
    border-color: $openk-form-border;
  }

  &:active:not(.calendar-control-day-disabled),
  &.calendar-control-day-selected:not(.calendar-control-day-disabled),
  &.calendar-control-day-selected {
    border: 1px solid get-color($openk-info-palette);
    background-color: get-color($openk-info-palette);
    color: get-color($openk-info-palette, 500, contrast);
  }

}

.calendar-control-day-disabled {
  cursor: unset;
}