add hover color to "aidxn.cc", add tilde and "what?" links

This commit is contained in:
Aidan 2025-01-06 17:12:37 -05:00
parent 1637f64abf
commit 4b88c00919

View File

@ -4,7 +4,7 @@ import { useState } from 'react'
import Link from 'next/link' import Link from 'next/link'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faWordpressSimple } from '@fortawesome/free-brands-svg-icons' import { faWordpressSimple } from '@fortawesome/free-brands-svg-icons'
import { faLink, faHouse, faUser, faPhone, faBars, faTimes } from '@fortawesome/free-solid-svg-icons' import { faLink, faHouse, faUser, faPhone, faBars, faTimes, faTerminal } from '@fortawesome/free-solid-svg-icons'
export default function Header() { export default function Header() {
const [isOpen, setIsOpen] = useState(false) const [isOpen, setIsOpen] = useState(false)
@ -16,7 +16,7 @@ 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 flex justify-between items-center"> <nav className="container mx-auto px-4 py-6 flex justify-between items-center">
<Link href="/" className="text-gray-300 text-2xl">aidxn.cc</Link> <Link href="/" className="text-gray-300 hover:text-white text-2xl">aidxn.cc</Link>
<div className="md:hidden"> <div className="md:hidden">
<button onClick={toggleMenu} className="text-gray-300 focus:outline-none"> <button onClick={toggleMenu} className="text-gray-300 focus:outline-none">
<FontAwesomeIcon icon={isOpen ? faTimes : faBars} className="text-2xl" /> <FontAwesomeIcon icon={isOpen ? faTimes : faBars} className="text-2xl" />
@ -28,6 +28,14 @@ export default function Header() {
<li><Link href="/contact" className="flex items-center text-gray-300 hover:text-white hover:bg-gray-700 rounded-md px-3 py-2 transition-all"><FontAwesomeIcon icon={faPhone} className="text-md mr-2" /> Contact</Link></li> <li><Link href="/contact" className="flex items-center text-gray-300 hover:text-white hover:bg-gray-700 rounded-md px-3 py-2 transition-all"><FontAwesomeIcon icon={faPhone} className="text-md mr-2" /> Contact</Link></li>
<li><Link href="/domains" className="flex items-center text-gray-300 hover:text-white hover:bg-gray-700 rounded-md px-3 py-2 transition-all"><FontAwesomeIcon icon={faLink} className="text-md mr-2" /> Domains</Link></li> <li><Link href="/domains" className="flex items-center text-gray-300 hover:text-white hover:bg-gray-700 rounded-md px-3 py-2 transition-all"><FontAwesomeIcon icon={faLink} className="text-md mr-2" /> Domains</Link></li>
<li><Link href="https://blog.aidxn.fun/" className="flex items-center text-gray-300 hover:text-white hover:bg-gray-700 rounded-md px-3 py-2 transition-all"><FontAwesomeIcon icon={faWordpressSimple} className="text-md mr-2" /> Blog</Link></li> <li><Link href="https://blog.aidxn.fun/" className="flex items-center text-gray-300 hover:text-white hover:bg-gray-700 rounded-md px-3 py-2 transition-all"><FontAwesomeIcon icon={faWordpressSimple} className="text-md mr-2" /> Blog</Link></li>
<li className="flex items-center">
<Link href="https://tilde.club/~lxu" className="flex items-center text-gray-300 hover:text-white hover:bg-gray-700 rounded-md px-3 py-2 transition-all">
<FontAwesomeIcon icon={faTerminal} className="text-md mr-2" /> Tilde
</Link>
<a href="https://tilde.wiki/Tildeverse" className="text-gray-300 hover:text-green-400 ml-1" target="_blank" rel="noopener noreferrer">
<sup>what?</sup>
</a>
</li>
</ul> </ul>
</nav> </nav>
</header> </header>