array-in-a-matrix/xinny
1
0
Fork 0
mirror of https://github.com/array-in-a-matrix/xinny.git synced 2024-05-08 16:03:34 -04:00
Code Issues Packages Projects Releases Wiki Activity

Almond Dark theme

Browse source
This commit is contained in:
array-in-a-matrix 2023-03-21 09:26:43 -04:00
parent 227c552f1e
commit 042e4f5a03
3 changed files with 31 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/app/organisms/settings/Settings.jsx
View file

@ -80,6 +80,7 @@ function AppearanceSection() {
{ text: 'Butter' },
{ text: 'Nord Dark' },
{ text: 'Cyberpunk' },
{ text: 'Almond Dark'},
]}
onSelect={(index) => {
if (settings.useSystemTheme) toggleSystemTheme();

2
src/client/state/settings.js
View file

@ -20,7 +20,7 @@ class Settings extends EventEmitter {
constructor() {
super();
this.themes = ['', 'silver-theme', 'dark-theme', 'butter-theme', 'nord-dark-theme', 'cyberpunk'];
this.themes = ['', 'silver-theme', 'dark-theme', 'butter-theme', 'nord-dark-theme', 'cyberpunk', 'almond-dark'];
this.themeIndex = this.getThemeIndex();
this.useSystemTheme = this.getUseSystemTheme();

30
src/index.scss
View file

@ -289,7 +289,8 @@
.dark-theme,
.butter-theme,
.nord-dark-theme,
.cyberpunk {
.cyberpunk,
.almond-dark {
@include dark-mode();
}
@ -372,6 +373,33 @@
--ic-surface-low: rgba(255, 251, 222, 64%);
}
.almond-dark {
/* background color | --bg-[background type]: value */
--bg-surface: hsl(0, 0%, 0%);
--bg-surface-transparent: hsla(0, 0%, 0%, 0);
--bg-surface-low: hsl(0, 0%, 1%);
--bg-surface-low-transparent: hsla(0, 0%, 0%, 0);
--bg-surface-extra-low: hsl(0, 0%, 2%);
--bg-surface-extra-low-transparent: hsla(0, 0%, 0%, 0);
--bg-badge: rgb(255, 251, 222, 90%);
--bg-positive: rgb(255, 251, 222, 90%);
--bg-positive-hover: rgba(255, 251, 222, 8%);
--bg-positive-active: rgba(255, 251, 222, 15%);
--bg-positive-border: rgba(255, 251, 222, 40%);
/* text color | --tc-[background type]-[priority]: value */
--tc-surface-high: rgb(255, 251, 222, 90%);
--tc-surface-normal: rgba(255, 251, 222, 90%);
--tc-surface-normal-low: rgba(255, 251, 222, 60%);
--tc-surface-low: rgba(255, 251, 222, 30%);
/* system icons | --ic-[background type]-[priority]: value */
--ic-surface-high: rgb(255, 251, 222, 90%);
--ic-surface-normal: rgba(255, 251, 222, 60%);
--ic-surface-low: rgba(255, 251, 222, 30%);
}
.font-primary {
font-family: var(--font-primary);