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

fix: opacity on dark mode

Browse Source
This commit is contained in:
hamster1963 2024-12-20 23:32:52 +08:00
parent 799a16f42a
commit b2998752a6
13 changed files with 27 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/CycleTransferStatsClient.tsx
View File

@ -31,7 +31,7 @@ export const CycleTransferStatsClient: React.FC<CycleTransferStatsClientProps> =
"w-full bg-white px-4 py-3 rounded-lg border bg-card text-card-foreground shadow-lg shadow-neutral-200/40 dark:shadow-none space-y-2", "w-full bg-white px-4 py-3 rounded-lg border bg-card text-card-foreground shadow-lg shadow-neutral-200/40 dark:shadow-none space-y-2",
className, className,
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
)} )}
> >

2
src/components/GroupSwitch.tsx
View File

@ -17,7 +17,7 @@ export default function GroupSwitch({
<div className="scrollbar-hidden z-50 flex flex-col items-start overflow-x-scroll rounded-[50px]"> <div className="scrollbar-hidden z-50 flex flex-col items-start overflow-x-scroll rounded-[50px]">
<div <div
className={cn("flex items-center gap-1 rounded-[50px] bg-stone-100 p-[3px] dark:bg-stone-800", { className={cn("flex items-center gap-1 rounded-[50px] bg-stone-100 p-[3px] dark:bg-stone-800", {
"bg-stone-100/80 dark:bg-stone-800/80": customBackgroundImage, "bg-stone-100/70 dark:bg-stone-800/70": customBackgroundImage,
})} })}
> >
{tabs.map((tab: string) => ( {tabs.map((tab: string) => (

2
src/components/LanguageSwitcher.tsx
View File

@ -33,7 +33,7 @@ export function LanguageSwitcher() {
variant="outline" variant="outline"
size="sm" size="sm"
className={cn("rounded-full px-[9px] bg-white dark:bg-black", { className={cn("rounded-full px-[9px] bg-white dark:bg-black", {
"bg-white/80 dark:bg-black/80": customBackgroundImage, "bg-white/70 dark:bg-black/70": customBackgroundImage,
})} })}
> >
{localeItems.find((item) => item.code === locale)?.name} {localeItems.find((item) => item.code === locale)?.name}

2
src/components/NetworkChart.tsx
View File

@ -242,7 +242,7 @@ export const NetworkChartClient = React.memo(function NetworkChart({
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardHeader className="flex flex-col items-stretch space-y-0 p-0 sm:flex-row"> <CardHeader className="flex flex-col items-stretch space-y-0 p-0 sm:flex-row">

4
src/components/ServerCard.tsx
View File

@ -43,7 +43,7 @@ export default function ServerCard({ now, serverInfo }: { now: number; serverInf
"lg:flex-row": !fixedTopServerName, "lg:flex-row": !fixedTopServerName,
}, },
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
)} )}
onClick={() => navigate(`/server/${serverInfo.id}`)} onClick={() => navigate(`/server/${serverInfo.id}`)}
@ -141,7 +141,7 @@ export default function ServerCard({ now, serverInfo }: { now: number; serverInf
"lg:flex-row": !fixedTopServerName, "lg:flex-row": !fixedTopServerName,
}, },
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
)} )}
onClick={() => navigate(`/server/${serverInfo.id}`, { replace: true })} onClick={() => navigate(`/server/${serverInfo.id}`, { replace: true })}

4
src/components/ServerCardInline.tsx
View File

@ -34,7 +34,7 @@ export default function ServerCardInline({ now, serverInfo }: { now: number; ser
className={cn( className={cn(
"flex items-center lg:flex-row justify-start gap-3 p-3 md:px-5 cursor-pointer hover:bg-accent/50 transition-colors min-w-[900px] w-full", "flex items-center lg:flex-row justify-start gap-3 p-3 md:px-5 cursor-pointer hover:bg-accent/50 transition-colors min-w-[900px] w-full",
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
)} )}
onClick={() => navigate(`/server/${serverInfo.id}`)} onClick={() => navigate(`/server/${serverInfo.id}`)}
@ -118,7 +118,7 @@ export default function ServerCardInline({ now, serverInfo }: { now: number; ser
className={cn( className={cn(
"flex min-h-[61px] min-w-[900px] items-center justify-start p-3 md:px-5 flex-row cursor-pointer hover:bg-accent/50 transition-colors", "flex min-h-[61px] min-w-[900px] items-center justify-start p-3 md:px-5 flex-row cursor-pointer hover:bg-accent/50 transition-colors",
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
)} )}
onClick={() => navigate(`/server/${serverInfo.id}`)} onClick={() => navigate(`/server/${serverInfo.id}`)}

14
src/components/ServerDetailChart.tsx
View File

@ -125,7 +125,7 @@ function GpuChart({ now, gpuStat, gpuName }: { now: number; gpuStat: number; gpu
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">
@ -207,7 +207,7 @@ function CpuChart({ now, data }: { now: number; data: NezhaServer }) {
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">
@ -287,7 +287,7 @@ function ProcessChart({ now, data }: { now: number; data: NezhaServer }) {
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">
@ -376,7 +376,7 @@ function MemChart({ now, data }: { now: number; data: NezhaServer }) {
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">
@ -489,7 +489,7 @@ function DiskChart({ now, data }: { now: number; data: NezhaServer }) {
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">
@ -583,7 +583,7 @@ function NetworkChart({ now, data }: { now: number; data: NezhaServer }) {
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">
@ -691,7 +691,7 @@ function ConnectChart({ now, data }: { now: number; data: NezhaServer }) {
return ( return (
<Card <Card
className={cn({ className={cn({
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">

2
src/components/ServerDetailOverview.tsx
View File

@ -62,7 +62,7 @@ export default function ServerDetailOverview({ server_id }: { server_id: string
return ( return (
<div <div
className={cn({ className={cn({
"bg-card/80 p-4 rounded-[10px]": customBackgroundImage, "bg-card/70 p-4 rounded-[10px]": customBackgroundImage,
})} })}
> >
<div <div

8
src/components/ServerOverview.tsx
View File

@ -37,7 +37,7 @@ export default function ServerOverview({ online, offline, total, up, down, upSpe
setStatus("all") setStatus("all")
}} }}
className={cn("hover:border-blue-500 cursor-pointer transition-all", { className={cn("hover:border-blue-500 cursor-pointer transition-all", {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="flex h-full items-center px-6 py-3"> <CardContent className="flex h-full items-center px-6 py-3">
@ -59,7 +59,7 @@ export default function ServerOverview({ online, offline, total, up, down, upSpe
className={cn( className={cn(
"cursor-pointer hover:ring-green-500 ring-1 ring-transparent transition-all", "cursor-pointer hover:ring-green-500 ring-1 ring-transparent transition-all",
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
{ {
"ring-green-500 ring-2 border-transparent": status === "online", "ring-green-500 ring-2 border-transparent": status === "online",
@ -87,7 +87,7 @@ export default function ServerOverview({ online, offline, total, up, down, upSpe
className={cn( className={cn(
"cursor-pointer hover:ring-red-500 ring-1 ring-transparent transition-all", "cursor-pointer hover:ring-red-500 ring-1 ring-transparent transition-all",
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
{ {
"ring-red-500 ring-2 border-transparent": status === "offline", "ring-red-500 ring-2 border-transparent": status === "offline",
@ -109,7 +109,7 @@ export default function ServerOverview({ online, offline, total, up, down, upSpe
</Card> </Card>
<Card <Card
className={cn("hover:ring-purple-500 ring-1 ring-transparent transition-all", { className={cn("hover:ring-purple-500 ring-1 ring-transparent transition-all", {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
})} })}
> >
<CardContent className="flex h-full items-center relative px-6 py-3"> <CardContent className="flex h-full items-center relative px-6 py-3">

2
src/components/ServiceTrackerClient.tsx
View File

@ -26,7 +26,7 @@ export const ServiceTrackerClient: React.FC<ServiceTrackerProps> = ({ days, clas
"w-full space-y-3 bg-white px-4 py-4 rounded-lg border bg-card text-card-foreground shadow-lg shadow-neutral-200/40 dark:shadow-none", "w-full space-y-3 bg-white px-4 py-4 rounded-lg border bg-card text-card-foreground shadow-lg shadow-neutral-200/40 dark:shadow-none",
className, className,
{ {
"bg-card/80": customBackgroundImage, "bg-card/70": customBackgroundImage,
}, },
)} )}
> >

2
src/components/TabSwitch.tsx
View File

@ -11,7 +11,7 @@ export default function TabSwitch({ tabs, currentTab, setCurrentTab }: { tabs: s
<div className="z-50 flex flex-col items-start rounded-[50px]"> <div className="z-50 flex flex-col items-start rounded-[50px]">
<div <div
className={cn("flex items-center gap-1 rounded-[50px] bg-stone-100 p-[3px] dark:bg-stone-800", { className={cn("flex items-center gap-1 rounded-[50px] bg-stone-100 p-[3px] dark:bg-stone-800", {
"bg-stone-100/80 dark:bg-stone-800/80": customBackgroundImage, "bg-stone-100/70 dark:bg-stone-800/70": customBackgroundImage,
})} })}
> >
{tabs.map((tab: string) => ( {tabs.map((tab: string) => (

2
src/components/ThemeSwitcher.tsx
View File

@ -28,7 +28,7 @@ export function ModeToggle() {
variant="outline" variant="outline"
size="sm" size="sm"
className={cn("rounded-full px-[9px] bg-white dark:bg-black", { className={cn("rounded-full px-[9px] bg-white dark:bg-black", {
"bg-white/80 dark:bg-black/80": customBackgroundImage, "bg-white/70 dark:bg-black/70": customBackgroundImage,
})} })}
> >
<Sun className="h-4 w-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" /> <Sun className="h-4 w-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />

8
src/pages/Server.tsx
View File

@ -202,7 +202,7 @@ export default function Servers() {
"shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-500": showMap === "1", "shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-500": showMap === "1",
}, },
{ {
"bg-opacity-80": customBackgroundImage, "bg-opacity-70": customBackgroundImage,
}, },
)} )}
> >
@ -219,7 +219,7 @@ export default function Servers() {
"shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-500": showServices === "1", "shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-500": showServices === "1",
}, },
{ {
"bg-opacity-80": customBackgroundImage, "bg-opacity-70": customBackgroundImage,
}, },
)} )}
> >
@ -236,7 +236,7 @@ export default function Servers() {
"shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-500": inline === "1", "shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-500": inline === "1",
}, },
{ {
"bg-opacity-80": customBackgroundImage, "bg-opacity-70": customBackgroundImage,
}, },
)} )}
> >
@ -253,7 +253,7 @@ export default function Servers() {
"shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] dark:bg-stone-700 bg-stone-200": settingsOpen, "shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] dark:bg-stone-700 bg-stone-200": settingsOpen,
}, },
{ {
"dark:bg-stone-800/80 bg-stone-100/80 ": customBackgroundImage, "dark:bg-stone-800/70 bg-stone-100/70 ": customBackgroundImage,
}, },
)} )}
> >