admin
34c8e2db4e
- Added PageScaffold component for shared page layout with safe-area padding and scroll management. - Introduced ResponsiveMobileShell for mobile canvas layout with customizable backgrounds. - Created ScrollablePage component for scrollable content areas. - Updated CSS styles for coins rules screen, sidebar components, and subscription sections to use responsive design tokens. - Added viewport CSS variables provider to synchronize CSS variables with the visual viewport. - Refactored breakpoints and dimensions for better responsiveness across devices.
24 lines
578 B
TypeScript
24 lines
578 B
TypeScript
import type { ReactNode } from "react";
|
|
|
|
import { ResponsiveMobileShell } from "./responsive-mobile-shell";
|
|
|
|
export interface MobileShellProps {
|
|
children: ReactNode;
|
|
/** 自定义背景色（默认透明，继承 body 背景）。 */
|
|
background?: string;
|
|
/** 自定义 className（注入到内容容器上）。 */
|
|
className?: string;
|
|
}
|
|
|
|
export function MobileShell({
|
|
children,
|
|
background,
|
|
className,
|
|
}: MobileShellProps) {
|
|
return (
|
|
<ResponsiveMobileShell background={background} className={className}>
|
|
{children}
|
|
</ResponsiveMobileShell>
|
|
);
|
|
}
|