kang
ac612cb32c
- 重构PlayerAppShell，移除冗余头部导航与国际化依赖，统一页面背景与内边距 - 新增通用页面容器组件PlayerPanel，统一页面头部布局与样式 - 重构底部导航栏，调整图标、文案与样式，新增激活状态指示器 - 重构所有页面组件：大厅页、注单页、结果页、开奖面板等，统一使用新的UI组件与设计风格 - 优化状态标签、卡片、按钮等组件的视觉样式，统一配色与圆角规范 - 移除冗余依赖与注释代码，整理代码结构
30 lines
985 B
TypeScript
30 lines
985 B
TypeScript
"use client";
|
||
|
||
import type { ReactNode } from "react";
|
||
|
||
import { NetworkStatusBanner } from "@/components/network-status-banner";
|
||
import { PlayerBottomNav } from "@/components/layout/player-bottom-nav";
|
||
|
||
type PlayerAppShellProps = {
|
||
children: ReactNode;
|
||
};
|
||
|
||
/**
|
||
* 玩家端外壳：顶栏（品牌 + 会话）+ 主体 + **底部 Tab 导航**（H5）。
|
||
* 底部栏留白：{@link PlayerBottomNav} 对应 `padding-bottom`.
|
||
*
|
||
* 注意：全局离线横幅和服务器错误覆盖层已在 ErrorProvider 中处理
|
||
* 这里的 NetworkStatusBanner 仅用于 WebSocket 状态显示
|
||
*/
|
||
export function PlayerAppShell({ children }: PlayerAppShellProps): ReactNode {
|
||
return (
|
||
<div className="min-h-dvh bg-[#f3f7fd] text-foreground">
|
||
<NetworkStatusBanner />
|
||
<main className="mx-auto flex w-full max-w-lg flex-col px-3 pb-[calc(4.25rem+env(safe-area-inset-bottom,0px)+0.75rem)] pt-3 sm:px-4">
|
||
{children}
|
||
</main>
|
||
<PlayerBottomNav />
|
||
</div>
|
||
);
|
||
}
|