优化首页图标,用 lucide-react 代替了蓝牙模块的图标

This commit is contained in:
eafonyang
2026-07-03 11:11:13 +08:00
parent 0ead88deee
commit 0d64495ebd
11 changed files with 182 additions and 107 deletions
+16 -18
View File
@@ -33,14 +33,18 @@ import {
ChevronRight,
Power,
Settings,
Settings2,
Sliders,
Activity,
Gauge,
Undo2,
ChevronDown,
Wifi,
Bluetooth,
SkipBack,
SkipForward,
Play,
Pause,
SquareArrowRightEnter,
SquareArrowRightExit,
FileMusic,
} from "lucide-react";
import { useLocation } from "wouter";
import { useRef, useState, useEffect, useCallback, useMemo } from "react";
@@ -839,25 +843,19 @@ export default function Home() {
onClick={() => updateSetting({ bt_next: 0 })}
className="w-10 h-10 rounded-full flex items-center justify-center transition-all active:scale-95"
style={{ background: "rgba(0,255,246,0.15)", border: "1px solid rgba(0,255,246,0.3)" }}>
<img src={`${import.meta.env.BASE_URL}images/player/skip-forward.png`} alt="上一首" className="w-5 h-5" />
<SkipBack size={20} className="text-[#00FFF6]" />
</button>
<button
onClick={() => updateSetting({ bt_play: 1 })}
className="w-12 h-12 rounded-full flex items-center justify-center transition-all active:scale-95"
style={{ background: "transparent", border: "1px solid rgba(0,255,246,0.5)", boxShadow: "0 0 12px rgba(0,255,246,0.4)" }}>
<img
src={ds.bt_status === 1
? `${import.meta.env.BASE_URL}images/player/play.png`
: `${import.meta.env.BASE_URL}images/player/pause.png`}
alt={ds.bt_status === 1 ? "播放" : "暂停"}
className="w-6 h-6"
/>
{ds.bt_status === 1 ? <Play size={28} className="text-[#00FFF6]" /> : <Pause size={28} className="text-[#00FFF6]" />}
</button>
<button
onClick={() => updateSetting({ bt_next: 1 })}
className="w-10 h-10 rounded-full flex items-center justify-center transition-all active:scale-95"
style={{ background: "rgba(0,255,246,0.15)", border: "1px solid rgba(0,255,246,0.3)" }}>
<img src={`${import.meta.env.BASE_URL}images/player/skip-back.png`} alt="下一首" className="w-5 h-5" />
<SkipForward size={20} className="text-[#00FFF6]" />
</button>
</div>
</div>
@@ -933,36 +931,36 @@ export default function Home() {
<div className="px-4">
<div className="ios-list-group">
<ListRow
icon={<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" className="w-4 h-4"><path d="M9 3H5a2 2 0 0 0-2 2v4m6-6h10a2 2 0 0 1 2 2v4M9 3v18m0 0h10a2 2 0 0 0 2-2V9M9 21H5a2 2 0 0 1-2-2V9m0 0h18"/></svg>}
icon={<SquareArrowRightEnter size={18} />}
label={homeText.input ?? "输入源"}
value={inputLabel}
onClick={() => setLocation("/io")}
/>
<ListRow
icon={<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" className="w-4 h-4"><path d="M15 3H9a2 2 0 0 0-2 2v4m8-6h4a2 2 0 0 1 2 2v4M15 3v18m0 0H9a2 2 0 0 1-2-2V9m8 12h4a2 2 0 0 0 2-2V9M7 9H3"/></svg>}
icon={<SquareArrowRightExit size={18} />}
label={homeText.output ?? "输出端口"}
value={outputLabel}
onClick={() => setLocation("/io")}
/>
<ListRow
icon={<Settings size={16} />}
icon={<FileMusic size={18} />}
label={homeText.audioSet ?? "音频设置"}
onClick={() => setLocation("/audio")}
/>
<ListRow
icon={<Settings2 size={16} />}
icon={<Settings size={18} />}
label={homeText.systemSet ?? "系统设置"}
onClick={() => setLocation("/system")}
/>
<ListRow
icon={<Gauge size={16} />}
icon={<Gauge size={18} />}
label={homeText.vu ?? "VU表"}
value={vuLabel}
thumbnail={`${import.meta.env.BASE_URL}images/vu/vu${(ds.vu ?? 0) + 1}.png`}
onClick={() => setLocation("/vu")}
/>
<ListRow
icon={<Undo2 size={16} />}
icon={<Undo2 size={18} />}
label={homeText.backToLegacy ?? "返回旧版"}
onClick={() => {
const target = ip.trim();