feat: update app pages and styles

This commit is contained in:
2026-05-29 18:57:07 -07:00
parent ab36d99ba3
commit 9222292b9f
4 changed files with 72 additions and 59 deletions
+48 -37
View File
@@ -27,7 +27,7 @@ export const metadata: Metadata = {
export default function AboutPage() {
return (
<div className="space-y-14">
<div className="flex flex-col gap-12">
{/* Hero Section */}
<Hero label="About">
@@ -68,47 +68,58 @@ export default function AboutPage() {
</ul>
</section>
<AccentLink link="/Angel_Mankel_Resume_2026.pdf" label="Download CV (PDF)" download />
<div className="flex flex-col gap-6">
<AccentLink link="/Angel_Mankel_Resume_2026.pdf" label="Download Resume (PDF)" download />
<div className="flex flex-col gap-2 text-neutral-300">
<p>
<span className="font-bold">Email:</span> {email}
</p>
<p>
<span className="font-bold">Phone:</span> {phone}
</p>
</div>
{/* Social Links */}
<nav aria-label="Contact" className="flex gap-5 text-neutral-300">
<CopyButton
value={email}
label="Copy email"
className={`hover:text-neutral-200 rounded-md hover:bg-[${colors.accent}] p-1 transition-colors duration-200`}
>
<IconMailFilled size={32} />
</CopyButton>
<CopyButton
value={phone}
label="Copy phone"
className={`hover:text-neutral-200 rounded-md hover:bg-[${colors.accent}] p-1 transition-colors duration-200`}
>
<IconPhoneFilled size={32} />
</CopyButton>
<Tooltip text="LinkedIn">
<a
href={linkedIn}
target="_blank"
rel="noreferrer"
aria-label="LinkedIn"
{/* Social Links */}
<nav aria-label="Contact" className="flex gap-5 text-neutral-300">
<CopyButton
value={email}
label="Copy email"
className={`hover:text-neutral-200 rounded-md hover:bg-[${colors.accent}] p-1 transition-colors duration-200`}
>
<IconBrandLinkedinFilled size={32} />
</a>
</Tooltip>
<Tooltip text="Gitea">
<a
href={gitea}
target="_blank"
rel="noreferrer"
aria-label="Gitea"
<IconMailFilled size={32} />
</CopyButton>
<CopyButton
value={phone}
label="Copy phone"
className={`hover:text-neutral-200 rounded-md hover:bg-[${colors.accent}] p-1 transition-colors duration-200`}
>
<GiteaIcon size={32} />
</a>
</Tooltip>
</nav>
<IconPhoneFilled size={32} />
</CopyButton>
<Tooltip text="LinkedIn">
<a
href={linkedIn}
target="_blank"
rel="noreferrer"
aria-label="LinkedIn"
className={`hover:text-neutral-200 rounded-md hover:bg-[${colors.accent}] p-1 transition-colors duration-200`}
>
<IconBrandLinkedinFilled size={32} />
</a>
</Tooltip>
<Tooltip text="Gitea">
<a
href={gitea}
target="_blank"
rel="noreferrer"
aria-label="Gitea"
className={`hover:text-neutral-200 rounded-md hover:bg-[${colors.accent}] p-1 transition-colors duration-200`}
>
<GiteaIcon size={32} />
</a>
</Tooltip>
</nav>
</div>
</div>
);
}