From e70ab4a4f2e1b91af37f54b95a2ba2c0dfffa599 Mon Sep 17 00:00:00 2001
From: Johannes Zellner <johannes@cloudron.io>
Date: Mon, 22 Mar 2021 10:46:39 +0100
Subject: [PATCH] Avoid rendering native select widget

---
 src/theme.scss | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/theme.scss b/src/theme.scss
index 3f0b259a9..20a1063b9 100644
--- a/src/theme.scss
+++ b/src/theme.scss
@@ -108,6 +108,17 @@ $state-danger-border:                       $brand-danger;
     color: white;
 }
 
+select.form-control {
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+
+    background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
+    background-repeat: no-repeat;
+    background-position-x: 100%;
+    background-position-y: 5px;
+}
+
 input[type="checkbox"], input[type="radio"] {
     margin-top: 2px;
 }
@@ -1859,7 +1870,6 @@ tag-input {
     }
 }
 
-
 // ----------------------------
 // Dark mode overrides
 // ----------------------------
@@ -1874,6 +1884,10 @@ tag-input {
         background-color: $backgroundLight;
     }
 
+    select.form-control {
+        background-image: url("data:image/svg+xml;utf8,<svg fill='#959595' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
+    }
+
     .navbar-default {
         background-color: $backgroundDark;
         border-color: $backgroundDark;