From 775cb9cc6e412b41811c0b06c26576b2a730f361 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
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 <jeremy.breuillard@biblibre.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
---
 .../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 %]
     <style>
         fieldset { padding : .3em;margin:.3em 0;}
-        #tagcloud    {background-color: #F3F3F3; text-align: justify;padding:7px;}
+        #tagcloud    {background-color: #F5F5F5; text-align: justify;padding:7px;}
         .tag a       {text-decoration: none;}
         .tag a:hover {text-decoration: underline;}
         .tag         {display: block; padding-left: 1em;}
-- 
2.39.5