mirror of
https://github.com/woodchen-ink/nezha-dash-v1.git
synced 2025-07-18 17:41:56 +08:00
fix: image z-index
This commit is contained in:
parent
941406acbe
commit
c3668402d5
@ -1,5 +1,4 @@
|
|||||||
import { Card, CardContent } from "@/components/ui/card"
|
import { Card, CardContent } from "@/components/ui/card"
|
||||||
import useFilter from "@/hooks/use-filter"
|
|
||||||
import { useStatus } from "@/hooks/use-status"
|
import { useStatus } from "@/hooks/use-status"
|
||||||
import { formatBytes } from "@/lib/format"
|
import { formatBytes } from "@/lib/format"
|
||||||
import { cn } from "@/lib/utils"
|
import { cn } from "@/lib/utils"
|
||||||
@ -27,7 +26,6 @@ export default function ServerOverview({
|
|||||||
}: ServerOverviewProps) {
|
}: ServerOverviewProps) {
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
const { status, setStatus } = useStatus()
|
const { status, setStatus } = useStatus()
|
||||||
const { filter, setFilter } = useFilter()
|
|
||||||
|
|
||||||
// @ts-expect-error DisableAnimatedMan is a global variable
|
// @ts-expect-error DisableAnimatedMan is a global variable
|
||||||
const disableAnimatedMan = window.DisableAnimatedMan === "true"
|
const disableAnimatedMan = window.DisableAnimatedMan === "true"
|
||||||
@ -37,7 +35,6 @@ export default function ServerOverview({
|
|||||||
<section className="grid grid-cols-2 gap-4 lg:grid-cols-4">
|
<section className="grid grid-cols-2 gap-4 lg:grid-cols-4">
|
||||||
<Card
|
<Card
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setFilter(false)
|
|
||||||
setStatus("all")
|
setStatus("all")
|
||||||
}}
|
}}
|
||||||
className={cn("hover:border-blue-500 cursor-pointer transition-all")}
|
className={cn("hover:border-blue-500 cursor-pointer transition-all")}
|
||||||
@ -56,7 +53,6 @@ export default function ServerOverview({
|
|||||||
</Card>
|
</Card>
|
||||||
<Card
|
<Card
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setFilter(false)
|
|
||||||
setStatus("online")
|
setStatus("online")
|
||||||
}}
|
}}
|
||||||
className={cn(
|
className={cn(
|
||||||
@ -84,7 +80,6 @@ export default function ServerOverview({
|
|||||||
</Card>
|
</Card>
|
||||||
<Card
|
<Card
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setFilter(false)
|
|
||||||
setStatus("offline")
|
setStatus("offline")
|
||||||
}}
|
}}
|
||||||
className={cn(
|
className={cn(
|
||||||
@ -110,15 +105,8 @@ export default function ServerOverview({
|
|||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
<Card
|
<Card
|
||||||
onClick={() => {
|
|
||||||
setStatus("all")
|
|
||||||
setFilter(true)
|
|
||||||
}}
|
|
||||||
className={cn(
|
className={cn(
|
||||||
"cursor-pointer hover:ring-purple-500 ring-1 ring-transparent transition-all",
|
"hover:ring-purple-500 ring-1 ring-transparent transition-all",
|
||||||
{
|
|
||||||
"ring-purple-500 ring-2 border-transparent": filter === true,
|
|
||||||
},
|
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<CardContent className="flex h-full items-center relative px-6 py-3">
|
<CardContent className="flex h-full items-center relative px-6 py-3">
|
||||||
@ -126,7 +114,7 @@ export default function ServerOverview({
|
|||||||
<div className="flex items-center w-full justify-between">
|
<div className="flex items-center w-full justify-between">
|
||||||
<p className="text-sm font-medium md:text-base">{t("serverOverview.network")}</p>
|
<p className="text-sm font-medium md:text-base">{t("serverOverview.network")}</p>
|
||||||
</div>
|
</div>
|
||||||
<section className="flex items-start flex-row z-[999] pr-0 gap-1">
|
<section className="flex items-start flex-row z-10 pr-0 gap-1">
|
||||||
<p className="sm:text-[12px] text-[10px] text-blue-800 dark:text-blue-400 text-nowrap font-medium">
|
<p className="sm:text-[12px] text-[10px] text-blue-800 dark:text-blue-400 text-nowrap font-medium">
|
||||||
↑{formatBytes(up)}
|
↑{formatBytes(up)}
|
||||||
</p>
|
</p>
|
||||||
@ -147,7 +135,7 @@ export default function ServerOverview({
|
|||||||
</section>
|
</section>
|
||||||
{!disableAnimatedMan && (
|
{!disableAnimatedMan && (
|
||||||
<img
|
<img
|
||||||
className="absolute right-3 top-[-85px] z-10 w-20 scale-90 group-hover:opacity-50 md:scale-100 transition-all"
|
className="absolute right-3 top-[-85px] z-50 w-20 scale-90 group-hover:opacity-50 md:scale-100 transition-all"
|
||||||
alt={"animated-man"}
|
alt={"animated-man"}
|
||||||
src={"/animated-man.webp"}
|
src={"/animated-man.webp"}
|
||||||
loading="eager"
|
loading="eager"
|
||||||
|
Loading…
x
Reference in New Issue
Block a user