karlm/portfolio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor(Header, globals.css, Home): update header positioning and fix background to fixed

Browse source
This commit is contained in:
Mike Karl 2026-02-08 23:13:32 +01:00
parent b24d562f6d
commit 6b4baf62d2
3 changed files with 19 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/components/Header.tsx
View file

@ -3,7 +3,7 @@ export default function Header({
}: Readonly<{ }: Readonly<{
children: React.ReactNode; children: React.ReactNode;
}>) { }>) {
return <header className="absolute flex justify-between w-full"> return <header className="fixed flex justify-between w-full z-10 backdrop-blur-sm">
{children} {children}
</header> </header>
} }

2
app/globals.css
View file

@ -15,7 +15,7 @@ body {
.bg{ .bg{
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
position: absolute; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
z-index: -999; z-index: -999;

2
app/page.tsx
View file

@ -15,6 +15,7 @@ export default function Home() {
}, []); }, []);
return ( return (
<>
<section className="mx-10 mt-50 ml-50"> <section className="mx-10 mt-50 ml-50">
<h2 className="text-7xl/12 font-light">Mike</h2> <h2 className="text-7xl/12 font-light">Mike</h2>
<h1 className="text-9xl font-bold">Karl</h1> <h1 className="text-9xl font-bold">Karl</h1>
@ -31,5 +32,6 @@ export default function Home() {
</motion.h3> </motion.h3>
</AnimatePresence> </AnimatePresence>
</section> </section>
</>
); );
} }