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

调整宽度, 调整tag

Browse Source
This commit is contained in:
wood chen 2025-03-10 16:42:51 +08:00
parent f04c220570
commit 7b5495997f
7 changed files with 119 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Footer.tsx
View File

@ -15,7 +15,7 @@ const Footer: React.FC = () => {
}) })
return ( return (
<footer className="mx-auto w-full max-w-screen-xl px-4 lg:px-0 pb-4 server-footer"> <footer className="mx-auto w-full max-w-6xl px-4 lg:px-0 pb-4 server-footer">
<section className="flex flex-col"> <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 server-footer-name"> <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"> <div className="flex items-center gap-1">

2
src/components/Header.tsx
View File

@ -76,7 +76,7 @@ function Header() {
const customBackgroundImage = backgroundImage const customBackgroundImage = backgroundImage
return ( return (
<div className="mx-auto w-full max-w-screen-xl"> <div className="mx-auto w-full max-w-6xl">
<section className="flex items-center justify-between header-top"> <section className="flex items-center justify-between header-top">
<section <section
onClick={() => { onClick={() => {

117
src/components/ServerCard.tsx
View File

@ -162,62 +162,66 @@ export default function ServerCard({ now, serverInfo }: { now: number; serverInf
</div> </div>
</section> </section>
{/* 服务器详细信息标签 */} {/* 服务器详细信息标签和 PlanInfo */}
{showServerDetails && ( <section className="flex items-center gap-1.5 w-full mt-1">
<section className="flex flex-wrap items-center gap-1 w-full mt-1"> {showServerDetails && (
{cpu_info && cpu_info.length > 0 && ( <>
<TooltipProvider> {cpu_info && cpu_info.length > 0 && (
<Tooltip> <TooltipProvider>
<TooltipTrigger asChild> <Tooltip>
<p className={cn("text-[9px] bg-blue-600 dark:bg-blue-800 text-blue-200 dark:text-blue-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> <TooltipTrigger asChild>
{cpu_info[0].includes("Physical") ? "物理CPU: " : "vCPU: "} <p className={cn("text-[10px] text-muted-foreground")}>
{cpu_info[0].match(/(\d+)\s+(?:Physical|Virtual)\s+Core/)?.[1] || "?"} {cpu_info[0].includes("Physical") ? "物理CPU: " : "vCPU: "}
</p> {cpu_info[0].match(/(\d+)\s+(?:Physical|Virtual)\s+Core/)?.[1] || "?"}
</TooltipTrigger> </p>
<TooltipContent className="text-xs"> </TooltipTrigger>
{cpu_info.join(", ")} <TooltipContent className="text-xs">
</TooltipContent> {cpu_info.join(", ")}
</Tooltip> </TooltipContent>
</TooltipProvider> </Tooltip>
)} </TooltipProvider>
)}
{mem_total > 0 && (
<p className={cn("text-[9px] bg-green-600 text-green-200 dark:bg-green-800 dark:text-green-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {mem_total > 0 && (
{t("serverCard.mem")}: {formatBytes(mem_total)} <p className={cn("text-[10px] text-muted-foreground")}>
</p> {t("serverCard.mem")}: {formatBytes(mem_total)}
)} </p>
)}
{disk_total > 0 && (
<p className={cn("text-[9px] bg-purple-600 text-purple-200 dark:bg-purple-800 dark:text-purple-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {disk_total > 0 && (
{t("serverCard.stg")}: {formatBytes(disk_total)} <p className={cn("text-[10px] text-muted-foreground")}>
</p> {t("serverCard.stg")}: {formatBytes(disk_total)}
)} </p>
)}
{tcp > 0 && (
<p className={cn("text-[9px] bg-pink-600 text-pink-200 dark:bg-pink-800 dark:text-pink-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {tcp > 0 && (
TCP: {tcp} <p className={cn("text-[10px] text-muted-foreground")}>
</p> TCP: {tcp}
)} </p>
)}
{udp > 0 && (
<p className={cn("text-[9px] bg-orange-600 text-orange-200 dark:bg-orange-800 dark:text-orange-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {udp > 0 && (
UDP: {udp} <p className={cn("text-[10px] text-muted-foreground")}>
</p> UDP: {udp}
)} </p>
)}
{process > 0 && (
<p className={cn("text-[9px] bg-yellow-600 text-yellow-200 dark:bg-yellow-800 dark:text-yellow-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {process > 0 && (
{t("serverDetailChart.process")}: {process} <p className={cn("text-[10px] text-muted-foreground")}>
</p> {t("serverDetailChart.process")}: {process}
)} </p>
)}
{uptime > 0 && (
<p className={cn("text-[9px] bg-stone-600 text-stone-200 dark:bg-stone-800 dark:text-stone-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {uptime > 0 && (
{t("serverCard.uptime")}: {formatUptime(uptime)} <p className={cn("text-[10px] text-muted-foreground")}>
</p> {t("serverCard.uptime")}: {formatUptime(uptime)}
)} </p>
</section> )}
)} </>
)}
{parsedData?.planDataMod && <PlanInfo parsedData={parsedData} />}
</section>
{showNetTransfer && ( {showNetTransfer && (
<section className={"flex items-center w-full justify-between gap-1"}> <section className={"flex items-center w-full justify-between gap-1"}>
@ -235,7 +239,6 @@ export default function ServerCard({ now, serverInfo }: { now: number; serverInf
</Badge> </Badge>
</section> </section>
)} )}
{parsedData?.planDataMod && <PlanInfo parsedData={parsedData} />}
</div> </div>
</Card> </Card>
) : ( ) : (

106
src/components/ServerCardInline.tsx
View File

@ -137,58 +137,60 @@ export default function ServerCardInline({ now, serverInfo }: { now: number; ser
</div> </div>
</section> </section>
{/* 服务器详细信息标签 */} {/* 服务器详细信息标签和 PlanInfo */}
{showServerDetails && ( <section className="flex items-center gap-1.5 w-full mt-1">
<section className="flex flex-wrap items-center gap-1 w-full mt-1"> {showServerDetails && (
{cpu_info && cpu_info.length > 0 && ( <>
<TooltipProvider> {cpu_info && cpu_info.length > 0 && (
<Tooltip> <TooltipProvider>
<TooltipTrigger asChild> <Tooltip>
<p className={cn("text-[9px] bg-blue-600 dark:bg-blue-800 text-blue-200 dark:text-blue-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> <TooltipTrigger asChild>
{cpu_info[0].includes("Physical") ? "物理CPU: " : "vCPU: "} <p className={cn("text-[10px] text-muted-foreground")}>
{cpu_info[0].match(/(\d+)\s+(?:Physical|Virtual)\s+Core/)?.[1] || "?"} {cpu_info[0].includes("Physical") ? "物理CPU: " : "vCPU: "}
</p> {cpu_info[0].match(/(\d+)\s+(?:Physical|Virtual)\s+Core/)?.[1] || "?"}
</TooltipTrigger> </p>
<TooltipContent className="text-xs"> </TooltipTrigger>
{cpu_info.join(", ")} <TooltipContent className="text-xs">
</TooltipContent> {cpu_info.join(", ")}
</Tooltip> </TooltipContent>
</TooltipProvider> </Tooltip>
)} </TooltipProvider>
)}
{mem_total > 0 && (
<p className={cn("text-[9px] bg-green-600 text-green-200 dark:bg-green-800 dark:text-green-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {mem_total > 0 && (
{t("serverCard.mem")}: {formatBytes(mem_total)} <p className={cn("text-[10px] text-muted-foreground")}>
</p> {t("serverCard.mem")}: {formatBytes(mem_total)}
)} </p>
)}
{disk_total > 0 && (
<p className={cn("text-[9px] bg-purple-600 text-purple-200 dark:bg-purple-800 dark:text-purple-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {disk_total > 0 && (
{t("serverCard.stg")}: {formatBytes(disk_total)} <p className={cn("text-[10px] text-muted-foreground")}>
</p> {t("serverCard.stg")}: {formatBytes(disk_total)}
)} </p>
)}
{tcp > 0 && (
<p className={cn("text-[9px] bg-pink-600 text-pink-200 dark:bg-pink-800 dark:text-pink-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {tcp > 0 && (
TCP: {tcp} <p className={cn("text-[10px] text-muted-foreground")}>
</p> TCP: {tcp}
)} </p>
)}
{udp > 0 && (
<p className={cn("text-[9px] bg-orange-600 text-orange-200 dark:bg-orange-800 dark:text-orange-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {udp > 0 && (
UDP: {udp} <p className={cn("text-[10px] text-muted-foreground")}>
</p> UDP: {udp}
)} </p>
)}
{process > 0 && (
<p className={cn("text-[9px] bg-yellow-600 text-yellow-200 dark:bg-yellow-800 dark:text-yellow-300 w-fit rounded-[5px] px-[3px] py-[1.5px]")}> {process > 0 && (
{t("serverDetailChart.process")}: {process} <p className={cn("text-[10px] text-muted-foreground")}>
</p> {t("serverDetailChart.process")}: {process}
)} </p>
</section> )}
)} </>
)}
{parsedData?.planDataMod && <PlanInfo parsedData={parsedData} />}
{parsedData?.planDataMod && <PlanInfo parsedData={parsedData} />}
</section>
</div> </div>
</Card> </Card>
</section> </section>

2
src/components/loading/ServerDetailLoading.tsx
View File

@ -22,7 +22,7 @@ export function ServerDetailLoading() {
const navigate = useNavigate() const navigate = useNavigate()
return ( return (
<div className="mx-auto w-full max-w-screen-xl px-0"> <div className="mx-auto w-full max-w-6xl px-0">
<div <div
onClick={() => { onClick={() => {
navigate("/") navigate("/")

2
src/pages/Server.tsx
View File

@ -211,7 +211,7 @@ export default function Servers() {
}) })
return ( return (
<div className="mx-auto w-full max-w-screen-xl px-0"> <div className="mx-auto w-full max-w-6xl px-0">
<ServerOverview <ServerOverview
total={totalServers} total={totalServers}
online={onlineServers} online={onlineServers}

2
src/pages/ServerDetail.tsx
View File

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