more

mitodl · Sep 18, 2023 · 6929a0e · 6929a0e
1 parent 89578f7
commit 6929a0e
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 64 deletions.
diff --git a/frontend/public/scss/top-app-bar.scss b/frontend/public/scss/top-app-bar.scss
@@ -274,70 +274,6 @@ header.site-header.new-design {
     flex-wrap: unset;
   }
 }
-.top-user-menu .dropdown-menu {
-  margin-top: 17px;
-  padding: 0;
-  display: none;
-
-  .dropdown-item {
-    display: block;
-    padding: 10px 15px;
-  }
-  &.show {
-    display: block;
-    box-shadow: none;
-    border-radius: 0 0 3px 3px;
-  }
-}
-.top-user-menu.dropdown {
-  @include media-breakpoint-down(sm) {
-    display: none;
-  }
-  .dropdown-toggle.user-menu-button {
-    &.show {
-      &:after {
-        border-color: $primary;
-        transform: rotate(45deg);
-        margin-top: 1px;
-      }
-    }
-  }
-  .dropdown-toggle {
-    max-width: 40ch;
-    padding: 0;
-    font-weight: 600;
-    text-overflow: ellipsis;
-    position: relative;
-    display: flex;
-    align-items: center;
-    padding-right: 15px;
-
-    &:after {
-      border: 1px;
-      border-top: 1px solid black;
-      border-left: 1px solid black;
-      width: 8px;
-      height: 8px;
-      transform: rotate(225deg);
-      margin-left: 10px;
-      transition: 0.5s;
-    }
-
-    &:hover {
-      cursor: pointer;
-    }
-  }
-}
-
-.user-menu-button {
-
-  @include media-breakpoint-down(sm) {
-    display: none;
-  }
-
-  border-color: transparent;
-  background-color: inherit;
-}
 
 .full-screen-top-menu {
   display: block;

diff --git a/frontend/public/scss/user-menu.scss b/frontend/public/scss/user-menu.scss
@@ -84,3 +84,59 @@
   border-color: transparent;
   background-color: inherit;
 }
+
+// New design
+.top-user-menu .dropdown-menu {
+  margin-top: 17px;
+  padding: 0;
+  display: none;
+
+  .dropdown-item {
+    display: block;
+    padding: 15px 20px;
+  }
+  &.show {
+    display: block;
+    box-shadow: none;
+    border-radius: 0 0 3px 3px;
+  }
+}
+.top-user-menu.dropdown {
+  @include media-breakpoint-down(sm) {
+    display: none;
+  }
+  .dropdown-toggle.user-menu-button {
+    &.show {
+      &:after {
+        border-color: $primary;
+        transform: rotate(45deg);
+        margin-top: 1px;
+      }
+    }
+  }
+  .dropdown-toggle {
+    max-width: 40ch;
+    padding: 0;
+    font-weight: 600;
+    text-overflow: ellipsis;
+    position: relative;
+    display: flex;
+    align-items: center;
+    padding-right: 15px;
+
+    &:after {
+      border: 1px;
+      border-top: 1px solid black;
+      border-left: 1px solid black;
+      width: 8px;
+      height: 8px;
+      transform: rotate(225deg);
+      margin-left: 10px;
+      transition: 0.5s;
+    }
+
+    &:hover {
+      cursor: pointer;
+    }
+  }
+}