improve structure

This commit is contained in:
Aidan 2025-01-05 16:46:40 -05:00
parent a824d369dd
commit c134b25950
6 changed files with 7 additions and 7 deletions

View file

@ -0,0 +1,27 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faUser } from '@fortawesome/free-solid-svg-icons'
export default function About() {
return (
<div className="max-w-2xl mx-auto text-center">
<FontAwesomeIcon icon={faUser} className="text-6xl mb-6" />
<h1 className="text-4xl font-bold my-2 text-center text-gray-200" style={{ textShadow: '0 0 10px rgba(255, 255, 255, 0.5)' }}>
About Me
</h1>
<div className="p-6">
<p className="text-gray-300 mb-4">
Hey there! I&apos;m Aidan, a web developer and student, and this is my website. I&apos;m passionate about web development (although I&apos;m not great with design) and I love building things with Node.js and Express.
</p>
<p className="text-gray-300 mb-4">
In terms of my academic background, I am currently pursuing a degree in computer science at SNHU. I really enjoy learning, though it depends on the subject. I am mostly self-taught when it comes to programming. I prefer this style of learning, especially with programming, as it lets me learn faster and apply creativity much more.
</p>
<p className="text-gray-300 mb-4">
When I&apos;m not programming, I can typically be found installing another Linux distro on my laptop or flashing a new ROM to my phone. I am also a passionate writer and I like to write creatively in my free time.
</p>
<p className="text-gray-300">
I am almost always active on GitHub and make daily contributions to several of my repositories. I am a big fan of open source software and public domain software (which most of my repos are licensed under). In fact, the website you&apos;re currently on is free and open source. It&apos;s even under the public domain!
</p>
</div>
</div>
)
}

View file

@ -0,0 +1,50 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faPhone, faEnvelope } from '@fortawesome/free-solid-svg-icons'
import { faGithub, faTelegram } from '@fortawesome/free-brands-svg-icons'
import { IconDefinition } from '@fortawesome/fontawesome-svg-core'
export default function Contact() {
return (
<div className="max-w-2xl mx-auto text-center">
<FontAwesomeIcon icon={faPhone} className="text-6xl mb-6" />
<h1 className="text-4xl font-bold my-2 text-center text-gray-200" style={{ textShadow: '0 0 10px rgba(255, 255, 255, 0.5)' }}>
Contact
</h1>
<div className="p-6 space-y-4">
<ContactButton href="https://github.com/ihatenodejs" icon={faGithub} label="ihatenodejs" className="mr-3" />
<ContactButton href="https://t.me/p0ntu5" icon={faTelegram} label="@p0ntu5" className="mr-3" />
<ContactButton href="mailto:aidan@p0ntus.com" icon={faEnvelope} label="aidan@p0ntus.com" className="" />
</div>
<div className="p-6">
<h2 className="text-2xl font-semibold mb-4 text-gray-200">I&apos;m a busy person</h2>
<p className="text-gray-300 mb-4">
I do a lot of things during the day and I&apos;m not always able to respond to messages right away. Please be patient and remember not to demand things from me... Somehow this is an issue for people :(
</p>
<p className="text-gray-300 mb-4">
For the best chance of a response, please send me a message on Telegram. If you&apos;ve made a pull request on one of my repos, I will most likely respond by the next day. If you&apos;ve sent me an email, I will most likely respond within three days or less.
</p>
</div>
</div>
)
}
interface ContactButtonProps {
href: string;
icon: IconDefinition;
label: string;
className?: string;
}
function ContactButton({ href, icon, label, className }: ContactButtonProps) {
return (
<a
href={href}
target="_blank"
rel="noopener noreferrer"
className={`bg-gray-700 text-white px-4 py-2 rounded-full hover:bg-gray-600 transition-colors inline-flex items-center ${className}`}
>
<FontAwesomeIcon icon={icon} className="text-xl mr-2" />
{label}
</a>
)
}

View file

@ -0,0 +1,22 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faLink } from '@fortawesome/free-solid-svg-icons'
import domains from '../../data/domains.json'
export default function About() {
return (
<div className="max-w-2xl mx-auto text-center">
<FontAwesomeIcon icon={faLink} className="text-6xl mb-6" />
<h1 className="text-4xl font-bold my-2 text-center text-gray-200" style={{ textShadow: '0 0 10px rgba(255, 255, 255, 0.5)' }}>
My Domains
</h1>
<div className="p-6">
{domains.map(domain => (
<div key={domain.id} className="mb-4">
<h2 className="text-2xl font-semibold text-gray-200">{domain.domain}</h2>
<p className="text-gray-300">{domain.usage}</p>
</div>
))}
</div>
</div>
)
}