fix(tabstrip): tab text alignment changes on activation (#160)

* fix(tabstrip): tab text alignment changes on activation * chore: update visual previews
telerik · May 4, 2018 · 9df8847 · 9df8847
1 parent 0a56322
commit 9df8847
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 18 deletions.
diff --git a/packages/material/scss/tabstrip/_theme.scss b/packages/material/scss/tabstrip/_theme.scss
@@ -25,6 +25,24 @@ $tabstrip-indicator-size: 2px !default;
             text-align: right;
         }
 
+        > .k-item {
+            .k-tabstrip-top & {
+                border-width: 0 0 $tabstrip-indicator-size;
+            }
+
+            .k-tabstrip-bottom & {
+                border-width: $tabstrip-indicator-size 0 0;
+            }
+
+            .k-tabstrip-left & {
+                border-width: 0 $tabstrip-indicator-size 0 0;
+            }
+
+            .k-tabstrip-right & {
+                border-width: 0 0 0 $tabstrip-indicator-size;
+            }
+        }
+
         > .k-item:not(.k-state-active) {
             opacity: .7;
         }
@@ -36,26 +54,8 @@ $tabstrip-indicator-size: 2px !default;
 
         > .k-item.k-state-active {
             .k-tabstrip & {
-                border-style: solid;
-                border-width: 0;
                 border-color: $tabstrip-indicator-color;
             }
-
-            .k-tabstrip-top & {
-                border-bottom-width: $tabstrip-indicator-size;
-            }
-
-            .k-tabstrip-bottom & {
-                border-top-width: $tabstrip-indicator-size;
-            }
-
-            .k-tabstrip-left & {
-                border-right-width: $tabstrip-indicator-size;
-            }
-
-            .k-tabstrip-right & {
-                border-left-width: $tabstrip-indicator-size;
-            }
         }
     }
 

diff --git a/tests/visual/output/material/tabstrip.png b/tests/visual/output/material/tabstrip.png