diff --git a/index.html b/index.html index b74344f..2fc4f11 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@ diff --git a/public/dexter-theme.mp3 b/public/dexter-theme.mp3 deleted file mode 100644 index 262d31d..0000000 Binary files a/public/dexter-theme.mp3 and /dev/null differ diff --git a/src/assets/main.css b/src/assets/main.css index b6279e3..dc69f2d 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -1,7 +1,7 @@ @import "tailwindcss"; body { - font-family: "Pathway Gothic One", sans-serif; + font-family: "Open Sans", sans-serif; background-color: black; ::-webkit-scrollbar { diff --git a/src/assets/splatter.png b/src/assets/splatter.png deleted file mode 100644 index 250186e..0000000 Binary files a/src/assets/splatter.png and /dev/null differ diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx new file mode 100644 index 0000000..c9a79b4 --- /dev/null +++ b/src/components/Footer.tsx @@ -0,0 +1,14 @@ +export default function Footer() { + return ( +
+ navigator.clipboard.writeText("alex@alexav.gg")} + className="text-xs opacity-85 hover:underline" + > + alex@alexav.gg + +

© 2026 Alex Frantz

+
+ ); +} diff --git a/src/components/Header.tsx b/src/components/Header.tsx new file mode 100644 index 0000000..7ebeda0 --- /dev/null +++ b/src/components/Header.tsx @@ -0,0 +1,25 @@ +export default function Header() { + return ( +
+

+ Alex / dev + QA +

+
+ + GitHub + + navigator.clipboard.writeText("alex@alexav.gg")} + > + alex@alexav.gg + +
+
+ ); +} diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 525d2f0..391afba 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -1,8 +1,10 @@ import type { ReactNode } from "react"; +import Header from "./Header"; export default function Layout({ children }: { children: ReactNode }) { return ( -
+
+
{children}
); diff --git a/src/components/ProjectCard.tsx b/src/components/ProjectCard.tsx new file mode 100644 index 0000000..6e79870 --- /dev/null +++ b/src/components/ProjectCard.tsx @@ -0,0 +1,46 @@ +interface ProjectCardProps { + title: string; + description: string; + link: string; + pills: string[]; +} +interface PillProps { + name: string; +} + +export default function ProjectCard({ + title, + description, + link, + pills, +}: ProjectCardProps) { + const Pill = ({ name }: PillProps) => { + return ( +
+ {name} +
+ ); + }; + + return ( +
+
+

{title}

+ + + +
+ +
+

{description}

+
+ {pills.map((v, k) => { + return ; + })} +
+
+
+ ); +} diff --git a/src/components/modules/Clock.tsx b/src/components/modules/Clock.tsx deleted file mode 100644 index 03f9f57..0000000 --- a/src/components/modules/Clock.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { useState, useEffect } from "react"; - -export default function Clock() { - const [clock, setClock] = useState( - new Date().toLocaleTimeString("en-GB", { - hour: "2-digit", - minute: "2-digit", - }), - ); - - useEffect(() => { - setInterval(() => { - const date = new Date().toLocaleTimeString("en-GB", { - hour: "2-digit", - minute: "2-digit", - }); - if (clock != date) { - setClock(date); - } - }, 500); - }, []); - - return ( -

- {clock} -

- ); -} diff --git a/src/components/modules/CountdownModule.tsx b/src/components/modules/CountdownModule.tsx deleted file mode 100644 index fcb1009..0000000 --- a/src/components/modules/CountdownModule.tsx +++ /dev/null @@ -1,68 +0,0 @@ -import { useEffect, useRef } from "react"; - -export default function CountdownModule() { - const countdownRef = useRef(null); - const audioRef = useRef(null); - - useEffect(() => { - const dateOfStart = new Date("Sep 7, 2025 20:15:00").getTime(); - - setInterval(() => { - const currentDate = new Date().getTime(); - const difference = dateOfStart - currentDate; - - const days = Math.floor(difference / (1000 * 60 * 60 * 24)); - const hours = Math.floor( - (difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60) - ); - const minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60)); - const seconds = Math.floor((difference % (1000 * 60)) / 1000); - - if (countdownRef?.current) { - let timerString = ""; - timerString += `${days || "0"}d, `; - timerString += `${hours || "0"}h, `; - timerString += `${minutes || "0"}m, `; - timerString += `${seconds || "0"}s`; - - if ( - days <= 0 && - hours <= 0 && - minutes <= 0 && - seconds <= 0 && - timerString === "" - ) { - timerString = "GO BILLS"; - } - - countdownRef.current.innerText = timerString; - } - }, 1000); - }, []); - - return ( -
-
- { - if (audioRef?.current) { - audioRef.current.play(); - } - }} - width="50" - height="50" - className="hover:cursor-pointer" - src={"https://storage.alexav.gg/content/bills.png"} - /> -

-
-
- ); -} diff --git a/src/pages/App.tsx b/src/pages/App.tsx index 6e3ba42..cd1538c 100644 --- a/src/pages/App.tsx +++ b/src/pages/App.tsx @@ -5,6 +5,12 @@ import Button from "../components/Button"; import Home from "./Home"; import PicturesPage from "./Pictures"; import Sports from "./Sports"; +import ProjectCard from "../components/ProjectCard"; +import FantasyStatus from "../components/FantasyStatus"; +import GameComponent from "../components/info/GameComponent"; +import MusicComponent from "../components/info/MusicComponent"; +import PictureCarousel from "../components/modules/PictureCarousel"; +import Footer from "../components/Footer"; export default function App() { const [tab, setTab] = useState<"home" | "scores" | "sports" | "pictures">( @@ -13,44 +19,94 @@ export default function App() { return ( -
-
-
-

welcome

- -

welcome

+
+
+

HI, I'M ALEX

+

+ I write software sometimes, then I spend twice as long breaking it +

+
+
+

+ My day job is software QA at{" "} + + Medal.tv + {" "} + ( + + we're hiring! + + ), then by night I play with my homelab rack or write some mediocre + JavaScript. +

+

+ Based in Western New York (go bills, go sabres). Working on learning + Java, C#. Pointless software for funzies is my passion. +

+
+ +
+ +

THINGS I'VE BUILT

+
+ + + + + +
+

FUN STUFF

+ +
+

Fantasy

+
+
+

+ My Life, Pictured +

+ +
+ +
- - - -
- - - -
- -
- - {tab === "home" && } - {tab === "pictures" && } - {tab === "sports" && } -
+ ); }