fix(plugin): replace raw buttons with ButtonItem for controller navigation

This commit is contained in:
2026-06-28 17:26:20 +08:00
parent b7f9df8439
commit 5a6211ebea
+15 -28
View File
@@ -2,6 +2,7 @@ import { useState, useEffect, useRef } from "react"
import { import {
PanelSection, PanelSection,
PanelSectionRow, PanelSectionRow,
ButtonItem,
staticClasses, staticClasses,
} from "@decky/ui" } from "@decky/ui"
import { import {
@@ -144,38 +145,24 @@ function Content() {
return ( return (
<> <>
{/* ── Tab navigation ──────────────────────────────────────── */} {/* ── Tab navigation ──────────────────────────────────────── */}
<PanelSectionRow> <PanelSection title="DeckyVault">
<div style={{ display: "flex", gap: "0", marginBottom: "8px" }}> <PanelSectionRow>
<button <ButtonItem
layout="below"
onClick={() => setActiveTab("main")} onClick={() => setActiveTab("main")}
style={{
flex: 1,
padding: "8px",
background: activeTab === "main" ? "rgba(255,255,255,0.15)" : "transparent",
border: "none",
color: activeTab === "main" ? "#fff" : "rgba(255,255,255,0.5)",
cursor: "pointer",
borderRadius: "4px 0 0 4px",
}}
> >
Record {activeTab === "main" ? "▶ Record" : "Record"}
</button> </ButtonItem>
<button </PanelSectionRow>
<PanelSectionRow>
<ButtonItem
layout="below"
onClick={() => setActiveTab("settings")} onClick={() => setActiveTab("settings")}
style={{
flex: 1,
padding: "8px",
background: activeTab === "settings" ? "rgba(255,255,255,0.15)" : "transparent",
border: "none",
color: activeTab === "settings" ? "#fff" : "rgba(255,255,255,0.5)",
cursor: "pointer",
borderRadius: "0 4px 4px 0",
}}
> >
Settings {activeTab === "settings" ? "▶ Settings" : "Settings"}
</button> </ButtonItem>
</div> </PanelSectionRow>
</PanelSectionRow> </PanelSection>
{activeTab === "main" ? ( {activeTab === "main" ? (
<MainPanel <MainPanel