Attachment 118947 Details for Bug 28044 – Bug 28044: Increase specificity of calendar tables CSS

[patch] Bug 28044: Increase specificity of calendar tables CSS

Bug-28044-Increase-specificity-of-calendar-tables-.patch (text/plain), 6.79 KB, created by Owen Leonard on 2021-03-29 11:07:39 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: Owen Leonard

Created: 2021-03-29 11:07:39 UTC

Size: 6.79 KB

patch

obsolete

>From 39a6604c06c202f26742694abf2c636696828cdb Mon Sep 17 00:00:00 2001
>From: Owen Leonard <oleonard@myacpl.org>
>Date: Mon, 29 Mar 2021 10:33:13 +0000
>Subject: [PATCH] Bug 28044: Increase specificity of calendar tables CSS
>
>This patch adds increased specificity to the CSS which should add colors
>to the tables of holidays. The default DataTable CSS was overriding the
>custom color-coding.
>
>This patch also moves the calendar CSS into a separate file.
>
>To test, apply the patch and go to Tools -> Calendar.
>
>If necessary, add at least one of the following:
>- Unique holiday
>- Holiday repeating weekly
>- Holiday repeating monthly
>- Holiday exception
>
>In the table listing each kind of holiday, the color of the table header
>should match the colors in the "Key" section under Hints. The color
>should be correct regardless of how the table is sorted.
>---
> koha-tmpl/intranet-tmpl/prog/css/calendar.css      | 159 +++++++++++++++++++++
> .../prog/en/modules/tools/holidays.tt              |  20 +--
> 2 files changed, 160 insertions(+), 19 deletions(-)
> create mode 100644 koha-tmpl/intranet-tmpl/prog/css/calendar.css
>
>diff --git a/koha-tmpl/intranet-tmpl/prog/css/calendar.css b/koha-tmpl/intranet-tmpl/prog/css/calendar.css
>new file mode 100644
>index 0000000000..fd81d6fbed
>--- /dev/null
>+++ b/koha-tmpl/intranet-tmpl/prog/css/calendar.css
>@@ -0,0 +1,159 @@
>+.key {
>+    padding: 3px;
>+    white-space: nowrap;
>+    line-height: 230%;
>+}
>+
>+.ui-datepicker {
>+    font-size: 150%;
>+}
>+
>+.ui-datepicker th,
>+.ui-datepicker .ui-datepicker-title select {
>+    font-size: 80%;
>+}
>+
>+.ui-datepicker td a {
>+    padding: .5em;
>+}
>+
>+.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
>+    font-size: 80%;
>+}
>+
>+.key {
>+    padding: 3px;
>+    white-space: nowrap;
>+    line-height: 230%;
>+}
>+
>+.normalday {
>+    background-color: #EDEDED;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+.exception,
>+#holidayexceptions th.exception {
>+    background-color: #B3D4FF;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+.holiday,
>+#holidaysunique th.holiday {
>+    background-color: #FFAEAE;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+.repeatableweekly,
>+#holidayweeklyrepeatable th.repeatableweekly {
>+    background-color: #FFFF99;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+.repeatableyearly,
>+#holidaysyearlyrepeatable th.repeatableyearly {
>+    background-color: #FFCC66;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+td.exception a.ui-state-default {
>+    background: #b3d4ff none;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+td.holiday a.ui-state-default {
>+    background: #FFAEAE none;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+td.repeatableweekly a.ui-state-default {
>+    background: #FFFF99 none;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+td.repeatableyearly a.ui-state-default {
>+    background: #FFCC66 none;
>+    color: #000;
>+    border: 1px solid #BCBCBC;
>+}
>+
>+.information {
>+    z-index: 1;
>+    background-color: #DCD2F1;
>+    width: 300px;
>+    display: none;
>+    border: 1px solid #000000;
>+    color: #000000;
>+    font-size: 8pt;
>+    font-weight: bold;
>+    background-color: #FFD700;
>+    cursor: pointer;
>+    padding: 2px;
>+}
>+
>+.panel {
>+    z-index: 1;
>+    display: none;
>+    border: 3px solid #CCC;
>+    padding: 3px;
>+    margin-top: .3em;
>+    background-color: #FEFEFE;
>+}
>+
>+fieldset.brief {
>+    border: 0;
>+    margin-top: 0;
>+}
>+
>+#showHoliday {
>+    margin: .5em 0;
>+}
>+
>+h1 select {
>+    width: 20em;
>+}
>+
>+fieldset.brief ol {
>+    font-size: 100%;
>+}
>+
>+fieldset.brief li,
>+fieldset.brief li.radio {
>+    padding: 0.2em 0;
>+}
>+
>+.help {
>+    margin: .3em 0;
>+    border: 1px solid #EEE;
>+    padding: .3em .7em;
>+    font-size: 90%;
>+}
>+
>+#holidayweeklyrepeatable,
>+#holidaysyearlyrepeatable,
>+#holidaysunique,
>+#holidayexceptions {
>+    font-size: 90%;
>+    margin-bottom: 1em;
>+}
>+
>+.calendar td,
>+.calendar th,
>+.calendar .button,
>+.calendar tbody .day {
>+    padding: .7em;
>+    font-size: 110%;
>+}
>+
>+.calendar {
>+    width: auto;
>+    border: 0;
>+}
>diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt
>index 8aefa2458f..5c709526de 100644
>--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt
>+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt
>@@ -5,25 +5,7 @@
> [% INCLUDE 'doc-head-open.inc' %]
> <title>Koha &rsaquo; Tools &rsaquo; [% Branches.GetName( branch ) | html %] calendar</title>
> [% INCLUDE 'doc-head-close.inc' %]
>-<style> .key { padding : 3px; white-space:nowrap; line-height:230%; }
>-.ui-datepicker { font-size : 150%; }
>-.ui-datepicker th, .ui-datepicker .ui-datepicker-title select { font-size : 80%; }
>-.ui-datepicker td a { padding : .5em; }
>-.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { font-size : 80%; }
>-.key { padding : 3px; white-space:nowrap; line-height:230%; }
>-.normalday { background-color :  #EDEDED; color :  Black; border : 1px solid #BCBCBC; }
>-.exception { background-color :  #b3d4ff; color :  Black; border : 1px solid #BCBCBC; }
>-.holiday {  background-color :  #ffaeae; color :  Black;  border : 1px solid #BCBCBC; }
>-.repeatableweekly {  background-color :  #FFFF99; color :  Black;  border : 1px solid #BCBCBC; }
>-.repeatableyearly {  background-color :  #FFCC66; color :  Black;  border : 1px solid #BCBCBC; }
>-td.exception a.ui-state-default { background:  #b3d4ff none; color :  Black; border : 1px solid #BCBCBC; }
>-td.holiday a.ui-state-default {  background:  #ffaeae none; color :  Black;  border : 1px solid #BCBCBC; }
>-td.repeatableweekly a.ui-state-default {  background:  #FFFF99 none; color :  Black;  border : 1px solid #BCBCBC; }
>-td.repeatableyearly a.ui-state-default {  background:  #FFCC66 none; color :  Black;  border : 1px solid #BCBCBC; }
>-.information { z-index : 1; background-color :  #DCD2F1; width : 300px; display : none; border : 1px solid #000000; color :  #000000; font-size :  8pt; font-weight :  bold; background-color :  #FFD700; cursor :  pointer; padding : 2px; }
>-.panel { z-index : 1; display : none; border : 3px solid #CCC; padding : 3px; margin-top: .3em;  background-color: #FEFEFE; } fieldset.brief { border : 0; margin-top: 0; }
>-#showHoliday { margin : .5em 0; } h1 select { width: 20em; } fieldset.brief ol { font-size:100%; } fieldset.brief li, fieldset.brief li.radio  { padding:0.2em 0; } .help { margin:.3em 0;border:1px solid #EEE;padding:.3em .7em; font-size : 90%; } #holidayweeklyrepeatable, #holidaysyearlyrepeatable, #holidaysunique, #holidayexceptions { font-size : 90%; margin-bottom : 1em;} .calendar td, .calendar th, .calendar .button, .calendar tbody .day { padding : .7em; font-size: 110%; } .calendar { width: auto; border : 0; }
>-</style>
>+[% Asset.css("css/calendar.css") | $raw %]
> </head>
> <body id="tools_holidays" class="tools">
> [% INCLUDE 'header.inc' %]
>-- 
>2.11.0

Actions: View | Diff | Splinter Review

Attachments on bug 28044: 118947 | 119058 | 119138