From 6b05c4fb0028896b310682b4229d0d76b3309d6d Mon Sep 17 00:00:00 2001
From: glax <johanna@bernloehr.eu>
Date: Tue, 17 Jun 2025 15:40:25 +0200
Subject: [PATCH] Fix MangaList Overflow, top-position

---
 tranga-website/src/App.css                  | 2 --
 tranga-website/src/Components/MangaList.tsx | 2 +-
 tranga-website/src/Header.css               | 3 ++-
 tranga-website/src/Header.tsx               | 2 +-
 4 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/tranga-website/src/App.css b/tranga-website/src/App.css
index f4189d1..8e2ae63 100644
--- a/tranga-website/src/App.css
+++ b/tranga-website/src/App.css
@@ -8,8 +8,6 @@
 
 .app-content {
   position: absolute;
-  height: calc(100% - 60px);
-  top: 60px;
   width: 100%;
   left: 0;
 }
\ No newline at end of file
diff --git a/tranga-website/src/Components/MangaList.tsx b/tranga-website/src/Components/MangaList.tsx
index db1df50..11dfbb6 100644
--- a/tranga-website/src/Components/MangaList.tsx
+++ b/tranga-website/src/Components/MangaList.tsx
@@ -53,7 +53,7 @@ export default function MangaList({connected, setShowSearch}: {connected: boolea
     }
 
     return(
-        <Stack direction="row" spacing={1} flexWrap={"wrap"}>
+        <Stack direction="row" spacing={1} flexWrap={"wrap"} sx={{overflowX: 'hidden', overflowY: 'auto' /* Badge overflow */}} paddingTop={"6px" /* Badge overflow */}>
             <Badge invisible sx={{margin: "8px !important"}}>
                 <Card onClick={() => setShowSearch(true)} sx={{height:"fit-content",width:"fit-content"}}>
                     <CardCover sx={{margin:"var(--Card-padding)"}}>
diff --git a/tranga-website/src/Header.css b/tranga-website/src/Header.css
index f03d6b0..131b3a9 100644
--- a/tranga-website/src/Header.css
+++ b/tranga-website/src/Header.css
@@ -1,5 +1,6 @@
 .header {
-    position: static !important;
+    position: sticky !important;
+    z-index: 1000;
     top: 0;
     left: 0;
     width: 100%;
diff --git a/tranga-website/src/Header.tsx b/tranga-website/src/Header.tsx
index 101c257..87e1ddc 100644
--- a/tranga-website/src/Header.tsx
+++ b/tranga-website/src/Header.tsx
@@ -7,7 +7,7 @@ import { GitHub } from "@mui/icons-material";
 export default function Header({children} : {children? : ReactElement<any, any> | ReactElement<any,any>[] | undefined}) : ReactElement {
     
     return (
-        <Sheet className={"header"} sx={{position: "sticky !important", zIndex: 100}}>
+        <Sheet className={"header"}>
             <Stack direction={"row"} spacing={2} sx={{width: "100%", alignItems: "center"}}>
                 {children}
                 <Box sx={{flexGrow: 1}} />