Bug 32308: Update Chocolat image viewer CSS to conform to redesign color scheme

This patch makes minor modifications to the Chocolat CSS so that the
buttons (next, previous, close) are styled with colors that conform to
the new interface color scheme.

Note: You may encounter Bug 32307 when testing.

To test, apply the patch and enable at least two cover image services in
the staff interface: Amazon, Local cover images, and/or Coce.

Locate a bibliographic record which has at least two cover images and
view the detail page. Click on the cover image to trigger the image
viewer overlay.

Confirm that the controls in this view are colored green, matching the
current color scheme.

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Katrin <katrin.fischer.83@web.de>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>

diff --git a/koha-tmpl/intranet-tmpl/lib/Chocolat/css/chocolat.css b/koha-tmpl/intranet-tmpl/lib/Chocolat/css/chocolat.css
index 16d2c95..04d7da1 100644 (file)
--- a/koha-tmpl/intranet-tmpl/lib/Chocolat/css/chocolat.css
+++ b/koha-tmpl/intranet-tmpl/lib/Chocolat/css/chocolat.css
@@ -235,16 +235,16 @@ body.chocolat-open > .chocolat-image-wrapper {
 }
 
 .chocolat-wrapper .chocolat-left {
-    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-arrow-left-circle-fill' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0zm3.5 7.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z' style='fill:%237ab8ba;fill-opacity:1' /%3E%3C/svg%3E") 50% 50% no-repeat;
+    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-arrow-left-circle-fill' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0zm3.5 7.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z' style='fill:%23408540;fill-opacity:1' /%3E%3C/svg%3E") 50% 50% no-repeat;
     background-size: 35px;
 }
 .chocolat-wrapper .chocolat-right {
-    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-arrow-right-circle-fill' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z' style='fill:%237ab8ba;fill-opacity:1' /%3E%3C/svg%3E") 50% 50% no-repeat;
+    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-arrow-right-circle-fill' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z' style='fill:%23408540;fill-opacity:1' /%3E%3C/svg%3E") 50% 50% no-repeat;
     background-size: 35px;
 }
 
 .chocolat-wrapper .chocolat-close {
-    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-x-circle-fill' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z' style='fill:%237ab8ba;fill-opacity:1' /%3E%3C/svg%3E") 50% 50% no-repeat;
+    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-x-circle-fill' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z' style='fill:%23408540;fill-opacity:1' /%3E%3C/svg%3E") 50% 50% no-repeat;
     background-size: 35px;
 }