From 40b95325ddf5d89e4631596e8a1d31cd2b8dc71d Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Tue, 14 Jan 2025 22:10:06 +0200
Subject: [PATCH] style(next): tweak the combo box arrow

---
 src/public/stylesheets/theme-next-dark.css  | 1 +
 src/public/stylesheets/theme-next-light.css | 1 +
 src/public/stylesheets/theme-next/forms.css | 4 +++-
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/public/stylesheets/theme-next-dark.css b/src/public/stylesheets/theme-next-dark.css
index 59937d1bb..60da7cdce 100644
--- a/src/public/stylesheets/theme-next-dark.css
+++ b/src/public/stylesheets/theme-next-dark.css
@@ -49,6 +49,7 @@
     --select-focus-background: #333;
     --select-focus-text-color: var(--input-text-color);
     --select-dropdown-text-color: var(--input-text-color);
+    --select-arrow-svg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='transparent' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/></svg>");
 
     --hover-item-text-color: #efefef;
     --hover-item-background-color: #ffffff24;
diff --git a/src/public/stylesheets/theme-next-light.css b/src/public/stylesheets/theme-next-light.css
index 64a0101ef..20b0a461b 100644
--- a/src/public/stylesheets/theme-next-light.css
+++ b/src/public/stylesheets/theme-next-light.css
@@ -49,6 +49,7 @@
     --select-focus-background: white;
     --select-focus-text-color: var(--input-text-color);
     --select-dropdown-text-color: var(--input-text-color);
+    --select-arrow-svg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='transparent' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/></svg>");
 
     --hover-item-text-color: black;
     --hover-item-background-color: #0000001a;
diff --git a/src/public/stylesheets/theme-next/forms.css b/src/public/stylesheets/theme-next/forms.css
index fd7561439..010f685e4 100644
--- a/src/public/stylesheets/theme-next/forms.css
+++ b/src/public/stylesheets/theme-next/forms.css
@@ -128,7 +128,9 @@ input::selection,
 select, select.form-select {
     outline: 3px solid transparent;
     outline-offset: 6px;
-    background-color: var(--input-background-color);
+    background: unset;
+    background: var(--input-background-color)
+                var(--select-arrow-svg) right 0.75rem center/15px 20px no-repeat;
     color: var(--input-text-color);
     border: unset;
 }