shiyue/kan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: enable scroll on card page

Browse Source
This commit is contained in:
Henry
2025-07-02 14:37:56 +01:00
parent 30b3332d1f
commit 44566f4838
3 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
apps/web/src/components/Dashboard.tsx
View File

@@ -80,8 +80,8 @@ export default function Dashboard({
background-color: ${!isDarkMode ? "hsl(0deg 0% 97.3%)" : "#161616"}; background-color: ${!isDarkMode ? "hsl(0deg 0% 97.3%)" : "#161616"};
} }
`}</style> `}</style>
<div className="h-screen flex-col items-center bg-light-100 dark:bg-dark-50 md:flex md:min-w-[800px]"> <div className="flex h-screen flex-col items-center bg-light-100 dark:bg-dark-50 md:min-w-[800px]">
<div className="m-auto flex h-12 min-h-12 w-full justify-between border-b border-light-600 px-5 py-2 align-middle dark:border-dark-400 md:h-16 md:min-h-16"> <div className="flex h-12 min-h-12 w-full justify-between border-b border-light-600 px-5 py-2 align-middle dark:border-dark-400 md:h-16 md:min-h-16">
<div className="my-auto flex w-full items-center justify-between"> <div className="my-auto flex w-full items-center justify-between">
<button <button
ref={sideNavButtonRef} ref={sideNavButtonRef}
@@ -134,10 +134,10 @@ export default function Dashboard({
</div> </div>
</div> </div>
<div className="flex h-full w-full"> <div className="flex h-full min-h-0 w-full">
<div <div
ref={sideNavRef} ref={sideNavRef}
className={`fixed left-0 top-12 z-50 h-[calc(100dvh-3rem)] transform transition-transform duration-300 ease-in-out md:relative md:top-0 md:h-[calc(100vh-4rem)] md:translate-x-0 ${isSideNavOpen ? "translate-x-0" : "-translate-x-full md:translate-x-0"} `} className={`fixed left-0 top-12 z-50 h-[calc(100dvh-3rem)] transform transition-transform duration-300 ease-in-out md:relative md:top-0 md:h-full md:translate-x-0 ${isSideNavOpen ? "translate-x-0" : "-translate-x-full md:translate-x-0"} `}
> >
<SideNavigation <SideNavigation
user={{ email: session?.user.email, image: session?.user.image }} user={{ email: session?.user.email, image: session?.user.image }}
@@ -145,8 +145,8 @@ export default function Dashboard({
/> />
</div> </div>
<div className="relative flex w-full overflow-hidden"> <div className="relative flex min-h-0 w-full overflow-hidden">
<div className="w-full overflow-hidden">{children}</div> <div className="h-full w-full overflow-y-auto">{children}</div>
{/* Mobile Right Panel */} {/* Mobile Right Panel */}
{hasRightPanel && rightPanel && ( {hasRightPanel && rightPanel && (
@@ -156,7 +156,7 @@ export default function Dashboard({
isRightPanelOpen ? "translate-x-0" : "translate-x-full" isRightPanelOpen ? "translate-x-0" : "translate-x-full"
}`} }`}
> >
<div className="h-full">{rightPanel}</div> <div className="h-full overflow-y-auto">{rightPanel}</div>
</div> </div>
)} )}

2
apps/web/src/views/card/index.tsx
View File

@@ -189,7 +189,7 @@ export default function CardPage() {
/> />
<div className="flex h-full flex-1 flex-row"> <div className="flex h-full flex-1 flex-row">
<div className="flex h-full w-full flex-col overflow-hidden"> <div className="flex h-full w-full flex-col overflow-hidden">
<div className="h-full max-h-[calc(100vh-4rem)] overflow-y-auto p-6 md:p-8"> <div className="h-full max-h-[calc(100dvh-3rem)] overflow-y-auto p-6 md:max-h-[calc(100dvh-4rem)] md:p-8">
<div className="mb-8 flex w-full items-center justify-between"> <div className="mb-8 flex w-full items-center justify-between">
{!card && isLoading && ( {!card && isLoading && (
<div className="flex space-x-2"> <div className="flex space-x-2">

2
apps/web/src/views/settings/index.tsx
View File

@@ -104,7 +104,7 @@ export default function SettingsPage() {
return ( return (
<> <>
<div className="flex h-full w-full flex-col overflow-hidden"> <div className="flex h-full w-full flex-col overflow-hidden">
<div className="h-full max-h-[calc(100vh-4rem)] overflow-y-auto"> <div className="h-full max-h-[calc(100vdh-3rem)] overflow-y-auto md:max-h-[calc(100vdh-4rem)]">
<PageHead title={t`Settings | ${workspace.name ?? "Workspace"}`} /> <PageHead title={t`Settings | ${workspace.name ?? "Workspace"}`} />
<div className="m-auto max-w-[1600px] px-5 py-6 md:px-28 md:py-12"> <div className="m-auto max-w-[1600px] px-5 py-6 md:px-28 md:py-12">
<div className="mb-8 flex w-full justify-between"> <div className="mb-8 flex w-full justify-between">