Skip to content

Commit

Permalink
Fix select dropdown menu background in dark theme (#858)
Browse files Browse the repository at this point in the history
  • Loading branch information
sissbruecker authored Sep 24, 2024
1 parent b53fe09 commit f4dd2b5
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 0 deletions.
7 changes: 7 additions & 0 deletions bookmarks/styles/theme-dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -141,3 +141,10 @@
--bookmark-actions-weight: 400;
--bulk-actions-bg-color: var(--contrast-5);
}

/* Try to force dark color scheme for all native elements (e.g. upload button
in file inputs, native select dropdown). For the select dropdown some browsers
ignore this and use whatever users have configured in their system settings. */
:root {
color-scheme: dark;
}
10 changes: 10 additions & 0 deletions bookmarks/styles/theme/forms.css
Original file line number Diff line number Diff line change
Expand Up @@ -197,6 +197,16 @@ textarea.form-input {
no-repeat right 0.35rem center / 0.4rem 0.5rem;
padding-right: calc(var(--control-icon-size) + var(--control-padding-x));
}

/* Options */
& option {
/* On Windows with Chrome / Edge, options seems to use the same
background color as the select. However for the dark theme the
background is a semi-transparent white, resulting in an opaque white
background for the dropdown. Use the modal background color to force
a dark background instead. */
background: var(--modal-container-bg-color);
}
}

/* Form element: Checkbox and Radio */
Expand Down

0 comments on commit f4dd2b5

Please sign in to comment.