SVI/Proxmox
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update layout and Navbar components to include responsive to avoid clipping walls when screens are smaller then 1280px

Browse Source
This commit is contained in:
Bram Suurd
2024-05-03 20:14:10 +02:00
parent d4a3ea897a
commit 5b55921bb8
2 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/layout.tsx
View File

@@ -67,10 +67,10 @@ export default function RootLayout({
enableSystem
disableTransitionOnChange
>
<div className="flex min-h-screen w-full flex-col justify-center">
<div className="flex min-h-screen w-full flex-col justify-center px-7 xl:px-0">
<Navbar />
<div className="flex w-full justify-center">
<div className="w-full max-w-7xl">
<div className="w-full max-w-7xl ">
{children}
<Toaster />
</div>

6
components/Navbar.tsx
View File

@@ -28,13 +28,15 @@ function Navbar() {
return (
<>
<div
className={`fixed left-0 top-0 z-50 flex w-full justify-center ${isScrolled ? "border-b backdrop-blur-lg" : ""}`}
className={`fixed left-0 top-0 z-50 flex w-full justify-center px-7 xl:px-0 ${isScrolled ? "border-b backdrop-blur-lg" : ""}`}
>
<div className="flex h-20 w-full max-w-7xl items-center justify-between">
<h1 className="font-semibold ">
<Link href="/" className=" flex items-center gap-2">
<Image height={18} width={18} alt="logo" src={logo} />
<span className=" hidden md:block">Proxmox VE Helper-Scripts</span>
<span className=" hidden md:block">
Proxmox VE Helper-Scripts
</span>
</Link>
</h1>
<div className="flex gap-2">