fix: inline card mobile display

This commit is contained in:
hamster1963
2024-12-06 10:06:28 +08:00
parent 560bcea0b8
commit 229d395143
4 changed files with 13 additions and 11 deletions

View File

@@ -17,6 +17,7 @@ import {
MageMicrosoftWindows,
} from "@/lib/logo-class";
import { formatBytes } from "@/lib/format";
import { Separator } from "./ui/separator";
export default function ServerCardInline({
now,
@@ -70,7 +71,7 @@ export default function ServerCardInline({
onClick={() => navigate(`/server/${serverInfo.id}`)}
>
<section
className={cn("grid items-center gap-2 lg:w-40")}
className={cn("grid items-center gap-2 lg:w-36")}
style={{ gridTemplateColumns: "auto auto 1fr" }}
>
<span className="h-2 w-2 shrink-0 rounded-full bg-green-500 self-center"></span>
@@ -82,7 +83,7 @@ export default function ServerCardInline({
>
{showFlag ? <ServerFlag country_code={country_code} /> : null}
</div>
<div className="relative w-24 flex flex-col">
<div className="relative w-28 flex flex-col">
<p
className={cn(
"break-all font-bold tracking-tight",
@@ -107,6 +108,7 @@ export default function ServerCardInline({
))}
</div>
</section>
<Separator orientation="vertical" className="h-8 mx-0 ml-2" />
<div className="flex flex-col gap-2">
<section className={cn("grid grid-cols-9 items-center gap-3 flex-1")}>
<div
@@ -226,7 +228,7 @@ export default function ServerCardInline({
<div className="relative">
<p
className={cn(
"break-all font-bold w-24 tracking-tight",
"break-all font-bold w-28 tracking-tight",
showFlag ? "text-xs" : "text-sm",
)}
>

View File

@@ -13,7 +13,7 @@ export const WebSocketProvider: React.FC<WebSocketProviderProps> = ({
const [lastMessage, setLastMessage] = useState<{ data: string } | null>(null);
const [connected, setConnected] = useState(false);
const ws = useRef<WebSocket | null>(null);
const reconnectTimeout = useRef<NodeJS.Timeout>();
const reconnectTimeout = useRef<NodeJS.Timeout>(null);
const maxReconnectAttempts = 30;
const reconnectAttempts = useRef(0);