feat: OLED dark theme

This commit is contained in:
Danny Liu 2024-03-27 10:50:30 -07:00
parent 7d45d2762f
commit 976c714063
2 changed files with 13 additions and 5 deletions

View File

@ -97,6 +97,10 @@
themeToApply = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
}
if (themeToApply === 'dark') {
document.documentElement.style.setProperty('--color-gray-900', '#171717');
}
themes
.filter((e) => e !== themeToApply)
.forEach((e) => {
@ -113,10 +117,14 @@
};
const themeChangeHandler = (_theme: string) => {
theme.set(_theme);
localStorage.setItem('theme', _theme);
if (_theme === 'oled') {
document.documentElement.style.setProperty('--color-gray-900', '#000000');
} else {
theme.set(_theme);
localStorage.setItem('theme', _theme);
applyTheme(_theme);
applyTheme(_theme);
}
};
</script>
@ -139,6 +147,7 @@
<option value="light">☀️ {$i18n.t('Light')}</option>
<option value="rose-pine dark">🪻 {$i18n.t('Rosé Pine')}</option>
<option value="rose-pine-dawn light">🌷 {$i18n.t('Rosé Pine Dawn')}</option>
<option value="oled">🌌 {$i18n.t('OLED Dark')}</option>
</select>
</div>
</div>

View File

@ -16,8 +16,7 @@ export default {
700: '#4e4e4e',
800: '#333',
850: '#262626',
900: '#171717',
900: 'var(--color-gray-900, #171717)',
950: '#0d0d0d'
}
},