navbar user dropdown, add to cart

1 files changed, 37 insertions, 2 deletions

diff --git a/src/styles/globals.css b/src/styles/globals.css
index 63fa729e..06a9420c 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -425,7 +425,40 @@ button {
     @apply odd:bg-gray_r-3 even:bg-gray_r-1;
 }
 
-.category-mega-box-wrapper {
+.navbar-user-dropdown-button {
+    @apply flex-1
+        flex
+        gap-x-2
+        p-4
+        items-center
+        bg-red_r-11
+        !text-gray_r-1
+        rounded-none
+        rounded-tr-xl;
+}
+
+.navbar-user-dropdown-button span {
+    @apply line-clamp-1;
+}
+
+.navbar-user-dropdown-wrapper a {
+    @apply text-gray_r-12/80 hover:text-red_r-11 font-medium;
+}
+
+.navbar-user-dropdown {
+    @apply bg-white
+        border
+        border-gray_r-6
+        p-4
+        w-full
+        flex
+        flex-col
+        gap-y-3
+        shadow;
+}
+
+.category-mega-box-wrapper,
+.navbar-user-dropdown-wrapper {
     @apply absolute
         opacity-0
         left-0
@@ -440,7 +473,9 @@ button {
         text-left;
 }
 
-.category-mega-box-wrapper.show {
+.category-mega-box-wrapper.show,
+.navbar-user-dropdown-button:hover ~ .navbar-user-dropdown-wrapper,
+.navbar-user-dropdown-wrapper:hover {
     @apply top-[100%]
         opacity-100
         pointer-events-auto;