diff options
| author | Armand Philippot <git@armandphilippot.com> | 2023-10-27 18:07:45 +0200 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2023-11-11 18:15:27 +0100 |
| commit | 05f1dfc6896d3affa7c494a1b955f230d836a4b7 (patch) | |
| tree | 3089d5c3145f241293b88b9a1bfe4bb85e8ca9e0 /src/utils/helpers | |
| parent | 757201fdc5c04a3f15504f74bf8ab85bb6018c2b (diff) | |
feat: replace next-themes with a custom ThemeProvider
To be honest, next-themes was working fine. However since I use a theme
provider for Prism code blocks, some code is duplicated between this
app and the library. So I prefer to use a custom Provider without the
options I don't need.
Diffstat (limited to 'src/utils/helpers')
| -rw-r--r-- | src/utils/helpers/index.ts | 1 | ||||
| -rw-r--r-- | src/utils/helpers/themes.ts | 18 |
2 files changed, 19 insertions, 0 deletions
diff --git a/src/utils/helpers/index.ts b/src/utils/helpers/index.ts index b2a4534..14487e6 100644 --- a/src/utils/helpers/index.ts +++ b/src/utils/helpers/index.ts @@ -4,3 +4,4 @@ export * from './pages'; export * from './rss'; export * from './schema-org'; export * from './strings'; +export * from './themes'; diff --git a/src/utils/helpers/themes.ts b/src/utils/helpers/themes.ts new file mode 100644 index 0000000..8ef3a19 --- /dev/null +++ b/src/utils/helpers/themes.ts @@ -0,0 +1,18 @@ +/** + * Check if the user prefers dark color scheme. + * + * @returns {boolean|undefined} True if `prefers-color-scheme` is set to `dark`. + */ +export const prefersDarkScheme = (): boolean | undefined => { + if (typeof window === 'undefined') return undefined; + + return window.matchMedia('(prefers-color-scheme: dark)').matches; +}; + +/** + * Retrieve the theme to use depending on the user system theme. + */ +export const getThemeFromSystem = () => { + if (prefersDarkScheme()) return 'dark'; + return 'light'; +}; |
