feat(header): add animated links to toolbar

Adds `AnimatedLink` component to the toolbar, allowing for
animated links to different sections of the website. This
improves the user experience and provides a more visually
appealing way to navigate the site.
This commit is contained in:
AderKonstantin
2025-03-26 00:33:37 +03:00
parent 63e4981a5c
commit 1dcf21738b

View File

@@ -6,13 +6,14 @@ import emailPic from '../../public/email.svg';
import rssPic from '../../public/rss-feed.svg'; import rssPic from '../../public/rss-feed.svg';
import supportPic from '../../public/support.svg'; import supportPic from '../../public/support.svg';
import settingsPic from '../../public/settings.svg'; import settingsPic from '../../public/settings.svg';
import AnimatedLink from '../animatedLink';
export default function Toolbar() { export default function Toolbar() {
return ( return (
<div className="flex h-24 justify-between items-center border-t-white border-t"> <div className="flex h-24 justify-between items-center border-t-white border-t">
<div className="flex items-baseline"> <div className="flex items-baseline">
<p>Software Engineer | HomeLab | Nerd</p> <p><AnimatedLink href='#'>Science</AnimatedLink> | <AnimatedLink href='#'>Software</AnimatedLink> | <AnimatedLink href='#'>Hardware</AnimatedLink> | <AnimatedLink href='#'>Rockets</AnimatedLink> | <AnimatedLink href='#'>Startups</AnimatedLink></p>
</div> </div>
<div className="flex items-baseline"> <div className="flex items-baseline">
<ul className="inline-flex items-center gap-4"> <ul className="inline-flex items-center gap-4">