From c48fbec07fe4922e4e7b75f8542f3fc7825c46f9 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=UTF-8 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 --- .../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 1d0c0a9..936a266 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss @@ -307,7 +307,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; @@ -798,7 +798,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 c665cfe..4835ed2 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss @@ -467,6 +467,7 @@ th { #action { a, button { + color: darken( $links, 5% ); &:hover { i { @@ -563,6 +564,12 @@ th { margin: 15px; padding: 5px 10px; border-radius: 0px; + + a { + + color: darken( $links, 5%); + + } } #opac-main-search { @@ -585,6 +592,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 { @@ -1279,7 +1300,7 @@ nav { /* action buttons */ #action { - background-color: #F0F3F3; + background-color: #F5F5F5; border: 1px solid #E8E8E8; margin: .5em 0 0 0; padding: .5em; @@ -1289,6 +1310,7 @@ nav { } a { + color: darken( $links, 5% ); font-weight: bold; text-decoration: none; text-align: left; @@ -1700,6 +1722,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 921743f..feff724 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 %]