Fix margin for KuiLocalTabs which are applied to typographic elements. (

#14451)
elastic · Oct 12, 2017 · e3292cf · e3292cf
1 parent 448fb5e
commit e3292cf
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/ui_framework/dist/ui_framework.css b/ui_framework/dist/ui_framework.css
@@ -2739,13 +2739,20 @@ main {
           align-items: flex-end;
   height: 100%; }
 
+/**
+   * 1. Override inherited typographic styles.
+   */
 .kuiLocalTab {
   padding: 5px 0 6px 0;
   font-size: 18px;
   color: #3F3F3F;
   border-bottom: 2px solid transparent;
   text-decoration: none;
   cursor: pointer;
+  margin-top: 0 !important;
+  /* 1 */
+  margin-bottom: 0 !important;
+  /* 1 */
   /**
      * 1. We may want to show a tooltip to explain why the tab is disabled, so we will just show
      *    a regular cursor instead of setting pointer-events: none.

diff --git a/ui_framework/src/components/local_nav/_local_tabs.scss b/ui_framework/src/components/local_nav/_local_tabs.scss
@@ -7,13 +7,18 @@
   height: 100%;
 }
 
+  /**
+   * 1. Override inherited typographic styles.
+   */
   .kuiLocalTab {
     padding: 5px 0 6px 0;
     font-size: 18px;
     color: $localTabTextColor;
     border-bottom: 2px solid transparent;
     text-decoration: none;
     cursor: pointer;
+    margin-top: 0 !important; /* 1 */
+    margin-bottom: 0 !important; /* 1 */
 
     &:hover:not(.kuiLocalTab-isDisabled),
     &:active:not(.kuiLocalTab-isDisabled) {