theo/werkzeugkiste
1
0
Fork 0
mirror of https://github.com/theoleuthardt/werkzeugkiste.git synced 2026-06-13 09:37:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: start page footer, general styling

Browse source
This commit is contained in:
theoleuthardt 2025-02-08 14:13:04 +01:00
parent f7b0538ac7
commit 39be7de9c0
3 changed files with 43 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/app/page.tsx
View file

@ -1,4 +1,5 @@
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import { toolLinks } from "@/constants";
export default function Home() {
@ -6,17 +7,20 @@ export default function Home() {
<div className="h-screen w-screen bg-black text-white font-noto flex flex-col items-center">
<Navbar renderHomeLink={false} />
<div className="w-screen h-screen flex flex-col items-center justify-center">
<div className="grid grid-cols-3 gap-4">
<div className="grid grid-cols-3 gap-6">
{toolLinks.map((tool) => (
<div
key={tool.title}
className="border-2 border-white p-3 flex justify-center rounded-2xl"
className="text-2xl border-2 border-white p-5 flex justify-center rounded-2xl shadow-md
shadow-white hover:scale-110 hover:transition-scale hover:duration-200
hover:text-blue-400 hover:border-blue-400 hover:shadow-blue-400"
>
<a href={tool.link}>{tool.title}</a>
</div>
))}
</div>
</div>
<Footer />
</div>
);
}

30
src/components/Footer.tsx Normal file
View file

@ -0,0 +1,30 @@
import React from "react";
interface NavProps {
className?: string;
}
const navbar = (props: NavProps) => {
return (
<div className={`h-18 w-full p-3 ` + props.className}>
<div className="text-md text-white font-bold flex flex-row items-center justify-center">
<text>made by</text>
<a
className="mx-2 hover:underline hover:text-blue-400"
href="https://github.com/AuriomTex"
>
Domi
</a>
<text>and</text>
<a
className="mx-2 hover:underline hover:text-blue-400"
href="https://github.com/theoleuthardt"
>
Theo.
</a>
</div>
</div>
);
};
export default navbar;

9
src/components/Navbar.tsx
View file

@ -19,11 +19,14 @@ const navbar = (props: NavProps) => {
height={64}
className="invert"
/>
<div className="text-white ml-5">werkzeugkiste.</div>
<div className="text-white text-2xl ml-5">werkzeugkiste.</div>
</div>
<div className="flex flex-auto justify-center">
{props.renderHomeLink ? (
<a href="#" className="justify-center">
<a
href="#"
className="justify-center text-2xl hover:underline hover:transition-underline hover:duration-300 hover:text-blue-400"
>
home
</a>
) : null}
@ -31,7 +34,7 @@ const navbar = (props: NavProps) => {
<div className="flex flex-auto justify-end">
<a
href="https://github.com/theoleuthardt/werkzeugkiste"
className="items-end mr-3"
className="items-end mr-3 text-2xl hover:underline hover:transition-underline hover:duration-300 hover:text-blue-400"
>
github
</a>