wood/nezha-dash-v1
1
0
Fork 0
mirror of https://github.com/woodchen-ink/nezha-dash-v1.git synced 2025-07-18 09:31:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 添加部分节点语义化class

Browse Source
This commit is contained in:
Forget 2024-12-21 21:14:01 +08:00
parent 612a63be97
commit 15f6460b09
8 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Footer.tsx
View File

@ -14,9 +14,9 @@ const Footer: React.FC = () => {
})
return (
<footer className="mx-auto w-full max-w-5xl px-4 lg:px-0 pb-4">
<footer className="mx-auto w-full max-w-5xl px-4 lg:px-0 pb-4 server-footer">
<section className="flex flex-col">
<section className="mt-1 flex items-center sm:flex-row flex-col justify-between gap-2 text-[13px] font-light tracking-tight text-neutral-600/50 dark:text-neutral-300/50">
<section className="mt-1 flex items-center sm:flex-row flex-col justify-between gap-2 text-[13px] font-light tracking-tight text-neutral-600/50 dark:text-neutral-300/50 server-footer-name">
<div className="flex items-center gap-1">
&copy;2020-{new Date().getFullYear()}{" "}
<a href={"https://github.com/naiba/nezha"} target="_blank">
@ -24,7 +24,7 @@ const Footer: React.FC = () => {
</a>
<p>{settingData?.data?.version || ""}</p>
</div>
<p>
<p className="server-footer-theme">
{t("footer.themeBy")}
<a href={"https://github.com/hamster1963/nezha-dash"} target="_blank">
nezha-dash

8
src/components/Header.tsx
View File

@ -58,9 +58,9 @@ function Header() {
return (
<div className="mx-auto w-full max-w-5xl">
<section className="flex items-center justify-between">
<section className="flex items-center justify-between header-top">
<section onClick={() => navigate("/")} className="cursor-pointer flex items-center sm:text-base text-sm font-medium">
<div className="mr-1 flex flex-row items-center justify-start">
<div className="mr-1 flex flex-row items-center justify-start header-logo">
<img
width={40}
height={40}
@ -73,7 +73,7 @@ function Header() {
<Separator orientation="vertical" className="mx-2 hidden h-4 w-[1px] md:block" />
<p className="hidden text-sm font-medium opacity-40 md:block">{customDesc}</p>
</section>
<section className="flex items-center gap-2">
<section className="flex items-center gap-2 header-handles">
<div className="hidden sm:flex items-center gap-2">
<Links />
<DashboardLink />
@ -189,7 +189,7 @@ function Overview() {
setTimeString(DateTime.now().setLocale("en-US").toLocaleString(timeOption))
}, 1000)
return (
<section className={"mt-10 flex flex-col md:mt-16"}>
<section className={"mt-10 flex flex-col md:mt-16 header-timer"}>
<p className="text-base font-semibold">👋 {t("overview")}</p>
<div className="flex items-center gap-1.5">
<p className="text-sm font-medium opacity-50">{t("whereTheTimeIs")}</p>

2
src/components/ServerDetailChart.tsx
View File

@ -72,7 +72,7 @@ export default function ServerDetailChart({ server_id }: { server_id: string })
const gpuList = server.host.gpu || []
return (
<section className="grid md:grid-cols-2 lg:grid-cols-3 grid-cols-1 gap-3">
<section className="grid md:grid-cols-2 lg:grid-cols-3 grid-cols-1 gap-3 server-charts">
<CpuChart now={nezhaWsData.now} data={server} />
{gpuStats.length >= 1 && gpuList.length === gpuStats.length ? (
gpuList.map((gpu, index) => <GpuChart now={nezhaWsData.now} gpuStat={gpuStats[index]} gpuName={gpu} key={index} />)

2
src/components/ServerDetailOverview.tsx
View File

@ -67,7 +67,7 @@ export default function ServerDetailOverview({ server_id }: { server_id: string
>
<div
onClick={() => navigate("/")}
className="flex flex-none cursor-pointer font-semibold leading-none items-center break-all tracking-tight gap-1 text-xl"
className="flex flex-none cursor-pointer font-semibold leading-none items-center break-all tracking-tight gap-1 text-xl server-name"
>
<BackIcon />
{name}

2
src/components/ServerOverview.tsx
View File

@ -31,7 +31,7 @@ export default function ServerOverview({ online, offline, total, up, down, upSpe
return (
<>
<section className="grid grid-cols-2 gap-4 lg:grid-cols-4">
<section className="grid grid-cols-2 gap-4 lg:grid-cols-4 server-overview">
<Card
onClick={() => {
setStatus("all")

2
src/components/TabSwitch.tsx
View File

@ -8,7 +8,7 @@ export default function TabSwitch({ tabs, currentTab, setCurrentTab }: { tabs: s
// @ts-expect-error CustomBackgroundImage is a global variable
(window.CustomBackgroundImage as string) !== "" ? window.CustomBackgroundImage : undefined
return (
<div className="z-50 flex flex-col items-start rounded-[50px]">
<div className="z-50 flex flex-col items-start rounded-[50px] server-info-tab">
<div
className={cn("flex items-center gap-1 rounded-[50px] bg-stone-100 p-[3px] dark:bg-stone-800", {
"bg-stone-100/70 dark:bg-stone-800/70": customBackgroundImage,

6
src/pages/Server.tsx
View File

@ -190,7 +190,7 @@ export default function Servers() {
upSpeed={upSpeed}
downSpeed={downSpeed}
/>
<div className="flex mt-6 items-center justify-between gap-2">
<div className="flex mt-6 items-center justify-between gap-2 server-overview-controls">
<section className="flex items-center gap-2 w-full overflow-hidden">
<button
onClick={() => {
@ -315,14 +315,14 @@ export default function Servers() {
{showMap === "1" && <GlobalMap now={nezhaWsData.now} serverList={nezhaWsData?.servers || []} />}
{showServices === "1" && <ServiceTracker />}
{inline === "1" && (
<section className="flex flex-col gap-2 overflow-x-scroll scrollbar-hidden mt-6">
<section className="flex flex-col gap-2 overflow-x-scroll scrollbar-hidden mt-6 server-inline-list">
{filteredServers.map((serverInfo) => (
<ServerCardInline now={nezhaWsData.now} key={serverInfo.id} serverInfo={serverInfo} />
))}
</section>
)}
{inline === "0" && (
<section className="grid grid-cols-1 gap-2 md:grid-cols-2 mt-6">
<section className="grid grid-cols-1 gap-2 md:grid-cols-2 mt-6 server-card-list">
{filteredServers.map((serverInfo) => (
<ServerCard now={nezhaWsData.now} key={serverInfo.id} serverInfo={serverInfo} />
))}

2
src/pages/ServerDetail.tsx
View File

@ -24,7 +24,7 @@ export default function ServerDetail() {
}
return (
<div className="mx-auto w-full max-w-5xl px-0 flex flex-col gap-4">
<div className="mx-auto w-full max-w-5xl px-0 flex flex-col gap-4 server-info">
<ServerDetailOverview server_id={server_id} />
<section className="flex items-center my-2 w-full">
<Separator className="flex-1" />