@c8y/style/styles/_datepicker.less

Styles for Cumulocity IoT applications

[datepicker],
[uib-datepicker],
[uib-daypicker] {
  .btn,
  .btn-default {
    border: 0;

    .box-shadow(none);
  }
  table {
    outline: none;
    font-size: @font-size-small;
  }
  tbody {
    .btn,
    .btn-default {
      position: relative;
      border: 1px solid @component-background-default;
      font-size: inherit;
      .text-info {
        color: @component-brand-primary;
        font-weight: bolder;
      }
      &.active {
        background-color: @component-brand-primary;
        color: @palette-high;
        .text-info {
          color: @palette-high;
        }
      }
    }
    .btn-sm {
      padding: 5px 8px;
    }
    .uib-years .btn-default {
      padding: 5px 13px;
    }
  }
}

.c8y-datetime-picker {
  .form-inline .form-group {
    display: inline-block;
    vertical-align: top;
  }
}

.form-group.datepicker {
  position: relative;

  .form-control {
    padding-right: 28px !important;
  }
  &::after {
    .c8y-glyph();
    position: absolute;
    top: 50%;
    right: 5px;
    z-index: 2;
    color: @component-brand-primary;
    content: @c8y-glyph-calendar;
    font-size: 24px;
    transform: translate(0, -50%);
    pointer-events: none;
  }
  + .timepicker {
    margin-left: 2px !important;
  }
}

.meausurements2 .timeField .btn {
  padding: 4px;
  height: 24px;
}

.meausurements2 .timeField input {
  border-radius: @component-border-radius-base!important;
}

// remove focus on calendar
.uib-datepicker-popup.dropdown-menu:focus,
.uib-datepicker-popup.dropdown-menu > *,
.uib-daypicker {
  outline: none;
}

.timepicker {
  input.form-control {
    width: 44px;
    .form-group-sm & {
      width: 30px;
    }
  }
  
  .form-inline & {
    .form-group {
      margin-right: 0;
    }
  }
  
  .uib-time.am-pm {
    width: 60px;
    
    .btn {
      height: 28px;
      margin-left: 2px;
      padding-top: 2px;
      padding-bottom: 2px;
      width: 100%;
    }
  }
}

// fix z-index when attached to body
body {
  > div[uib-datepicker-popup-wrap] {
    .uib-datepicker-popup.dropdown-menu {
      z-index: @zindex-navbar-fixed + 21;
    }
  }
  &.modal-open {
    > div[uib-datepicker-popup-wrap] {
      .uib-datepicker-popup.dropdown-menu {
        z-index: @zindex-modal + 1;
      }
    }
  }
}