@@ -, +, @@ - Go to Tools -> Calendar. - Confirm that entering holidays works correctly for all types: Single, weekly, yearly, ranges, repeated ranges. - Confirm that holidays are deleted as expected. - Confirm that the colors of each type of holiday is correct. --- .../intranet-tmpl/prog/css/src/_flatpickr.scss | 3 +- .../css/src/{_vars.scss => _flatpickr_vars.scss} | 4 +- koha-tmpl/intranet-tmpl/prog/css/src/calendar.scss | 149 +++++++++++++++++++++ .../prog/en/modules/tools/holidays.tt | 139 +++++++++---------- 4 files changed, 223 insertions(+), 72 deletions(-) rename koha-tmpl/intranet-tmpl/prog/css/src/{_vars.scss => _flatpickr_vars.scss} (94%) create mode 100644 koha-tmpl/intranet-tmpl/prog/css/src/calendar.scss --- a/koha-tmpl/intranet-tmpl/prog/css/src/_flatpickr.scss +++ a/koha-tmpl/intranet-tmpl/prog/css/src/_flatpickr.scss @@ -1,4 +1,4 @@ -@import "vars"; +@import "flatpickr_vars"; @-webkit-keyframes fpFadeInDown { from { @@ -69,6 +69,7 @@ direction: ltr; display: none; font-size: 14px; + gap: 2px; line-height: 24px; opacity: 0; padding: 0; --- a/koha-tmpl/intranet-tmpl/prog/css/src/_vars.scss +++ a/koha-tmpl/intranet-tmpl/prog/css/src/_vars.scss @@ -2,9 +2,9 @@ $bezier: cubic-bezier(0.23, 1, 0.32, 1); $slideTime: 400ms; -$daySize: 39px; +$daySize: 39px !default; $padding: $daySize / 16; -$dayMargin: 2px; +$dayMargin: 2px !default; $daysWidth: $daySize * 7 + $dayMargin * 14 + $padding * 2 + 2; $calendarWidth: $daysWidth; --- a/koha-tmpl/intranet-tmpl/prog/css/src/calendar.scss +++ a/koha-tmpl/intranet-tmpl/prog/css/src/calendar.scss @@ -0,0 +1,149 @@ +$daySize: 45px; +$exception_bg: #B3D4FF; +$holiday_bg: #FFAEAE; +$repeatableweekly_bg: #FFFF99; +$repeatableyearly_bg: #FFCC66; +$selected: #B9DB88; + +@import "flatpickr"; + +.controls { + display: block; + padding: 3px 0; +} + +.key { + line-height: 230%; + padding: 3px; + white-space: nowrap; + + &.exception { + background-color: $exception_bg; + } + + &.holiday { + background-color: $holiday_bg; + } + + &.repeatableweekly { + background-color: $repeatableweekly_bg; + } + + &.repeatableyearly { + background-color: $repeatableyearly_bg; + } +} + +.flatpickr-day { + &.selected { + background-color: $selected; + border: 0; + } + + &.exception { + background-color: $exception_bg; + + &.selected { + border: 3px solid $selected; + } + } + + &.holiday { + background-color: $holiday_bg; + + &.selected { + border: 3px solid $selected; + } + } + + &.repeatableweekly { + background-color: $repeatableweekly_bg; + + &.selected { + border: 3px solid $selected; + } + } + + &.repeatableyearly { + background-color: $repeatableyearly_bg; + + &.selected { + border: 3px solid $selected; + } + } +} + +#holidayexceptions th.exception { + background-color: $exception_bg; +} + +#holidaysunique th.holiday { + background-color: $holiday_bg; + + &.selected { + border: 2px solid #fff4c6; + } +} + +#holidayweeklyrepeatable th.repeatableweekly { + background-color: $repeatableweekly_bg; +} + +#holidaysyearlyrepeatable th.repeatableyearly { + background-color: $repeatableyearly_bg; +} + +.panel { + border: 1px solid #B9D8D9; + border-radius: 4px; + box-shadow: none; + padding: 0; + display: none; + margin: 1em 0; + z-index: 1; +} + +fieldset.brief { + border: 0; + border-radius: 4px; + margin: 0; +} + +#showHoliday { + margin: .5em 0; +} + +fieldset.brief ol { + font-size: 100%; +} + +fieldset.brief li, +fieldset.brief li.radio { + padding: 0.2em 0; +} + +#holidayweeklyrepeatable, +#holidaysyearlyrepeatable, +#holidaysunique, +#holidayexceptions { + font-size: 90%; + margin-bottom: 1em; +} + +#calendar-container { + margin: 1em 0; +} + +#calendar-anchor { + display: none; +} + +.flatpickr-calendar { + border-radius: 0; + border: 1px solid #B9D8D9; + box-shadow: none; +} + +.dayContainer { + gap: 3px; +} --- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt +++ a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt @@ -41,11 +41,6 @@ [% PROCESS options_for_libraries libraries => Branches.all( selected => branch ) %] - - - - -