GithubBackup/bili-sync
1
0
Fork 0
mirror of https://github.com/amtoaer/bili-sync.git synced 2026-09-06 16:07:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 支持深色主题 (#557)

Browse Source
This commit is contained in:
ᴀᴍᴛᴏᴀᴇʀ
2025-12-06 01:44:13 +08:00
committed by GitHub
parent 6391aa67c0
commit 930660045f
5 changed files with 40 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/bun.lock
+3 -2
View File
@@ -1,5 +1,6 @@
{ {
"lockfileVersion": 1, "lockfileVersion": 1,
"configVersion": 0,
"workspaces": { "workspaces": {
"": { "": {
"name": "my-app", "name": "my-app",
@@ -23,7 +24,7 @@
"eslint-plugin-svelte": "^3.0.0", "eslint-plugin-svelte": "^3.0.0",
"globals": "^16.0.0", "globals": "^16.0.0",
"layerchart": "2.0.0-next.27", "layerchart": "2.0.0-next.27",
"mode-watcher": "^1.0.6", "mode-watcher": "^1.1.0",
"prettier": "^3.4.2", "prettier": "^3.4.2",
"prettier-plugin-svelte": "^3.3.3", "prettier-plugin-svelte": "^3.3.3",
"prettier-plugin-tailwindcss": "^0.6.11", "prettier-plugin-tailwindcss": "^0.6.11",
@@ -553,7 +554,7 @@
"mkdirp": ["mkdirp@3.0.1", "", { "bin": { "mkdirp": "dist/cjs/src/bin.js" } }, "sha512-+NsyUUAZDmo6YVHzL/stxSu3t9YS1iljliy3BSDrXJ/dkn1KYdmtZODGGjLcc9XLgVVpH4KshHB8XmZgMhaBXg=="], "mkdirp": ["mkdirp@3.0.1", "", { "bin": { "mkdirp": "dist/cjs/src/bin.js" } }, "sha512-+NsyUUAZDmo6YVHzL/stxSu3t9YS1iljliy3BSDrXJ/dkn1KYdmtZODGGjLcc9XLgVVpH4KshHB8XmZgMhaBXg=="],
"mode-watcher": ["mode-watcher@1.0.7", "", { "dependencies": { "runed": "^0.25.0", "svelte-toolbelt": "^0.7.1" }, "peerDependencies": { "svelte": "^5.27.0" } }, "sha512-ZGA7ZGdOvBJeTQkzdBOnXSgTkO6U6iIFWJoyGCTt6oHNg9XP9NBvS26De+V4W2aqI+B0yYXUskFG2VnEo3zyMQ=="], "mode-watcher": ["mode-watcher@1.1.0", "", { "dependencies": { "runed": "^0.25.0", "svelte-toolbelt": "^0.7.1" }, "peerDependencies": { "svelte": "^5.27.0" } }, "sha512-mUT9RRGPDYenk59qJauN1rhsIMKBmWA3xMF+uRwE8MW/tjhaDSCCARqkSuDTq8vr4/2KcAxIGVjACxTjdk5C3g=="],
"mri": ["mri@1.2.0", "", {}, "sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA=="], "mri": ["mri@1.2.0", "", {}, "sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA=="],
web/package.json
+1 -1
View File
@@ -21,7 +21,7 @@
"eslint-plugin-svelte": "^3.0.0", "eslint-plugin-svelte": "^3.0.0",
"globals": "^16.0.0", "globals": "^16.0.0",
"layerchart": "2.0.0-next.27", "layerchart": "2.0.0-next.27",
"mode-watcher": "^1.0.6", "mode-watcher": "^1.1.0",
"prettier": "^3.4.2", "prettier": "^3.4.2",
"prettier-plugin-svelte": "^3.3.3", "prettier-plugin-svelte": "^3.3.3",
"prettier-plugin-tailwindcss": "^0.6.11", "prettier-plugin-tailwindcss": "^0.6.11",
web/src/app.html
+16
View File
@@ -5,6 +5,22 @@
<link rel="icon" href="%sveltekit.assets%/favicon.png" /> <link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="referrer" content="no-referrer" /> <meta name="referrer" content="no-referrer" />
<script>
(function () {
function getThemePreference() {
const saved = localStorage.getItem('mode-watcher-mode');
if (saved && (saved === 'light' || saved === 'dark')) {
return saved;
}
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
}
const theme = getThemePreference();
if (theme === 'dark') {
document.documentElement.classList.add('dark');
}
document.documentElement.style.colorScheme = theme;
})();
</script>
%sveltekit.head% %sveltekit.head%
</head> </head>
<body data-sveltekit-preload-data="hover"> <body data-sveltekit-preload-data="hover">
web/src/lib/components/app-sidebar.svelte
+18
View File
@@ -8,7 +8,9 @@
import UserIcon from '@lucide/svelte/icons/user'; import UserIcon from '@lucide/svelte/icons/user';
import Settings2Icon from '@lucide/svelte/icons/settings-2'; import Settings2Icon from '@lucide/svelte/icons/settings-2';
import SquareTerminalIcon from '@lucide/svelte/icons/square-terminal'; import SquareTerminalIcon from '@lucide/svelte/icons/square-terminal';
import PaletteIcon from '@lucide/svelte/icons/palette';
import * as Sidebar from '$lib/components/ui/sidebar/index.js'; import * as Sidebar from '$lib/components/ui/sidebar/index.js';
import { mode, toggleMode } from 'mode-watcher';
import type { ComponentProps } from 'svelte'; import type { ComponentProps } from 'svelte';
let sidebar = Sidebar.useSidebar(); let sidebar = Sidebar.useSidebar();
@@ -136,6 +138,22 @@
<Sidebar.Footer> <Sidebar.Footer>
<Sidebar.Separator /> <Sidebar.Separator />
<Sidebar.Menu> <Sidebar.Menu>
<Sidebar.MenuItem>
<Sidebar.MenuButton class="h-8">
{#snippet child({ props })}
<button
{...props}
onclick={() => {
toggleMode();
closeMobileSidebar();
}}
>
<PaletteIcon class="size-4" />
<span class="text-sm">{mode.current === 'light' ? '亮色' : '暗色'}</span>
</button>
{/snippet}
</Sidebar.MenuButton>
</Sidebar.MenuItem>
{#each data.footer as item (item.title)} {#each data.footer as item (item.title)}
<Sidebar.MenuItem> <Sidebar.MenuItem>
<Sidebar.MenuButton class="h-8"> <Sidebar.MenuButton class="h-8">
web/src/routes/+layout.svelte
+2
View File
@@ -6,8 +6,10 @@
import { breadcrumbStore } from '$lib/stores/breadcrumb'; import { breadcrumbStore } from '$lib/stores/breadcrumb';
import * as Sidebar from '$lib/components/ui/sidebar/index.js'; import * as Sidebar from '$lib/components/ui/sidebar/index.js';
import { Toaster } from '$lib/components/ui/sonner/index.js'; import { Toaster } from '$lib/components/ui/sonner/index.js';
import { ModeWatcher } from 'mode-watcher';
</script> </script>
<ModeWatcher disableHeadScriptInjection />
<Toaster /> <Toaster />
<Sidebar.Provider> <Sidebar.Provider>
<AppSidebar /> <AppSidebar />