From c5ccad0c707b34e68b34d9791f65d7530a43af2b Mon Sep 17 00:00:00 2001
From: Marius Balteanu <marius.balteanu@zitec.com>
Date: Wed, 26 Mar 2025 21:42:45 +0000
Subject: [PATCH] Replace legacy icons with SVG icons in tabs left / right
 buttons (#41833).

git-svn-id: https://svn.redmine.org/redmine/trunk@23566 e93f8b46-1217-0410-a6f0-8f06a7374b81
---
 app/assets/images/icons.svg            |  3 +++
 app/assets/stylesheets/application.css | 12 ++++++++++--
 app/views/common/_tabs.html.erb        |  8 ++++++--
 config/icon_source.yml                 |  2 ++
 4 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/app/assets/images/icons.svg b/app/assets/images/icons.svg
index 148cd09a0..df09ffd6e 100644
--- a/app/assets/images/icons.svg
+++ b/app/assets/images/icons.svg
@@ -14,6 +14,9 @@
     <symbol viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" id="icon--angle-down">
       <path d="M6 9l6 6l6 -6"/>
     </symbol>
+    <symbol viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" id="icon--angle-left">
+      <path d="M15 6l-6 6l6 6"/>
+    </symbol>
     <symbol viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" id="icon--angle-right">
       <path d="M9 6l6 6l-6 6"/>
     </symbol>
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index a8f27cb22..140b4edd2 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -1464,18 +1464,26 @@ button.tab-left:hover, button.tab-right:hover {
 button.tab-left:focus, button.tab-right:focus {
   outline: 0;
 }
+button.tab-left svg.icon-svg, button.tab-right svg.icon-svg {
+  stroke: #999;
+  stroke-width: 2;
+}
 
 button.tab-left {
   right: 28px;
-  background: #eeeeee url(/arrow_left.png) no-repeat 50% 50%;
   border-top-left-radius:3px;
 }
+button.tab-left:not(:has(svg)) {
+  background: #eeeeee url(/arrow_left.png) no-repeat 50% 50%;
+}
 
 button.tab-right {
   right: 4px;
-  background: #eeeeee url(/arrow_right.png) no-repeat 50% 50%;
   border-top-right-radius:3px;
 }
+button.tab-right:not(:has(svg)) {
+  background: #eeeeee url(/arrow_right.png) no-repeat 50% 50%;
+}
 
 button.tab-left.disabled, button.tab-right.disabled {
   background-color: #ccc;
diff --git a/app/views/common/_tabs.html.erb b/app/views/common/_tabs.html.erb
index def21ff45..0190e5e6b 100644
--- a/app/views/common/_tabs.html.erb
+++ b/app/views/common/_tabs.html.erb
@@ -12,8 +12,12 @@
   <% end -%>
   </ul>
   <div class="tabs-buttons" style="display:none;">
-    <button class="tab-left" type="button" onclick="moveTabLeft(this);"></button>
-    <button class="tab-right" type="button" onclick="moveTabRight(this);"></button>
+    <button class="tab-left icon-only" type="button" onclick="moveTabLeft(this);">
+      <%= sprite_icon "angle-left" %>
+    </button>
+    <button class="tab-right icon-only" type="button" onclick="moveTabRight(this);">
+      <%= sprite_icon "angle-right" %>
+    </button>
   </div>
 </div>
 
diff --git a/config/icon_source.yml b/config/icon_source.yml
index a6f3f5a85..d48944c91 100644
--- a/config/icon_source.yml
+++ b/config/icon_source.yml
@@ -85,6 +85,8 @@
   svg: chevron-right
 - name: angle-up
   svg: chevron-up
+- name: angle-left
+  svg: chevron-left
 - name: email
   svg: mail
 - name: email-disabled