Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-21 11:35:34 +01:00
Code Issues Projects Releases Wiki Activity

[PM-1643] Tweak search box styling (#4788)

Browse Source 
* Set explicit selection foreground/background for header search input

* Modify solarized dark colours for search
This commit is contained in:
Patrick H. Lauke 2023-05-11 11:23:42 +01:00 committed by GitHub
parent ab4d8df2ae
commit de6e0c8c3d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
apps/browser/src/popup/scss/base.scss
View File

@ -289,6 +289,14 @@ header {
color: themed("headerInputColor");
}
&::selection {
@include themify($themes) {
// explicitly set text selection to invert foreground/background
background-color: themed("headerInputColor");
color: themed("headerInputBackgroundColor");
}
}
&:focus {
border-radius: $border-radius;
outline: none;

6
apps/browser/src/popup/scss/variables.scss
View File

@ -266,10 +266,10 @@ $themes: (
headerBackgroundColor: $solarizedDarkBase02,
headerBackgroundHoverColor: $solarizedDarkBase01,
headerBorderColor: $solarizedDarkBase03,
headerInputBackgroundColor: $solarizedDarkBase2,
headerInputBackgroundColor: darken($solarizedDarkBase0, 5%),
headerInputBackgroundFocusColor: $solarizedDarkBase1,
headerInputColor: $solarizedDarkBase01,
headerInputPlaceholderColor: $solarizedDarkBase00,
headerInputColor: $solarizedDarkBase02,
headerInputPlaceholderColor: lighten($solarizedDarkBase02, 5%),
listItemBackgroundHoverColor: lighten($solarizedDarkBase02, 5%),
disabledIconColor: $solarizedDarkBase0,
disabledBoxOpacity: 0.5,

8
apps/desktop/src/scss/header.scss
View File

@ -73,6 +73,14 @@
color: themed("headerInputColor");
}
&::selection {
@include themify($themes) {
// explicitly set text selection to invert foreground/background
background-color: themed("headerInputColor");
color: themed("headerInputBackgroundColor");
}
}
&:focus {
border-radius: $border-radius;
outline: none;