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.
30 lines
613 B
CSS
30 lines
613 B
CSS
.shell {
|
|
display: flex;
|
|
flex: 1 1 auto;
|
|
width: 100%;
|
|
min-width: 0;
|
|
min-height: var(--app-viewport-height, 100dvh);
|
|
justify-content: center;
|
|
background: var(--mobile-shell-outer-background, #000000);
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.content {
|
|
position: relative;
|
|
display: flex;
|
|
flex: 1 1 auto;
|
|
min-width: 0;
|
|
width: 100%;
|
|
max-width: var(--app-max-width, 540px);
|
|
min-height: var(--app-viewport-height, 100dvh);
|
|
flex-direction: column;
|
|
background: var(--mobile-shell-background, transparent);
|
|
overflow-x: clip;
|
|
}
|
|
|
|
@supports not (overflow: clip) {
|
|
.content {
|
|
overflow-x: hidden;
|
|
}
|
|
}
|