crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-03-14 22:42:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Latest updates

Browse Source
This commit is contained in:
Belen Curcio 2020-10-24 17:06:20 -03:00
parent 34f270a353
commit 8bb39b3a83
3 changed files with 18 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/core/I18nWidget/I18nWidget.module.css
View File

@ -3,7 +3,7 @@
}
.button {
@apply h-10 px-2 rounded-md border border-accents-2 flex items-center space-x-2 justify-center;
@apply h-10 px-2 rounded-md border border-accents-2 flex items-center space-x-2 justify-center outline-none focus:outline-none;
}
.dropdownMenu {

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

@ -2,9 +2,6 @@
@apply relative;
}
.mainContainer {
}
.list {
@apply flex flex-row items-center justify-items-end h-full;
}
@ -25,3 +22,11 @@
@apply outline-none;
}
}
.bagCount {
@apply border border-accents-1 bg-secondary text-secondary h-4 w-4 absolute rounded-full right-3 top-3 flex items-center justify-center font-bold text-xs;
}
.avatarButton {
@apply inline-flex justify-center rounded-full outline-none focus:outline-none;
}

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

@ -20,7 +20,6 @@ const countItems = (count: number, items: any[]) =>
const UserNav: FC<Props> = ({ className, children, ...props }) => {
const { data } = useCart()
const { openSidebar, closeSidebar, displaySidebar } = useUI()
const itemsCount = Object.values(data?.line_items ?? {}).reduce(countItems, 0)
return (
@ -32,11 +31,7 @@ const UserNav: FC<Props> = ({ className, children, ...props }) => {
onClick={() => (displaySidebar ? closeSidebar() : openSidebar())}
>
<Bag />
{itemsCount > 0 && (
<span className="border border-accent-1 bg-secondary text-secondary h-4 w-4 absolute rounded-full right-3 top-3 flex items-center justify-center font-bold text-xs">
{itemsCount}
</span>
)}
{itemsCount > 0 && <span className={s.bagCount}>{itemsCount}</span>}
</li>
<Link href="/wishlist">
<li className={s.item}>
@ -45,16 +40,14 @@ const UserNav: FC<Props> = ({ className, children, ...props }) => {
</Link>
<li className={s.item}>
<Menu>
{({ open }) => {
return (
<>
<Menu.Button className="inline-flex justify-center rounded-full">
<Avatar />
</Menu.Button>
<DropdownMenu open={open} />
</>
)
}}
{({ open }) => (
<>
<Menu.Button className={s.avatarButton}>
<Avatar />
</Menu.Button>
<DropdownMenu open={open} />
</>
)}
</Menu>
</li>
</ul>