feat: implémenter système thèmes complet avec 14 thèmes prédéfinis (DEFAULT/GitHub/Linear/Spotify/Notion/Discord/Dracula/OneDark/TokyoNight/Nord/NightOwl/Anthracite/Cyberpunk/NavyElegance/Earthy), panel gestion thèmes dans tools.html avec grid previews et sélection interactive, synchronisation bidirectionnelle via bookmark shaarit_config (fetch/save JSON config), enforcement dark-only pour thèmes sans support light mode (disable toggle sidebar, auto-force dark), ajout data-theme-id attribute

This commit is contained in:
2026-04-20 10:51:48 -04:00
parent 861b3d347c
commit 404c036108
4 changed files with 860 additions and 3 deletions
+15 -2
View File
@@ -10,10 +10,22 @@
<!-- Prevent dark mode flash (FOUC) - must run before CSS loads -->
<script>
(function() {
var t = localStorage.getItem('theme') ||
var themeMode = localStorage.getItem('theme') ||
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
if (t === 'dark') {
var themeId = localStorage.getItem('shaarit_theme_id') || 'DEFAULT';
// Disable light mode for dark-only themes
var darkOnlyThemes = ['LINEAR', 'SPOTIFY', 'NOTION', 'DISCORD', 'DRACULA', 'ONE_DARK_PRO', 'TOKYO_NIGHT', 'NORD', 'NIGHT_OWL', 'ANTHRACITE', 'CYBERPUNK', 'NAVY_ELEGANCE', 'EARTHY'];
if (darkOnlyThemes.indexOf(themeId) !== -1) {
themeMode = 'dark';
}
if (themeMode === 'dark') {
document.documentElement.setAttribute('data-theme', 'dark');
}
document.documentElement.setAttribute('data-theme-id', themeId);
if (themeMode === 'dark') {
document.addEventListener('DOMContentLoaded', function() {
var mc = document.querySelector('meta[name="theme-color"]');
if (mc) mc.setAttribute('content', '#1e293b');
@@ -23,6 +35,7 @@
</script>
<!-- Professional Theme CSS -->
<link type="text/css" rel="stylesheet" href="{$base_path}/{function="ltrim($asset_path, '/')"}/css/themes.css?v=1.0.0" />
<link type="text/css" rel="stylesheet" href="{$base_path}/{function="ltrim($asset_path, '/')"}/css/style.css?v=1.0.4" />
<link type="text/css" rel="stylesheet" href="{$base_path}/{function="ltrim($asset_path, '/')"}/css/custom_views.css?v=1.0.5" />
{if="$pageName=='editlink' || $pageName=='addlink' || $pageName=='editlinkbatch'"}