1
0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-18 11:05:41 +01:00

Add support for the Solarized Dark color scheme

This commit is contained in:
Kyle Sferrazza 2021-02-12 15:00:57 -05:00
parent 5bf10376a8
commit 6e0087457d
3 changed files with 67 additions and 0 deletions

16
solarized.scss Normal file
View File

@ -0,0 +1,16 @@
$solarizedDarkBase03: #002b36;
$solarizedDarkBase02: #073642;
$solarizedDarkBase01: #586e75;
$solarizedDarkBase00: #657b83;
$solarizedDarkBase0: #839496;
$solarizedDarkBase1: #93a1a1;
$solarizedDarkBase2: #eee8d5;
$solarizedDarkBase3: #fdf6e3;
$solarizedDarkYellow: #b58900;
$solarizedDarkOrange: #cb4b16;
$solarizedDarkRed: #dc322f;
$solarizedDarkMagenta: #d33682;
$solarizedDarkViolet: #6c71c4;
$solarizedDarkBlue: #268bd2;
$solarizedDarkCyan: #2aa198;
$solarizedDarkGreen: #859900;

View File

@ -1,4 +1,5 @@
@import '~nord/src/sass/nord.scss';
@import './solarized.scss';
$font-family-sans-serif: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
$font-family-monospace: Menlo, Monaco, Consolas, 'Courier New', monospace;
@ -185,6 +186,55 @@ $themes: (
calloutBorderColor: $nord0,
calloutBackgroundColor: $nord2,
),
solarizedDark: (
textColor: $solarizedDarkBase2,
borderColor: $solarizedDarkBase03,
backgroundColor: $solarizedDarkBase03,
backgroundColorAlt: $solarizedDarkBase02,
scrollbarColor: $solarizedDarkBase0,
scrollbarHoverColor: $solarizedDarkBase2,
boxBackgroundColor: $solarizedDarkBase03,
boxBackgroundHoverColor: $solarizedDarkBase02,
boxBorderColor: $solarizedDarkBase02,
tabBackgroundColor: $solarizedDarkBase02,
tabBackgroundHoverColor: $solarizedDarkBase01,
headerColor: $solarizedDarkBase1,
headerBackgroundColor: $solarizedDarkBase02,
headerBackgroundHoverColor: $solarizedDarkBase01,
headerBorderColor: $solarizedDarkBase03,
headerInputBackgroundColor: $solarizedDarkBase2,
headerInputBackgroundFocusColor: $solarizedDarkBase1,
headerInputColor: $solarizedDarkBase01,
headerInputPlaceholderColor: $solarizedDarkBase00,
listItemBackgroundHoverColor: $solarizedDarkBase02,
disabledIconColor: $solarizedDarkBase0,
disabledBoxOpacity: 0.5,
headingColor: $solarizedDarkBase0,
labelColor: $solarizedDarkBase0,
mutedColor: $solarizedDarkBase0,
totpStrokeColor: $solarizedDarkBase0,
boxRowButtonColor: $solarizedDarkBase0,
boxRowButtonHoverColor: $solarizedDarkBase2,
inputBorderColor: $solarizedDarkBase03,
inputBackgroundColor: $solarizedDarkBase01,
inputPlaceholderColor: lighten($solarizedDarkBase00, 20%),
buttonBackgroundColor: $solarizedDarkBase00,
buttonBorderColor: $solarizedDarkBase03,
buttonColor: $solarizedDarkBase1,
buttonPrimaryColor: $solarizedDarkCyan,
buttonDangerColor: $solarizedDarkRed,
primaryColor: $solarizedDarkGreen,
primaryAccentColor: $solarizedDarkCyan,
dangerColor: $solarizedDarkRed,
successColor: $solarizedDarkGreen,
infoColor: $solarizedDarkGreen,
warningColor: $solarizedDarkYellow,
logoSuffix: 'white',
passwordNumberColor: $solarizedDarkCyan,
passwordSpecialColor: $solarizedDarkYellow,
calloutBorderColor: $solarizedDarkBase03,
calloutBackgroundColor: $solarizedDarkBase01,
),
);
@mixin themify($themes: $themes) {

View File

@ -43,6 +43,7 @@ export class OptionsComponent implements OnInit {
{ name: i18nService.t('light'), value: 'light' },
{ name: i18nService.t('dark'), value: 'dark' },
{ name: 'Nord', value: 'nord' },
{ name: 'Solarized Dark', value: 'solarizedDark' },
];
this.uriMatchOptions = [
{ name: i18nService.t('baseDomain'), value: UriMatchType.Domain },