[FEATURE] Add chevron icon for select

deoostfrees · Jan 28, 2024 · 2b17ac7 · 2b17ac7
1 parent 8106c07
commit 2b17ac7
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 0 deletions.
diff --git a/css/_icons.css b/css/_icons.css
@@ -1,4 +1,6 @@
 :root {
   --check-icon: url('./../icons/check.svg');
+  --chevron-down-icon: url('./../icons/chevron-down.svg');
+  --error-icon: url('./../icons/error.svg');
   --minus-icon: url('./../icons/minus.svg');
 }
diff --git a/css/content/forms/_form-select.css b/css/content/forms/_form-select.css
@@ -3,6 +3,9 @@ select {
      -moz-appearance: none;
           appearance: none;
   background-color: var(--select-background-color);
+  background-image: url('./../../../icons/chevron-down.svg');
+  background-position: calc(100% - ((8 / 18) * 1rem)) center;
+  background-repeat: no-repeat;
   border-radius: var(--select-border-radius);
   border: calc((1 / 18) * 1rem) solid var(--select-border-color);
   color: var(--select-color);

diff --git a/icons/chevron-down.svg b/icons/chevron-down.svg