Skip to content

Commit

Permalink
Added icons on the navbar
Browse files Browse the repository at this point in the history
  • Loading branch information
harshmishra19 committed May 14, 2024
1 parent e44753d commit 965de81
Showing 1 changed file with 8 additions and 5 deletions.
13 changes: 8 additions & 5 deletions src/components/Navbar.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,24 +8,27 @@ const Navbar = () => {

return (
<nav className="z-50 h-16 flex justify-center sticky top-0 w-screen backdrop-filter backdrop-blur-lg bg-opacity-40 p-4">
<style>
@import url('https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css');
</style>
<ul className="flex flex-col md:flex-row justify-center items-center list-none m-0 p-4 gap-x-0 md:gap-x-10 text-sm md:text-base lg:text-lg xl:text-xl 2xl:text-3xl">
<li className="hover:underline block md:hidden">
<span className="fa fa-bars"></span>
</li>
<li className="hover:underline hidden md:block">
<NavLink to="/" className={isActive('/')}>Home</NavLink>
<NavLink to="/" className={isActive('/')}><i class="ri-home-fill"></i> Home</NavLink>
</li>
<li className="hover:underline hidden md:block">
<NavLink to="/AboutUs" className={isActive('/AboutUs')}>About Us</NavLink>
<NavLink to="/AboutUs" className={isActive('/AboutUs')}><i class="ri-building-fill"></i> About Us</NavLink>
</li>
<li className="hover:underline hidden md:block">
<NavLink to="/DemoSection" className={isActive('/DemoSection')}>Demo Section</NavLink>
<NavLink to="/DemoSection" className={isActive('/DemoSection')}><i class="ri-service-fill"></i> Demo Section</NavLink>
</li>
<li className="hover:underline hidden md:block">
<NavLink to="/Models" className={isActive('/Models')}>Models</NavLink>
<NavLink to="/Models" className={isActive('/Models')}><i class="ri-layout-2-fill"></i> Models</NavLink>
</li>
<li className="hover:underline hidden md:block">
<NavLink to="/ContactUs" className={isActive('/ContactUs')}>Contact Us</NavLink>
<NavLink to="/ContactUs" className={isActive('/ContactUs')}><i class="ri-customer-service-2-fill"></i> Contact Us</NavLink>
</li>
</ul>
</nav>
Expand Down

0 comments on commit 965de81

Please sign in to comment.