diff --git a/components/core/Navbar/Navbar.module.css b/components/core/Navbar/Navbar.module.css index f24ae8df6..3c56c1348 100644 --- a/components/core/Navbar/Navbar.module.css +++ b/components/core/Navbar/Navbar.module.css @@ -9,3 +9,12 @@ .link:focus { @apply outline-none text-accents-8; } + +.logo { + @apply cursor-pointer rounded-full border transform duration-100 ease-in-out; + + &:hover { + @apply shadow-md; + transform: scale(1.05); + } +} diff --git a/components/core/Navbar/Navbar.tsx b/components/core/Navbar/Navbar.tsx index f9c726f40..25dca71cd 100644 --- a/components/core/Navbar/Navbar.tsx +++ b/components/core/Navbar/Navbar.tsx @@ -15,7 +15,7 @@ const Navbar: FC = ({ className }) => {
- + diff --git a/components/core/UserNav/DropdownMenu.module.css b/components/core/UserNav/DropdownMenu.module.css index 755d34974..f81b920ef 100644 --- a/components/core/UserNav/DropdownMenu.module.css +++ b/components/core/UserNav/DropdownMenu.module.css @@ -15,6 +15,10 @@ @apply bg-accents-1; } +.link.active { + @apply font-bold bg-accents-2; +} + .off { @apply hidden; } diff --git a/components/core/UserNav/DropdownMenu.tsx b/components/core/UserNav/DropdownMenu.tsx index dbdf960da..82121605e 100644 --- a/components/core/UserNav/DropdownMenu.tsx +++ b/components/core/UserNav/DropdownMenu.tsx @@ -6,6 +6,8 @@ import s from './DropdownMenu.module.css' import { Moon, Sun } from '@components/icons' import { Menu, Transition } from '@headlessui/react' import useLogout from '@lib/bigcommerce/use-logout' +import { useRouter } from 'next/router' + interface DropdownMenuProps { open: boolean } @@ -20,7 +22,7 @@ const LINKS = [ href: '/profile', }, { - name: 'Cart', + name: 'My Cart', href: '/cart', }, ] @@ -28,6 +30,8 @@ const LINKS = [ const DropdownMenu: FC = ({ open = false }) => { const { theme, setTheme } = useTheme() const logout = useLogout() + const { pathname } = useRouter() + return ( = ({ open = false }) => { {LINKS.map(({ name, href }) => ( - {({ active }) => ( +
- {name} + + {name} + - )} +
))}