Skip to content

Commit f2c549c

Browse files
committed
fix(Footer): 修复主页链接错误
style(ThemeToggle): 统一引号格式并添加屏幕阅读器提示 refactor(Header): 替换用户头像为本地SVG文件 chore: 添加用户头像SVG文件
1 parent 9709c11 commit f2c549c

File tree

4 files changed

+31
-25
lines changed

4 files changed

+31
-25
lines changed
Lines changed: 5 additions & 0 deletions
Loading

blog-web/src/components/Footer.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ const currentYear = new Date().getFullYear();
5050
</svg>
5151
Github@ExquisiteCore
5252
</a>
53-
<a href="#" class="link link-hover flex items-center gap-2">
53+
<a href="/" class="link link-hover flex items-center gap-2">
5454
<svg
5555
xmlns="http://www.w3.org/2000/svg"
5656
width="20"

blog-web/src/components/Header.astro

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -168,10 +168,7 @@ const getTabClass = (isActive: boolean) => {
168168
class="btn btn-ghost btn-circle avatar"
169169
>
170170
<div class="w-10 rounded-full">
171-
<img
172-
alt="用户头像"
173-
src="https://daisyui.com/images/stock/photo-1534528741775-53994a69daeb.jpg"
174-
/>
171+
<img alt="用户头像" src="/user-svgrepo-com.svg" />
175172
</div>
176173
</div>
177174
<ul

blog-web/src/components/solid/ThemeToggle.tsx

Lines changed: 24 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,45 +2,49 @@ import { createSignal, onMount } from "solid-js";
22

33
export default function ThemeToggle() {
44
const [isDarkMode, setIsDarkMode] = createSignal(false);
5-
5+
66
// Initialize theme based on localStorage or system preference
77
onMount(() => {
8-
if (typeof localStorage !== 'undefined') {
9-
const savedTheme = localStorage.getItem('theme');
10-
if (savedTheme === 'dark') {
8+
if (typeof localStorage !== "undefined") {
9+
const savedTheme = localStorage.getItem("theme");
10+
if (savedTheme === "dark") {
1111
setIsDarkMode(true);
12-
} else if (savedTheme === 'light') {
12+
} else if (savedTheme === "light") {
1313
setIsDarkMode(false);
1414
} else {
1515
// Check system preference if no saved preference
16-
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
16+
const prefersDark = window.matchMedia(
17+
"(prefers-color-scheme: dark)",
18+
).matches;
1719
setIsDarkMode(prefersDark);
18-
localStorage.setItem('theme', prefersDark ? 'dark' : 'light');
20+
localStorage.setItem("theme", prefersDark ? "dark" : "light");
1921
}
2022
}
2123
});
22-
24+
2325
// Handle theme toggle
2426
const toggleTheme = () => {
2527
const newTheme = !isDarkMode();
2628
setIsDarkMode(newTheme);
27-
29+
2830
// Update theme in localStorage and document
29-
const themeName = newTheme ? 'dark' : 'light';
30-
if (typeof localStorage !== 'undefined') {
31-
localStorage.setItem('theme', themeName);
31+
const themeName = newTheme ? "dark" : "light";
32+
if (typeof localStorage !== "undefined") {
33+
localStorage.setItem("theme", themeName);
3234
}
33-
document.documentElement.setAttribute('data-theme', themeName);
35+
document.documentElement.setAttribute("data-theme", themeName);
3436
};
35-
37+
3638
return (
3739
<label class="swap swap-rotate btn btn-ghost btn-circle">
38-
<input
39-
type="checkbox"
40-
class="theme-controller"
41-
checked={isDarkMode()}
42-
onChange={toggleTheme}
40+
<input
41+
type="checkbox"
42+
class="theme-controller"
43+
checked={isDarkMode()}
44+
onChange={toggleTheme}
4345
/>
46+
{/* 屏幕阅读器专用文本 */}
47+
<span class="sr-only">切换主题模式</span>
4448
{/* Sun icon */}
4549
<svg
4650
class="swap-on fill-current w-5 h-5"
@@ -59,4 +63,4 @@ export default function ThemeToggle() {
5963
</svg>
6064
</label>
6165
);
62-
}
66+
}

0 commit comments

Comments
 (0)