From 775cb9cc6e412b41811c0b06c26576b2a730f361 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Fri, 24 Sep 2021 18:58:35 +0000 Subject: [PATCH] Bug 29126: Accessibility: More corrections to contrast in the OPAC MIME-Version: 1.0 Content-Type: text/plain; charset=utf8 Content-Transfer-Encoding: 8bit This patch makes a few more corrections to OPAC CSS in order to avoid having elements which lack sufficient contrast, in particular parts of the interface where a standard-colored link appears on a darker background. To test, apply the patch and rebuild the OPAC CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client) Check the following pages/areas: - Breadcrumbs navigation - Datatables buttons (on the "Your summary" page) - Bibliographic view tabs (Normal/MARC/ISBD) on the bibliographic detail pages. - "Action" menu on the bibliographic detail pages: Place hold, print, etc. - Links inside "striped" tables: Links on the alternate grey background are darker to increase contrast. - Sidebar links on user pages: Your summary, your charges, etc. - Tag cloud: Approved tags in the weighted list. Signed-off-by: Jérémy Breuillard Signed-off-by: Katrin Fischer Signed-off-by: Jonathan Druart --- .../opac-tmpl/bootstrap/css/src/_common.scss | 4 +-- .../opac-tmpl/bootstrap/css/src/opac.scss | 25 ++++++++++++++++++- .../bootstrap/en/modules/opac-tags.tt | 2 +- 3 files changed, 27 insertions(+), 4 deletions(-) diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss index 96ec3fd384..3820c104d7 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss @@ -309,7 +309,7 @@ textarea, .dt-button { background-color: transparent; border: 0; - color: #0088cc; + color: lighten( $links, 1.2 ); line-height: 20px; padding: 4px 12px; text-align: center; @@ -800,7 +800,7 @@ ul { } a { - color: #004D99; + color: darken( $links, 5% ); cursor: pointer; float: left; padding: .5em 1em; diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss index 19f611e0f3..6668d44882 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss @@ -463,6 +463,7 @@ th { #action { a, button { + color: darken( $links, 5% ); &:hover { i { @@ -559,6 +560,12 @@ th { margin: 15px; padding: 5px 10px; border-radius: 0px; + + a { + + color: darken( $links, 5%); + + } } .breadcrumb-item { @@ -594,6 +601,20 @@ th { .table-striped tbody > tr:nth-child(odd) > td, .table-striped tbody > tr:nth-child(odd) > th { background-color: #F0F3F3; + + a { + color: darken( $links, 5%); + + &.btn { + color: #FFF; + } + } + + button { + &.btn-link { + color: darken( $links, 5% ); + } + } } #availability_facet { @@ -1393,7 +1414,7 @@ nav { /* action buttons */ #action { - background-color: #F0F3F3; + background-color: #F5F5F5; border: 1px solid #E8E8E8; margin: .5em 0 0 0; padding: .5em; @@ -1403,6 +1424,7 @@ nav { } a { + color: darken( $links, 5% ); font-weight: bold; text-decoration: none; text-align: left; @@ -1814,6 +1836,7 @@ nav { background-color: #f0f3f3; border: 1px solid #d8d8d8; border-bottom-width: 0; + color: darken( $links, 5% ); display: block; margin: 0; padding: .4em .6em; diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt index 6af6caf691..0acc4c600e 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt @@ -8,7 +8,7 @@ [% BLOCK cssinclude %]