menu updated

deshapriyakhatua · Nov 27, 2023 · c9c7c2f · c9c7c2f
1 parent b65f33f
commit c9c7c2f
Show file tree

Hide file tree

Showing 2 changed files with 169 additions and 99 deletions.
diff --git a/assets/css/styles.css b/assets/css/styles.css
@@ -30,6 +30,7 @@
     --normal-font-size: .9rem;
     --small-font-size: .875rem;
     --smaller-font-size: .813rem;
+    --font-thin: 400;
   }
 }
 
@@ -68,6 +69,12 @@ a {
   background-color: var(--body-color);
   z-index: var(--z-fixed);
 }
+/* stop text selection*/
+.header * {
+  -webkit-user-select: none; /* Safari */
+  -ms-user-select: none; /* IE 10 and IE 11 */
+  user-select: none; /* Standard syntax */
+}
 
 /*=============== NAV ===============*/
 .nav {
@@ -194,10 +201,7 @@ a {
 .dropdown__group:last-child {
   margin-bottom: 1.25rem;
 }
-.dropdown__icon i {
-  font-size: 1.25rem;
-  color: var(--first-color);
-}
+
 .dropdown__title {
   font-size: var(--small-font-size);
   font-weight: var(--font-semi-bold);
@@ -259,10 +263,9 @@ a {
 
 #navbar_profile_search > #navbar_search_dropdown{
   position: absolute;
-  width: var(--main-navbar-width);
   width: 100%;
-  padding: 1rem;
-  top: 110%;
+  padding: 2rem 1rem;
+  top: 100%;
   left: 50%;
   transform: translate(-50%, 0);
   display: flex;
@@ -346,11 +349,11 @@ a {
 }
 
 #navbar_profile_account > #navbar_account_dropdown{
-  height: 250px;
-  padding: 20px;
+  height: 15rem;
+  padding: 2rem 1rem;
   position: absolute;
-  top: 110%;
-  right: 0;
+  top: 100%;
+  right: -1rem;
   display: flex;
   flex-direction: column;
   justify-content: space-around;
@@ -443,17 +446,20 @@ a {
     left: 0;
     right: 0;
     top: 6.5rem;
-    background-color: var(--body-color);
-    box-shadow: 0 6px 8px hsla(220, 68%, 12%, 0.05);
+    padding-bottom: 1rem;
+    background-color: transparent;
     pointer-events: none;
     opacity: 0;
     transition: top 0.4s, opacity 0.3s;
   }
   .dropdown__content {
     grid-template-columns: repeat(4, max-content);
     column-gap: 6rem;
-    max-width: 1120px;
+    width: calc(2rem + var(--main-navbar-width));
     margin-inline: auto;
+    padding: 0 2rem;
+    background-color: white;
+    box-shadow: 0 6px 8px hsla(220, 68%, 12%, 0.05);
   }
   .dropdown__group {
     padding: 4rem 0;
@@ -466,24 +472,16 @@ a {
   .dropdown__list {
     row-gap: 0.75rem;
   }
-  .dropdown__icon {
-    width: 60px;
-    height: 60px;
-    background-color: var(--first-color-lighten);
-    border-radius: 50%;
-    display: grid;
-    place-items: center;
-    margin-bottom: 1rem;
-  }
-  .dropdown__icon i {
-    font-size: 2rem;
-  }
+
   .dropdown__title {
     font-size: var(--normal-font-size);
+    color: var(--text-color);
   }
   .dropdown__link {
     font-size: var(--small-font-size);
+    font-weight: var(--font-thin);
   }
+
   .dropdown__link:hover {
     color: var(--first-color);
   }
@@ -500,7 +498,7 @@ a {
     cursor: initial;
   }
   #navbar_profile_search > #navbar_search_dropdown {
-    width: var(--main-navbar-width);
+    width: calc(2rem + var(--main-navbar-width));
   }
   #search_bar_input_container > #search_bar_input {
     font-size: var(--small-font-size);