give ModifierTable its own class. fixes #2163

palantir · Mar 3, 2018 · 99b4ed2 · 99b4ed2
1 parent 57eedfb
commit 99b4ed2
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 19 deletions.
diff --git a/packages/docs-theme/src/components/modifierTable.tsx b/packages/docs-theme/src/components/modifierTable.tsx
@@ -12,7 +12,7 @@ export interface IModifierTableProps {
 
 export const ModifierTable: React.SFC<IModifierTableProps> = ({ children, title }) =>
     React.Children.count(children) > 0 ? (
-        <div className="docs-modifiers pt-running-text-small">
+        <div className="docs-modifiers-table">
             <table className="pt-html-table">
                 <thead>
                     <tr>

diff --git a/packages/docs-theme/src/styles/_api.scss b/packages/docs-theme/src/styles/_api.scss
@@ -13,20 +13,17 @@
     flex-direction: column;
     margin: 0;
     width: $content-width;
-
-    > * {
-      padding: $pt-grid-size ($pt-grid-size * 2);
-    }
   }
 
   .docs-interface-header {
     flex: 0 0 auto;
     margin: 0;
+    padding: $pt-grid-size ($pt-grid-size * 2);
   }
 
-  .docs-interface-table {
+  .docs-modifiers-table {
     overflow: auto;
-    padding-bottom: $pt-grid-size * 2;
+    padding: $pt-grid-size ($pt-grid-size * 2) ($pt-grid-size * 2);
   }
 }
 

diff --git a/packages/docs-theme/src/styles/_content.scss b/packages/docs-theme/src/styles/_content.scss
@@ -107,22 +107,15 @@ $dark-example-background-color: $dark-content-background-color;
   vertical-align: top;
 
   > code {
+    display: inline-block;
     margin-bottom: $pt-grid-size;
-  }
 
-  &[data-modifier="default"]:last-child > code {
-    display: none;
+    &:empty {
+      display: none;
+    }
   }
-}
 
-// modifier labels
-.docs-modifiers code,
-.docs-example > code {
-  display: inline-block;
-  line-height: 1.4;
-  white-space: nowrap;
-
-  &:empty {
+  &[data-modifier="default"]:last-child > code {
     display: none;
   }
 }