[Tabs] .pt-large .pt-tab uses simple nesting (#862)

* .pt-large .pt-tab uses simple nesting * no .pt-tab-list involved! so in `Tabs2` you can put the class on the top element.
palantir · Mar 20, 2017 · 6fcf038 · 6fcf038 · blueprint-bot · Mar 20, 2017
1 parent 8b66897
commit 6fcf038
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/packages/core/examples/tabs2Example.tsx b/packages/core/examples/tabs2Example.tsx
@@ -42,6 +42,7 @@ export class Tabs2Example extends BaseExample<ITabs2ExampleState> {
                         {/* controlled mode & no panels (see h1 below): */}
                         <Tabs2
                             animate={this.state.animate}
+                            className={Classes.LARGE}
                             id="navbar"
                             onChange={this.handleNavbarTabChange}
                             selectedTabId={this.state.navbarTabId}

diff --git a/packages/core/src/components/tabs/_tabs.scss b/packages/core/src/components/tabs/_tabs.scss
@@ -212,11 +212,6 @@ $tab-indicator-width: 3px !default;
   padding: 0;
   list-style: none;
 
-  &.pt-large .pt-tab {
-    line-height: $pt-button-height-large;
-    font-size: $pt-font-size-large;
-  }
-
   // this is fine.
   // stylelint-disable-next-line selector-no-universal
   > *:not(:last-child) {
@@ -238,9 +233,8 @@ $tab-indicator-width: 3px !default;
   .pt-tab-indicator-wrapper ~ & {
     // the bottom border is only for static markup, therefore
     // we never want a bottom border if there's a tab indicator
-    // stylelint-disable declaration-no-important
+    // stylelint-disable-next-line declaration-no-important
     box-shadow: none !important;
-    // stylelint-enable declaration-no-important
   }
 
   &[aria-disabled="true"] {
@@ -261,6 +255,11 @@ $tab-indicator-width: 3px !default;
   &:focus {
     -moz-outline-radius: 0;
   }
+
+  .pt-large & {
+    line-height: $pt-button-height-large;
+    font-size: $pt-font-size-large;
+  }
 }
 
 .pt-tab-panel {