aidan/aidxnCC
1
1
Fork 0
Code Issues 1 Pull requests 1 Projects Releases Packages Wiki Activity Actions

header improvements, add error handling for images on about page, update deps

Browse source
This commit is contained in:
Aidan 2025-01-11 00:08:47 -05:00
parent c32abf7eba
commit 1950e8fca9
5 changed files with 79 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

32
app/components/pages/About.tsx
View file

@ -1,9 +1,13 @@
"use client"
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faUser } from '@fortawesome/free-solid-svg-icons'
import GitHubFeatured from '../widgets/GitHubFeatured'
import Image from 'next/image'
import { useState } from 'react'
export default function About() {
const [imageError, setImageError] = useState(false);
return (
<div className="max-w-2xl mx-auto text-center">
<FontAwesomeIcon icon={faUser} className="text-6xl mb-6" />
@ -29,10 +33,28 @@ export default function About() {
<div className="mt-12">
<h2 className="text-2xl font-semibold mb-4 text-gray-200">My GitHub Contributions</h2>
<p className="text-gray-300 mb-4">You can find me on GitHub as <a href="https://github.com/ihatenodejs/" className="text-blue-400 hover:underline">ihatenodejs</a>.</p>
<div className="flex flex-col md:flex-row justify-center gap-4">
<Image src="https://github-readme-stats.vercel.app/api?username=ihatenodejs&theme=dark&show_icons=true&hide_border=true&count_private=true" alt="ihatenodejs's Stats" width={500} height={200} className="w-full md:w-1/2" />
<Image src="https://github-readme-stats.vercel.app/api/top-langs/?username=ihatenodejs&theme=dark&show_icons=true&hide_border=true&layout=compact" alt="ihatenodejs's Top Languages" width={500} height={200} className="w-full md:w-1/3" />
</div>
{!imageError && (
<div className="flex flex-col md:flex-row justify-center gap-4">
<img
src="https://github-readme-stats.vercel.app/api?username=ihatenodejs&theme=dark&show_icons=true&hide_border=true&count_private=true"
alt="ihatenodejs's Stats"
width={500}
height={200}
className="w-full md:w-1/2"
onError={() => setImageError(true)}
loading="eager"
/>
<img
src="https://github-readme-stats.vercel.app/api/top-langs/?username=ihatenodejs&theme=dark&show_icons=true&hide_border=true&layout=compact"
alt="ihatenodejs's Top Languages"
width={500}
height={200}
className="w-full md:w-1/3"
onError={() => setImageError(true)}
loading="eager"
/>
</div>
)}
</div>
<div className="mt-12">
<h2 className="text-2xl font-semibold mb-4 text-gray-200">Featured Projects</h2>