bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-10 21:33:27 +00:00
Code Issues Releases Wiki Activity

[PM-2238] Add nord and solarize themes (#5491)

Browse Source
This commit is contained in:
Oscar Hinton
2023-06-06 09:35:13 +02:00
committed by GitHub
parent 107c9052b8
commit 2a9efb2ebe
3 changed files with 161 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
libs/components/src/stories/colors.mdx
View File

@@ -105,4 +105,6 @@ Below are all the permited colors. Please consult design before considering addi
<div class="tw-flex tw-space-x-4">
<Table />
<Table class="theme_dark tw-bg-background" />
<Table class="theme_nord tw-bg-background" />
<Table class="theme_solarize tw-bg-background" />
</div>

78
libs/components/src/tw-theme.css
View File

@@ -80,4 +80,82 @@
--tw-ring-offset-color: #1f242e;
}
.theme_nord {
--color-transparent-hover: rgb(255 255 255 / 0.12);
--color-background: 67 76 94;
--color-background-alt: 59 66 82;
--color-background-alt2: 76 86 106;
--color-background-alt3: 76 86 106;
--color-background-alt4: 67 76 94;
--color-primary-300: 108 153 166;
--color-primary-500: 136 192 208;
--color-primary-700: 160 224 242;
--color-secondary-100: 76 86 106;
--color-secondary-300: 94 105 125;
--color-secondary-500: 216 222 233;
--color-secondary-700: 255 255 255;
--color-success-500: 163 190 140;
--color-success-700: 144 170 122;
--color-danger-500: 228 129 139;
--color-danger-700: 191 97 106;
--color-warning-500: 235 203 139;
--color-warning-700: 210 181 121;
--color-info-500: 129 161 193;
--color-info-700: 94 129 172;
--color-text-main: 229 233 240;
--color-text-muted: 216 222 233;
--color-text-contrast: 46 52 64;
--color-text-alt2: 255 255 255;
--color-text-code: 219 177 211;
--tw-ring-offset-color: #434c5e;
}
.theme_solarized {
--color-transparent-hover: rgb(255 255 255 / 0.12);
--color-background: 0 43 54;
--color-background-alt: 7 54 66;
--color-background-alt2: 31 72 87;
--color-background-alt3: 31 72 87;
--color-background-alt4: 0 43 54;
--color-primary-300: 42 161 152;
--color-primary-500: 133 153 0;
--color-primary-700: 192 203 123;
--color-secondary-100: 31 72 87;
--color-secondary-300: 101 123 131;
--color-secondary-500: 131 148 150;
--color-secondary-700: 238 232 213;
--color-success-500: 133 153 0;
--color-success-700: 192 203 123;
--color-danger-500: 220 50 47;
--color-danger-700: 223 135 134;
--color-warning-500: 181 137 0;
--color-warning-700: 220 189 92;
--color-info-500: 133 153 0;
--color-info-700: 192 203 123;
--color-text-main: 253 246 227;
--color-text-muted: 147 161 161;
--color-text-contrast: 0 43 54;
--color-text-alt2: 255 255 255;
--color-text-code: 240 141 199;
--tw-ring-offset-color: #002b36;
}
@import "./search/search.component.css";