hazemKrimi/personal-website
1
0
Fork 0
mirror of https://github.com/hazemKrimi/personal-website.git synced 2026-05-01 18:00:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add theme colors update reminder

Browse Source
This commit is contained in:
Hazem Krimi
2021-09-04 23:43:22 +01:00
parent 0fcaeb2cda
commit b953d57203
2 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/Theme.tsx
+1
View File
@@ -2,6 +2,7 @@ import { FC } from 'react';
import { ThemeProvider, DefaultTheme } from 'styled-components'; import { ThemeProvider, DefaultTheme } from 'styled-components';
const Theme: FC = ({ children }) => { const Theme: FC = ({ children }) => {
// TODO: put theme colors in css custom properties and put common colors here.
const theme: DefaultTheme = { const theme: DefaultTheme = {
colors: { colors: {
dark: { dark: {
pages/_document.tsx
+3 -3
View File
@@ -46,7 +46,7 @@ class Doc extends Document {
<script <script
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: ` __html: `
function getInitialColorMode() { function getInitialTheme() {
const persistedColorPreference = window.localStorage.getItem('theme'); const persistedColorPreference = window.localStorage.getItem('theme');
const hasPersistedPreference = typeof persistedColorPreference === 'string'; const hasPersistedPreference = typeof persistedColorPreference === 'string';
@@ -65,10 +65,10 @@ class Doc extends Document {
} }
(() => { (() => {
const colorMode = getInitialColorMode(); const theme = getInitialTheme();
const root = document.documentElement; const root = document.documentElement;
root.style.setProperty('--theme', colorMode); root.style.setProperty('--theme', theme);
})(); })();
` `
}} }}