cx/commerce
4
0
Fork 0
forked from crowetic/commerce
Code Pull Requests Activity

navBar

Browse Source
This commit is contained in:
Belen Curcio 2020-10-21 14:24:42 -03:00
parent b9ca1f275d
commit 5bbe5d21b0
2 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/core/UserNav/UserNav.module.css
View File

@ -1,4 +1,5 @@
.root { .root {
@apply relative;
} }
.list { .list {
@ -20,6 +21,10 @@
@apply absolute right-0 mt-2 w-screen max-w-xs sm:px-0 z-50 border border-accents-1 bg-primary; @apply absolute right-0 mt-2 w-screen max-w-xs sm:px-0 z-50 border border-accents-1 bg-primary;
max-width: 160px; max-width: 160px;
&.dropdownMenuContainer {
@apply shadow-lg overflow-hidden relative grid py-2;
}
& .link { & .link {
@apply px-6 py-3 block space-y-1 hover:bg-accents-1 transition ease-in-out duration-150 text-base leading-6 font-medium text-gray-900; @apply px-6 py-3 block space-y-1 hover:bg-accents-1 transition ease-in-out duration-150 text-base leading-6 font-medium text-gray-900;
} }

24
components/core/UserNav/UserNav.tsx
View File

@ -52,19 +52,17 @@ const UserNav: FC<Props> = ({ className }) => {
{displayDropdown && ( {displayDropdown && (
<div className={s.dropdownMenu}> <div className={s.dropdownMenu}>
<div className="shadow-lg overflow-hidden"> <nav className={s.dropdownMenuContainer}>
<nav className="relative grid bg-primary py-2"> <Link href="#">
<Link href="#"> <a className={s.link}>My Purchases</a>
<a className={s.link}>My Purchases</a> </Link>
</Link> <Link href="#">
<Link href="#"> <a className={s.link}>My Account</a>
<a className={s.link}>My Account</a> </Link>
</Link> <Link href="#">
<Link href="#"> <a className={cn(s.link, 'mt-4')}>Logout</a>
<a className={cn(s.link, 'mt-4')}>Logout</a> </Link>
</Link> </nav>
</nav>
</div>
</div> </div>
)} )}
</nav> </nav>