Update brand store side nav (#4371)

canonical · Aug 8, 2023 · 255fdbd · 255fdbd
1 parent 8f46b34
commit 255fdbd
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 37 deletions.
diff --git a/static/js/brand-store/components/Navigation/Navigation.tsx b/static/js/brand-store/components/Navigation/Navigation.tsx
@@ -54,7 +54,7 @@ function Navigation() {
             </div>
 
             <div className="p-panel__content">
-              <div className="p-side-navigation--icons">
+              <div className="p-side-navigation">
                 <nav aria-label="Stores navigation">
                   <ul className="p-side-navigation__list">
                     {brandStoresList.map((item: Store) => {
@@ -64,9 +64,6 @@ function Navigation() {
                             className="p-side-navigation__link"
                             to={`/admin/${item.id}/snaps`}
                           >
-                            <i className="p-side-navigation__icon p-icon--initial">
-                              <span>{item.name.charAt(0)}</span>
-                            </i>
                             <span className="p-side-navigation__label u-truncate">
                               {item.name}
                             </span>

diff --git a/static/sass/_patterns_icons.scss b/static/sass/_patterns_icons.scss
@@ -1,18 +1,4 @@
 @mixin snapcraft-p-icons {
-  .p-icon--initial {
-    @extend %vf-is-bordered;
-    @extend %vf-bg--x-light;
-    @extend %small-text;
-
-    border-radius: 100%;
-    font-style: normal;
-    height: 1.5rem;
-    margin-bottom: 0;
-    text-align: center;
-    text-transform: uppercase;
-    width: 1.5rem;
-  }
-
   .p-icon--snapcraft-cube {
     @extend %icon;
 

diff --git a/static/sass/_snapcraft_l-application.scss b/static/sass/_snapcraft_l-application.scss
@@ -100,25 +100,6 @@
     .p-panel__logo-icon {
       width: 1.5rem;
     }
-
-    .p-side-navigation__link {
-      &.is-active,
-      &[aria-current="page"],
-      &[aria-current="true"] {
-        @include vf-highlight-bar(#82bfa1, left);
-      }
-    }
-
-    .p-side-navigation--icons {
-      .p-side-navigation__icon {
-        left: 1.25rem;
-        top: 0.25rem;
-      }
-
-      .p-side-navigation__link {
-        padding-left: 3.25rem;
-      }
-    }
   }
 
   .l-aside {

diff --git a/static/sass/styles.scss b/static/sass/styles.scss
@@ -455,3 +455,8 @@ code {
 .p-navigation__row.is-full-width {
   max-width: 100%;
 }
+
+// Vanilla override
+.p-panel__logo {
+  margin-left: 0;
+}