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

Merge pull request #1 from GiovaniFZ/main

Browse source 
style: header: align fontawesome icon with the name on responsive design
This commit is contained in:
Aidan 2025-01-05 22:30:49 -05:00 • committed by GitHub
commit 826d1d4b7d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 5 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
app/components/Header.tsx
View file

@ -6,11 +6,11 @@ export default function Header() {
return ( return (
<header className="bg-gray-800"> <header className="bg-gray-800">
<nav className="container mx-auto px-4 py-6"> <nav className="container mx-auto px-4 py-6">
<ul className="flex space-x-6"> <ul className="flex space-x-12">
<li><Link href="/" className="text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faHouse} className="text-md mr-1" /> Home</Link></li> <li><Link href="/" className="flex flex-col sm:flex-row items-center text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faHouse} className="text-md mr-2" /> Home</Link></li>
<li><Link href="/about" className="text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faUser} className="text-md mr-1" /> About</Link></li> <li><Link href="/about" className="flex flex-col sm:flex-row items-center text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faUser} className="text-md mr-2" /> About</Link></li>
<li><Link href="/contact" className="text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faPhone} className="text-md mr-1" /> Contact</Link></li> <li><Link href="/contact" className="flex flex-col sm:flex-row items-center text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faPhone} className="text-md mr-2" /> Contact</Link></li>
<li><Link href="/domains" className="text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faLink} className="text-md mr-1" /> Domains</Link></li> <li><Link href="/domains" className="flex flex-col sm:flex-row items-center text-gray-300 hover:text-white transition-colors"><FontAwesomeIcon icon={faLink} className="text-md mr-2" /> Domains</Link></li>
</ul> </ul>
</nav> </nav>
</header> </header>