QT/sure
1
0
Fork 0
mirror of https://github.com/we-promise/sure.git synced 2026-04-19 03:54:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Check user's theme preference during page load (#156)

Browse Source
This commit is contained in:
Alessio Cappa
2025-09-23 15:43:36 +02:00
committed by GitHub
parent d2f631ec5c
commit 2716fad72c
3 changed files with 8 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/controllers/theme_controller.js
View File

@@ -42,8 +42,10 @@ export default class extends Controller {
// Sets or removes the data-theme attribute
setTheme(isDark) {
if (isDark) {
localStorage.theme = "dark";
document.documentElement.setAttribute("data-theme", "dark");
} else {
localStorage.theme = "light";
document.documentElement.setAttribute("data-theme", "light");
}
}

5
app/views/layouts/_dark_mode_check.html.erb Normal file
View File

@@ -0,0 +1,5 @@
<script>
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.setAttribute("data-theme", "dark");
}
</script>

1
app/views/layouts/shared/_head.html.erb
View File

@@ -10,6 +10,7 @@
<%= combobox_style_tag %>
<%= javascript_importmap_tags %>
<%= render "layouts/dark_mode_check" %>
<%= turbo_refreshes_with method: :morph, scroll: :preserve %>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover">