improve structure
This commit is contained in:
parent
a824d369dd
commit
c134b25950
6 changed files with 7 additions and 7 deletions
27
app/components/pages/About.tsx
Normal file
27
app/components/pages/About.tsx
Normal 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'm Aidan, a web developer and student, and this is my website. I'm passionate about web development (although I'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'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're currently on is free and open source. It's even under the public domain!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
50
app/components/pages/Contact.tsx
Normal file
50
app/components/pages/Contact.tsx
Normal 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'm a busy person</h2>
|
||||
<p className="text-gray-300 mb-4">
|
||||
I do a lot of things during the day and I'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've made a pull request on one of my repos, I will most likely respond by the next day. If you'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>
|
||||
)
|
||||
}
|
22
app/components/pages/Domains.tsx
Normal file
22
app/components/pages/Domains.tsx
Normal 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>
|
||||
)
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue