优化 PC 登录页桌面布局(07-30-pc-login-desktop-layout)

这个提交包含在:
2026-07-31 08:29:30 +08:00
父节点 ceeb0b5a2f
当前提交 de65a07a51
共修改 12 个文件,包含 541 行新增和 94 行删除
+24 -3
查看文件
@@ -1,9 +1,15 @@
import { Outlet } from "react-router-dom";
import { Button } from "../components/ui/button";
import { usePwaUpdatePrompt } from "../hooks/usePwaUpdatePrompt";
import { cn } from "../lib/utils";
export function AuthLayout() {
type AuthLayoutProps = {
variant?: "default" | "login";
};
export function AuthLayout({ variant = "default" }: AuthLayoutProps) {
const { updateReady, applyUpdate, dismissUpdate } = usePwaUpdatePrompt();
const isLoginLayout = variant === "login";
return (
<div className="auth-shell relative min-h-screen overflow-hidden px-4 py-8 sm:px-6 lg:px-10">
@@ -11,8 +17,23 @@ export function AuthLayout() {
aria-hidden="true"
className="auth-shell__grid pointer-events-none absolute inset-0"
/>
<div aria-hidden="true" className="auth-shell__rail pointer-events-none absolute inset-y-8 left-[max(1rem,calc((100vw-520px)/2-88px))] hidden w-px lg:block" />
<div className="relative mx-auto flex min-h-[calc(100vh-4rem)] max-w-[460px] flex-col justify-center">
<div
aria-hidden="true"
className={cn(
"auth-shell__rail pointer-events-none absolute inset-y-8 hidden w-px lg:block",
isLoginLayout
? "left-[max(1rem,calc((100vw-960px)/2-48px))]"
: "left-[max(1rem,calc((100vw-520px)/2-88px))]",
)}
/>
<div
className={cn(
"relative mx-auto flex min-h-[calc(100vh-4rem)] flex-col justify-center",
isLoginLayout ? "max-w-[460px] lg:max-w-[920px]" : "max-w-[460px]",
)}
data-layout-variant={variant}
data-testid="auth-layout-container"
>
{updateReady ? (
<div className="mb-4 rounded-lg border border-primary/20 bg-white/95 px-4 py-3 text-sm text-slate-700 shadow-sm" data-testid="auth-pwa-update-notice">
<div className="font-medium text-slate-900">系统有新版本</div>