Fix navigation text alignment.

RedHatInsights · Sep 11, 2020 · 7587d9f · 7587d9f
1 parent 79c79fe
commit 7587d9f
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 2 deletions.
diff --git a/src/js/App/Sidenav/Navigation.js b/src/js/App/Sidenav/Navigation.js
@@ -100,6 +100,7 @@ export class Navigation extends Component {
                             if (!(item.disabled_on_stable && window.location.pathname.indexOf('/beta') === -1)) {
                                 if (item.subItems) {
                                     return <NavExpandable
+                                        className="ins-m-navigation-align"
                                         title={item.title}
                                         ouia-nav-group={item.id}
                                         itemID={item.id}

diff --git a/src/js/App/Sidenav/__snapshots__/Navigation.test.js.snap b/src/js/App/Sidenav/__snapshots__/Navigation.test.js.snap
@@ -244,7 +244,7 @@ exports[`Navigation should render corectly 1`] = `
     ariaRightScroll="Scroll right"
   >
     <NavExpandable
-      className=""
+      className="ins-m-navigation-align"
       groupId={null}
       id=""
       isActive={true}
@@ -351,7 +351,7 @@ exports[`Navigation should render correctly 2 1`] = `
     ariaRightScroll="Scroll right"
   >
     <NavExpandable
-      className=""
+      className="ins-m-navigation-align"
       groupId={null}
       id=""
       isActive={true}

diff --git a/src/sass/chrome.scss b/src/sass/chrome.scss
@@ -178,3 +178,10 @@ section.ins-c-app-switcher--loading {
       .ins-c-tagfilter__option-value { max-width: 360px; }
     }
 }
+
+// PF navigation text alignment fix
+.ins-m-navigation-align {
+    .pf-c-nav__link {
+        text-align: inherit;
+    }
+}