From 8e1c9f36f11add0175dff815b9009f2909b33e47 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 26 Oct 2020 13:20:56 -0300
Subject: [PATCH 1/7] UI Tweaks

---
 components/core/Navbar/Navbar.module.css       |  9 +++++++++
 components/core/Navbar/Navbar.tsx              |  2 +-
 .../core/UserNav/DropdownMenu.module.css       |  4 ++++
 components/core/UserNav/DropdownMenu.tsx       | 18 ++++++++++++++----
 4 files changed, 28 insertions(+), 5 deletions(-)

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<Props> = ({ className }) => {
       <div className="flex justify-between align-center flex-row py-4 md:py-6 relative">
         <div className="flex flex-1 items-center">
           <Link href="/">
-            <a className="cursor-pointer" aria-label="Logo">
+            <a className={s.logo} aria-label="Logo">
               <Logo />
             </a>
           </Link>
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<DropdownMenuProps> = ({ open = false }) => {
   const { theme, setTheme } = useTheme()
   const logout = useLogout()
+  const { pathname } = useRouter()
+
   return (
     <Transition
       show={open}
@@ -41,11 +45,17 @@ const DropdownMenu: FC<DropdownMenuProps> = ({ open = false }) => {
       <Menu.Items className={s.dropdownMenu}>
         {LINKS.map(({ name, href }) => (
           <Menu.Item key={href}>
-            {({ active }) => (
+            <div>
               <Link href={href}>
-                <a className={cn(s.link, { [s.active]: active })}>{name}</a>
+                <a
+                  className={cn(s.link, {
+                    [s.active]: pathname === href,
+                  })}
+                >
+                  {name}
+                </a>
               </Link>
-            )}
+            </div>
           </Menu.Item>
         ))}
         <Menu.Item>

From 6e2ffa534d8c91df2981650464a5e0265483063a Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 26 Oct 2020 13:22:43 -0300
Subject: [PATCH 2/7] UI Tweaks

---
 components/core/Navbar/Navbar.module.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/core/Navbar/Navbar.module.css b/components/core/Navbar/Navbar.module.css
index 3c56c1348..f42672365 100644
--- a/components/core/Navbar/Navbar.module.css
+++ b/components/core/Navbar/Navbar.module.css
@@ -1,9 +1,9 @@
 .link {
-  @apply inline-flex items-center text-primary leading-6 font-medium transition ease-in-out duration-150 cursor-pointer;
+  @apply inline-flex items-center text-primary leading-6 font-medium transition ease-in-out duration-75 cursor-pointer text-accents-6;
 }
 
 .link:hover {
-  @apply text-accents-8;
+  @apply text-accents-9;
 }
 
 .link:focus {

From 080616bf7a0a72aff011457ea1e851d74063eff3 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 26 Oct 2020 13:33:25 -0300
Subject: [PATCH 3/7] Changes

---
 components/core/Avatar/Avatar.tsx          | 2 +-
 components/core/UserNav/UserNav.module.css | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/core/Avatar/Avatar.tsx b/components/core/Avatar/Avatar.tsx
index 3797f8073..b7928d4f2 100644
--- a/components/core/Avatar/Avatar.tsx
+++ b/components/core/Avatar/Avatar.tsx
@@ -12,7 +12,7 @@ const Avatar: FC<Props> = ({}) => {
 
   return (
     <div
-      className="inline-block h-8 w-8 rounded-full border-2 border-primary hover:border-secondary transition linear-out duration-150"
+      className="inline-block h-8 w-8 rounded-full border-2 border-primary hover:border-secondary focus:border-secondary transition linear-out duration-150"
       style={{
         backgroundImage: `linear-gradient(140deg, ${bg[0]}, ${bg[1]} 100%)`,
       }}
diff --git a/components/core/UserNav/UserNav.module.css b/components/core/UserNav/UserNav.module.css
index 4f30f5fe4..7219ecdb0 100644
--- a/components/core/UserNav/UserNav.module.css
+++ b/components/core/UserNav/UserNav.module.css
@@ -7,10 +7,10 @@
 }
 
 .item {
-  @apply mr-6 cursor-pointer relative transition ease-in-out duration-100 text-primary flex items-center outline-none;
+  @apply mr-6 cursor-pointer relative transition ease-in-out duration-100 text-primary flex items-center outline-none text-accents-6;
 
   &:hover {
-    @apply text-accents-8 transition scale-110 duration-100;
+    @apply text-accents-9 transition scale-110 duration-100;
   }
 
   &:last-child {

From 074e9c0028250a56b99d77cd145cd18217583812 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 26 Oct 2020 14:59:02 -0300
Subject: [PATCH 4/7] Added empty states

---
 components/cart/CartSidebarView/CartSidebarView.tsx |  4 ++--
 components/core/UserNav/UserNav.module.css          |  4 ++--
 pages/orders.tsx                                    | 13 ++++++++++++-
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/components/cart/CartSidebarView/CartSidebarView.tsx b/components/cart/CartSidebarView/CartSidebarView.tsx
index 9f5421519..0ac0bb0ac 100644
--- a/components/cart/CartSidebarView/CartSidebarView.tsx
+++ b/components/cart/CartSidebarView/CartSidebarView.tsx
@@ -57,13 +57,13 @@ const CartSidebarView: FC = () => {
 
       {isEmpty ? (
         <div className="flex-1 px-4 flex flex-col justify-center items-center ">
-          <span className="border border-dashed border-white rounded-full flex items-center justify-center w-16 h-16 bg-black p-12 rounded-lg text-white">
+          <span className="border border-dashed border-secondary rounded-full flex items-center justify-center w-16 h-16 p-12 bg-primary text-primary">
             <Bag className="absolute" />
           </span>
           <h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
             Your cart is empty
           </h2>
-          <p className="text-accents-3 px-10 text-center pt-2">
+          <p className="text-accents-6 px-10 text-center pt-2">
             Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
           </p>
         </div>
diff --git a/components/core/UserNav/UserNav.module.css b/components/core/UserNav/UserNav.module.css
index 7219ecdb0..8b8fa8c14 100644
--- a/components/core/UserNav/UserNav.module.css
+++ b/components/core/UserNav/UserNav.module.css
@@ -7,10 +7,10 @@
 }
 
 .item {
-  @apply mr-6 cursor-pointer relative transition ease-in-out duration-100 text-primary flex items-center outline-none text-accents-6;
+  @apply mr-6 cursor-pointer relative transition ease-in-out duration-100 text-primary flex items-center outline-none text-primary;
 
   &:hover {
-    @apply text-accents-9 transition scale-110 duration-100;
+    @apply text-accents-6 transition scale-110 duration-100;
   }
 
   &:last-child {
diff --git a/pages/orders.tsx b/pages/orders.tsx
index 87c74ac8e..37ba013a8 100644
--- a/pages/orders.tsx
+++ b/pages/orders.tsx
@@ -1,10 +1,21 @@
 import { Layout } from '@components/core'
 import { Container, Text } from '@components/ui'
-
+import { Bag } from '@components/icons'
 export default function Orders() {
   return (
     <Container>
       <Text variant="pageHeading">My Orders</Text>
+      <div className="flex-1 p-24 flex flex-col justify-center items-center ">
+        <span className="border border-dashed border-secondary rounded-full flex items-center justify-center w-16 h-16 p-12 bg-primary text-primary">
+          <Bag className="absolute" />
+        </span>
+        <h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
+          No orders found
+        </h2>
+        <p className="text-accents-6 px-10 text-center pt-2">
+          Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
+        </p>
+      </div>
     </Container>
   )
 }

From 14cea1fb2780efd6125cb972978f2153c89845cd Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 26 Oct 2020 14:59:35 -0300
Subject: [PATCH 5/7] Added empty states

---
 components/cart/CartSidebarView/CartSidebarView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/cart/CartSidebarView/CartSidebarView.tsx b/components/cart/CartSidebarView/CartSidebarView.tsx
index 0ac0bb0ac..ae9eb043e 100644
--- a/components/cart/CartSidebarView/CartSidebarView.tsx
+++ b/components/cart/CartSidebarView/CartSidebarView.tsx
@@ -116,7 +116,7 @@ const CartSidebarView: FC = () => {
                 </li>
                 <li className="flex justify-between py-1">
                   <span>Estimated Shipping</span>
-                  <span>FREE</span>
+                  <span className="font-bold tracking-wide">FREE</span>
                 </li>
               </ul>
               <div className="flex justify-between border-t border-accents-3 py-3 font-bold mb-10">

From 836ff1cea20e47ba19833519b325c3802447ed35 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 26 Oct 2020 15:14:36 -0300
Subject: [PATCH 6/7] Changes

---
 components/cart/CartSidebarView/CartSidebarView.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/cart/CartSidebarView/CartSidebarView.tsx b/components/cart/CartSidebarView/CartSidebarView.tsx
index ae9eb043e..fc9b212fa 100644
--- a/components/cart/CartSidebarView/CartSidebarView.tsx
+++ b/components/cart/CartSidebarView/CartSidebarView.tsx
@@ -57,13 +57,13 @@ const CartSidebarView: FC = () => {
 
       {isEmpty ? (
         <div className="flex-1 px-4 flex flex-col justify-center items-center ">
-          <span className="border border-dashed border-secondary rounded-full flex items-center justify-center w-16 h-16 p-12 bg-primary text-primary">
+          <span className="border border-dashed border-black rounded-full flex items-center justify-center w-16 h-16 p-12 bg-white text-black">
             <Bag className="absolute" />
           </span>
           <h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
             Your cart is empty
           </h2>
-          <p className="text-accents-6 px-10 text-center pt-2">
+          <p className="text-accents-3 px-10 text-center pt-2">
             Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
           </p>
         </div>

From daaa2a483f20480297f9cb81a7e50b6a755d8b9a Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 26 Oct 2020 15:20:15 -0300
Subject: [PATCH 7/7] Changes

---
 components/cart/CartSidebarView/CartSidebarView.tsx | 4 ++--
 pages/cart.tsx                                      | 6 +++---
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/components/cart/CartSidebarView/CartSidebarView.tsx b/components/cart/CartSidebarView/CartSidebarView.tsx
index fc9b212fa..7440a8d81 100644
--- a/components/cart/CartSidebarView/CartSidebarView.tsx
+++ b/components/cart/CartSidebarView/CartSidebarView.tsx
@@ -33,7 +33,7 @@ const CartSidebarView: FC = () => {
   return (
     <div
       className={cn('h-full flex flex-col', {
-        'bg-white text-black': isEmpty,
+        'bg-secondary text-secondary': isEmpty,
         'bg-red text-white': error,
         'bg-green text-white': success,
       })}
@@ -57,7 +57,7 @@ const CartSidebarView: FC = () => {
 
       {isEmpty ? (
         <div className="flex-1 px-4 flex flex-col justify-center items-center ">
-          <span className="border border-dashed border-black rounded-full flex items-center justify-center w-16 h-16 p-12 bg-white text-black">
+          <span className="border border-dashed border-primary rounded-full flex items-center justify-center w-16 h-16 p-12 bg-secondary text-secondary">
             <Bag className="absolute" />
           </span>
           <h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
diff --git a/pages/cart.tsx b/pages/cart.tsx
index 7fee8176d..62fd618b4 100644
--- a/pages/cart.tsx
+++ b/pages/cart.tsx
@@ -41,14 +41,14 @@ export default function Cart({}: InferGetStaticPropsType<
     <div className="grid lg:grid-cols-12">
       <div className="lg:col-span-8">
         {isEmpty ? (
-          <div className="flex-1 px-4 flex flex-col justify-center items-center ">
-            <span className="border border-dashed border-white rounded-full flex items-center justify-center w-16 h-16 bg-black p-12 rounded-lg text-white">
+          <div className="flex-1 px-12 py-24 flex flex-col justify-center items-center ">
+            <span className="border border-dashed border-secondary rounded-full flex items-center justify-center w-16 h-16 bg-primary p-12 rounded-lg text-primary">
               <Bag className="absolute" />
             </span>
             <h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
               Your cart is empty
             </h2>
-            <p className="text-accents-2 px-10 text-center pt-2">
+            <p className="text-accents-6 px-10 text-center pt-2">
               Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
             </p>
           </div>