mleku/smesh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add support for ultrawide screens

Browse Source
This commit is contained in:
codytseng
2025-10-16 10:10:47 +08:00
parent 978707e434
commit f7051ed46b
1 changed files with 36 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/PageManager.tsx
View File

@@ -348,38 +348,45 @@ export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
>
<CurrentRelaysProvider>
<NotificationProvider>
<div className="flex h-[var(--vh)] overflow-hidden bg-surface-background">
<Sidebar />
<div className="grid grid-cols-2 gap-2 w-full pr-2 py-2">
<div className="rounded-lg shadow-lg bg-background overflow-hidden">
{primaryPages.map(({ name, element, props }) => (
<div className="flex flex-col items-center bg-surface-background">
<div
className="flex h-[var(--vh)] w-full bg-surface-background"
style={{
maxWidth: '1920px'
}}
>
<Sidebar />
<div className="grid grid-cols-2 gap-2 w-full pr-2 py-2">
<div className="rounded-lg shadow-lg bg-background overflow-hidden">
{primaryPages.map(({ name, element, props }) => (
<div
key={name}
className="flex flex-col h-full w-full"
style={{
display: currentPrimaryPage === name ? 'block' : 'none'
}}
>
{props ? cloneElement(element as React.ReactElement, props) : element}
</div>
))}
</div>
<div className="rounded-lg shadow-lg bg-background overflow-hidden">
{secondaryStack.map((item, index) => (
<div
key={item.index}
className="flex flex-col h-full w-full"
style={{ display: index === secondaryStack.length - 1 ? 'block' : 'none' }}
>
{item.component}
</div>
))}
<div
key={name}
className="flex flex-col h-full w-full"
style={{
display: currentPrimaryPage === name ? 'block' : 'none'
}}
key="home"
className="w-full"
style={{ display: secondaryStack.length === 0 ? 'block' : 'none' }}
>
{props ? cloneElement(element as React.ReactElement, props) : element}
<HomePage />
</div>
))}
</div>
<div className="rounded-lg shadow-lg bg-background overflow-hidden">
{secondaryStack.map((item, index) => (
<div
key={item.index}
className="flex flex-col h-full w-full"
style={{ display: index === secondaryStack.length - 1 ? 'block' : 'none' }}
>
{item.component}
</div>
))}
<div
key="home"
className="w-full"
style={{ display: secondaryStack.length === 0 ? 'block' : 'none' }}
>
<HomePage />
</div>
</div>
</div>