koha-tmpl/intranet-tmpl/prog/css/src/calendar.scss

   1 $daySize: 45px;
   2 $exception_bg: #B3D4FF;
   3 $holiday_bg: #FFAEAE;
   4 $repeatableweekly_bg: #FFFF99;
   5 $repeatableyearly_bg: #FFCC66;
   6 $selected: #B9DB88;
   7
   8 @import "flatpickr";
   9
  10 .controls {
  11     display: block;
  12     padding: 3px 0;
  13 }
  14
  15 .key {
  16     line-height: 230%;
  17     padding: 3px;
  18     white-space: nowrap;
  19
  20     &.exception {
  21         background-color: $exception_bg;
  22     }
  23
  24     &.holiday {
  25         background-color: $holiday_bg;
  26     }
  27
  28     &.repeatableweekly {
  29         background-color: $repeatableweekly_bg;
  30     }
  31
  32     &.repeatableyearly {
  33         background-color: $repeatableyearly_bg;
  34     }
  35 }
  36
  37 .flatpickr-day {
  38     &.selected {
  39         background-color: $selected;
  40         border: 0;
  41     }
  42
  43     &.exception {
  44         background-color: $exception_bg;
  45
  46         &.selected {
  47             border: 3px solid $selected;
  48         }
  49     }
  50
  51     &.holiday {
  52         background-color: $holiday_bg;
  53
  54         &.selected {
  55             border: 3px solid $selected;
  56         }
  57     }
  58
  59     &.repeatableweekly {
  60         background-color: $repeatableweekly_bg;
  61
  62         &.selected {
  63             border: 3px solid $selected;
  64         }
  65     }
  66
  67     &.repeatableyearly {
  68         background-color: $repeatableyearly_bg;
  69
  70         &.selected {
  71             border: 3px solid $selected;
  72         }
  73     }
  74 }
  75
  76 #holidayexceptions th.exception {
  77     background-color: $exception_bg;
  78 }
  79
  80 #holidaysunique th.holiday {
  81     background-color: $holiday_bg;
  82
  83     &.selected {
  84         border: 2px solid #fff4c6;
  85     }
  86 }
  87
  88 #holidayweeklyrepeatable th.repeatableweekly {
  89     background-color: $repeatableweekly_bg;
  90 }
  91
  92 #holidaysyearlyrepeatable th.repeatableyearly {
  93     background-color: $repeatableyearly_bg;
  94 }
  95
  96 .panel {
  97     border: 1px solid #B9D8D9;
  98     border-radius: 4px;
  99     box-shadow: none;
 100     padding: 0;
 101     display: none;
 102     margin: 1em 0;
 103     z-index: 1;
 104 }
 105
 106 fieldset.brief {
 107     border: 0;
 108     border-radius: 4px;
 109     margin: 0;
 110 }
 111
 112 #showHoliday {
 113     margin: .5em 0;
 114 }
 115
 116 fieldset.brief ol {
 117     font-size: 100%;
 118 }
 119
 120 fieldset.brief li,
 121 fieldset.brief li.radio {
 122     padding: 0.2em 0;
 123 }
 124
 125 #holidayweeklyrepeatable,
 126 #holidaysyearlyrepeatable,
 127 #holidaysunique,
 128 #holidayexceptions {
 129     font-size: 90%;
 130     margin-bottom: 1em;
 131 }
 132
 133 #calendar-container {
 134     margin: 1em 0;
 135 }
 136
 137 #calendar-anchor {
 138     display: none;
 139 }
 140
 141 .flatpickr-calendar {
 142     border-radius: 0;
 143     border: 1px solid #B9D8D9;
 144     box-shadow: none;
 145 }
 146
 147 .dayContainer {
 148     gap: 3px;
 149 }