From 4b1fc2812e182e50471ef08debcc677718cfbb4b Mon Sep 17 00:00:00 2001 From: Alex Frantz Date: Thu, 28 Nov 2024 03:15:50 -0500 Subject: [PATCH] oh hey yet another redesign --- src/components/ContactForm.tsx | 31 ++-- src/components/Footer.tsx | 53 +----- src/components/Header.tsx | 43 ++++- src/components/{SocialIcons.tsx => Icons.tsx} | 0 src/components/InputBox.tsx | 8 +- src/components/Layout.tsx | 2 +- src/components/ProjectCard.tsx | 22 ++- src/components/ProjectComponent.tsx | 20 +- src/pages/index.tsx | 174 +++++++++--------- 9 files changed, 167 insertions(+), 186 deletions(-) rename src/components/{SocialIcons.tsx => Icons.tsx} (100%) diff --git a/src/components/ContactForm.tsx b/src/components/ContactForm.tsx index 100cc7a..4075270 100644 --- a/src/components/ContactForm.tsx +++ b/src/components/ContactForm.tsx @@ -57,15 +57,14 @@ export default function ContactForm() { }, [success]); return ( -
-

Contact Me

-
+
+

Contact Me

-
+
{ setInputState((prevState) => { return { @@ -78,7 +77,7 @@ export default function ContactForm() { { setInputState((prevState) => { return { @@ -104,7 +103,7 @@ export default function ContactForm() { { setInputState((prevState) => { return { @@ -116,16 +115,26 @@ export default function ContactForm() { />
-
+
-

{error}

-

{ success && "Success! Your message has been received"}

+ + { + error && ( +

{error}

+ ) + } + + { + success && ( +

Success! Your message has been received

+ ) + }
) diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx index 33dd735..727035c 100644 --- a/src/components/Footer.tsx +++ b/src/components/Footer.tsx @@ -1,24 +1,9 @@ import { useState, useEffect } from 'react'; import { Link as RouterLink } from 'react-router-dom'; -import { GitHub, Bluesky, Twitter, Medal, Link, LinkedIn } from './SocialIcons'; export default function Footer() { - const quoteArray = [ - "It works on my machine", - "Revert 'Revert 'Revert 'Revert Change'''", - "releases on Friday. refuses to elaborate. leaves.", - "this is so cooked", - "TypeScript: errors not for the weak, but for the spirited", - "Professional Production Tester", - "I break hearts to save lives. err.. something like that", - "The best error is the one that never shows up", - "go bills", - "josh allen is my goat" - ] - // states - const [mailState, setMailState] = useState(false); - const [ quote, setQuote ] = useState(quoteArray[Math.floor(Math.random() * quoteArray.length)]); + const [ mailState, setMailState ] = useState(false); useEffect(() => { if (mailState) { @@ -28,18 +13,9 @@ export default function Footer() { } }, [mailState]) - const drawNewQuote = () => { - const newQuote = quoteArray[Math.floor(Math.random() * quoteArray.length)] - - // redraw if this quote == current quote - if (newQuote !== quote) { - setQuote(newQuote); - } else drawNewQuote(); - } - return ( -
-

© {new Date().getFullYear()}, Alex Frantz. All Rights Reserved

+
+

© {new Date().getFullYear()}, Alex Frantz. All Rights Reserved

All logos & images on this page belong to their respective owners.

Privacy

@@ -59,29 +35,6 @@ export default function Footer() { }} className="hover:underline">alex@alexav.gg ) } - -

{quote}

-
- {/* socials */} - - - - - - - - - - - - - - - - - - -
) } \ No newline at end of file diff --git a/src/components/Header.tsx b/src/components/Header.tsx index ab73e5a..81ea061 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,14 +1,41 @@ -import { Link } from "react-router-dom" +import { useState } from "react" export default function Header() { - return ( -
- -

Alex Frantz

- -

Professional button clicker & word typer

+ const quoteArray = [ + "It works on my machine", + "Revert 'Revert 'Revert", + "'fuck the tests'", + "this is so cooked", + "Professional Production Tester", + "I break hearts to save lives.", + "go bills", + "josh allen is my goat" + ] + const [ quote, setQuote ] = useState(quoteArray[Math.floor(Math.random() * quoteArray.length)]); -
+ const drawNewQuote = () => { + const newQuote = quoteArray[Math.floor(Math.random() * quoteArray.length)] + + // redraw if this quote == current quote + if (newQuote !== quote) { + setQuote(newQuote); + } else drawNewQuote(); + } + + return ( +
+
+ +

Alex Frantz

+ +

{quote}

+
+
) } \ No newline at end of file diff --git a/src/components/SocialIcons.tsx b/src/components/Icons.tsx similarity index 100% rename from src/components/SocialIcons.tsx rename to src/components/Icons.tsx diff --git a/src/components/InputBox.tsx b/src/components/InputBox.tsx index b395134..9dbcc91 100644 --- a/src/components/InputBox.tsx +++ b/src/components/InputBox.tsx @@ -1,12 +1,12 @@ export default function InputBox({ name, - placeholder, + placeholder = "", isText = true, onChange }: { name: string, isText?: boolean, - placeholder: string, + placeholder?: string, onChange: (value: string) => void }) { if (isText) { @@ -16,7 +16,7 @@ export default function InputBox({ type="text" name={name} placeholder={placeholder} - className="bg-black rounded-lg p-2 text-white w-full" + className="rounded-lg p-2 w-1/2 text-black" onChange={({target}) => onChange(target.value)} />
@@ -28,7 +28,7 @@ export default function InputBox({ name={name} placeholder={placeholder} onChange={({ target }) => onChange(target.value)} - className="bg-black rounded-lg p-2 text-white w-full h-32" + className="rounded-lg p-2 w-1/2 h-32 text-black" />
) diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 59596d1..af7c13d 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -7,7 +7,7 @@ export default function Layout({ children: JSX.Element | JSX.Element[] }) { return ( -
+
{children}