monadical/opencode
14
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix: responsive menu desktop

Browse Source
This commit is contained in:
David Hill
2026-01-16 12:29:16 +00:00
parent f197b8a0cd
commit e8dad85233
1 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/app/src/pages/layout.tsx
View File

@@ -1532,7 +1532,9 @@ export default function Layout(props: ParentProps) {
<div class="xl:hidden"> <div class="xl:hidden">
<div <div
classList={{ classList={{
"fixed inset-0 z-40 transition-opacity duration-200": true, "fixed inset-x-0 bottom-0 z-40 transition-opacity duration-200": true,
"top-10": platform.platform === "desktop",
"top-0": platform.platform !== "desktop",
"opacity-100 pointer-events-auto": layout.mobileSidebar.opened(), "opacity-100 pointer-events-auto": layout.mobileSidebar.opened(),
"opacity-0 pointer-events-none": !layout.mobileSidebar.opened(), "opacity-0 pointer-events-none": !layout.mobileSidebar.opened(),
}} }}
@@ -1542,7 +1544,9 @@ export default function Layout(props: ParentProps) {
/> />
<div <div
classList={{ classList={{
"@container fixed inset-y-0 left-0 z-50 w-72 bg-background-base transition-transform duration-200 ease-out": true, "@container fixed bottom-0 left-0 z-50 w-72 bg-background-base transition-transform duration-200 ease-out": true,
"top-10": platform.platform === "desktop",
"top-0": platform.platform !== "desktop",
"translate-x-0": layout.mobileSidebar.opened(), "translate-x-0": layout.mobileSidebar.opened(),
"-translate-x-full": !layout.mobileSidebar.opened(), "-translate-x-full": !layout.mobileSidebar.opened(),
}} }}
@@ -1555,7 +1559,7 @@ export default function Layout(props: ParentProps) {
<main <main
classList={{ classList={{
"size-full overflow-x-hidden flex flex-col items-start contain-strict border-t border-border-weak-base": true, "size-full overflow-x-hidden flex flex-col items-start contain-strict border-t border-border-weak-base": true,
"border-l rounded-tl-sm": !layout.sidebar.opened(), "xl:border-l xl:rounded-tl-sm": !layout.sidebar.opened(),
}} }}
> >
{props.children} {props.children}