root/nezha_dash
1
0
Fork 0
mirror of https://github.com/hamster1963/nezha-dash.git synced 2025-04-24 21:10:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: inline card mobile display

Browse Source
This commit is contained in:
hamster1963 2024-12-06 10:40:47 +08:00
parent b2e5c80c07
commit 2afe8b5e75
1 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/ServerCardInline.tsx
View File

@ -12,6 +12,8 @@ import { cn, formatBytes, formatNezhaInfo } from "@/lib/utils";
import { useTranslations } from "next-intl"; import { useTranslations } from "next-intl";
import Link from "next/link"; import Link from "next/link";
import { Separator } from "./ui/separator";
export default function ServerCardInline({ export default function ServerCardInline({
serverInfo, serverInfo,
}: { }: {
@ -35,7 +37,7 @@ export default function ServerCardInline({
)} )}
> >
<section <section
className={cn("grid items-center gap-2 w-40")} className={cn("grid items-center gap-2 lg:w-36")}
style={{ gridTemplateColumns: "auto auto 1fr" }} style={{ gridTemplateColumns: "auto auto 1fr" }}
> >
<span className="h-2 w-2 shrink-0 rounded-full bg-green-500 self-center"></span> <span className="h-2 w-2 shrink-0 rounded-full bg-green-500 self-center"></span>
@ -47,7 +49,7 @@ export default function ServerCardInline({
> >
{showFlag ? <ServerFlag country_code={country_code} /> : null} {showFlag ? <ServerFlag country_code={country_code} /> : null}
</div> </div>
<div className="relative"> <div className="relative w-28">
<p <p
className={cn( className={cn(
"break-all font-bold tracking-tight", "break-all font-bold tracking-tight",
@ -58,6 +60,7 @@ export default function ServerCardInline({
</p> </p>
</div> </div>
</section> </section>
<Separator orientation="vertical" className="h-8 mx-0 ml-2" />
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
<section className={cn("grid grid-cols-9 items-center gap-3 flex-1")}> <section className={cn("grid grid-cols-9 items-center gap-3 flex-1")}>
<div <div
@ -161,7 +164,7 @@ export default function ServerCardInline({
> >
{showFlag ? <ServerFlag country_code={country_code} /> : null} {showFlag ? <ServerFlag country_code={country_code} /> : null}
</div> </div>
<div className="relative"> <div className="relative w-28">
<p <p
className={cn( className={cn(
"break-all font-bold tracking-tight", "break-all font-bold tracking-tight",