robin/Dramlog-Prod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: resolve mobile UI issues (scrollbar and overlapping form)

Browse Source
This commit is contained in:
robin
2025-12-18 10:04:11 +01:00
parent 330c8e1cc0
commit 314967b31b
2 changed files with 15 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/bottles/[id]/page.tsx
View File

@@ -123,9 +123,9 @@ export default async function BottlePage({ params }: { params: { id: string } })
</div> </div>
</div> </div>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 items-start"> <div className="grid grid-cols-1 lg:grid-cols-3 gap-6 md:gap-8 items-start">
{/* Form */} {/* Form */}
<div className="lg:col-span-1 border border-zinc-200 dark:border-zinc-800 rounded-3xl p-6 bg-white dark:bg-zinc-900/50 sticky top-24"> <div className="lg:col-span-1 border border-zinc-200 dark:border-zinc-800 rounded-3xl p-6 bg-white dark:bg-zinc-900/50 md:sticky md:top-24">
<h3 className="text-lg font-bold mb-6 flex items-center gap-2 text-amber-600"> <h3 className="text-lg font-bold mb-6 flex items-center gap-2 text-amber-600">
<Droplets size={20} /> Neu Verkosten <Droplets size={20} /> Neu Verkosten
</h3> </h3>

18
src/app/globals.css
View File

@@ -18,10 +18,18 @@
body { body {
color: rgb(var(--foreground-rgb)); color: rgb(var(--foreground-rgb));
background: linear-gradient( background: linear-gradient(to bottom,
to bottom,
transparent, transparent,
rgb(var(--background-end-rgb)) rgb(var(--background-end-rgb))) rgb(var(--background-start-rgb));
) }
rgb(var(--background-start-rgb));
@layer utilities {
.scrollbar-hide::-webkit-scrollbar {
display: none;
}
.scrollbar-hide {
-ms-overflow-style: none;
scrollbar-width: none;
}
} }