added cyberpunk theme

This commit is contained in:
array-in-a-matrix 2023-03-20 15:18:35 -04:00
parent a4e0f7a2c8
commit aa53e37f6f
3 changed files with 27 additions and 2 deletions

View file

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

View file

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

View file

@ -288,7 +288,8 @@
.dark-theme,
.butter-theme,
.nord-dark-theme {
.nord-dark-theme,
.cyberpunk {
@include dark-mode();
}
@ -344,6 +345,29 @@
--ic-surface-low: rgba(216, 222, 233, 64%);
}
.cyberpunk {
/* 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%, 0%);
--bg-surface-low-transparent: hsla(0, 0%, 0%, 0);
--bg-surface-extra-low: hsl(58, 98%, 49%);
--bg-surface-extra-low-transparent: hsla(0, 0%, 0%, 0);
--bg-badge: hsl(346, 100%, 50%);
/* text color | --tc-[background type]-[priority]: value */
--tc-surface-high: rgb(249, 240, 2, 94%);
--tc-surface-normal: rgba(255, 251, 222, 94%);
--tc-surface-normal-low: rgba(255, 251, 222, 94%);
--tc-surface-low: rgba(255, 251, 222, 58%);
/* system icons | --ic-[background type]-[priority]: value */
--ic-surface-high: rgb(255, 251, 222);
--ic-surface-normal: rgba(255, 251, 222, 84%);
--ic-surface-low: rgba(255, 251, 222, 64%);
}
.font-primary {
font-family: var(--font-primary);