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,"); --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,"); --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; }