adjustments to some typography and overflows for table

Kayla Wilkins · Kayla Wilkins · commit aa459c3ad6d2 · 2019-05-13T14:25:45.000-04:00
diff --git a/src/css/components/0_utilities/typography.css b/src/css/components/0_utilities/typography.css
@@ -20,6 +20,7 @@ input[type="text"] {
 
 .api-body code {
   @apply p-2 mt-2 mb-4 bg-ThemeBeige block;
+  overflow-x: auto;
 }
 
 .api-desc code {
@@ -36,6 +37,7 @@ input[type="text"] {
 
 .api-body table {
   width: 100%;
+  overflow-x: scroll;
   @apply border border-grey-light;
 }
 
@@ -46,6 +48,7 @@ input[type="text"] {
 .api-body th,
 .api-body td {
   @apply p-2 border border-grey-light;
+  @apply leading-tight;
 }
 
 .api-body table code {
diff --git a/src/css/components/4_pages/api-page.css b/src/css/components/4_pages/api-page.css
@@ -27,6 +27,7 @@
 
 .api-body {
   @apply mb-8;
+  overflow: hidden;
 }
 
 .endpoint-anchor {
diff --git a/src/pages/api/v4.js b/src/pages/api/v4.js
@@ -36,7 +36,7 @@ const APIDocs = ({ data }) => {
               source={n.info.description}
               escapeHtml={false}
               renderers={{ heading: HeadingRenderer }}
-              className="mt-8 api-body"
+              className="md:mt-8 api-body"
             />
           </div>
         </div>

Original file line number	Diff line number	Diff line change
`@@ -20,6 +20,7 @@ input[type="text"] {`
`20`	`20`
`21`	`21`	`.api-body code {`
`22`	`22`	`@apply p-2 mt-2 mb-4 bg-ThemeBeige block;`
	`23`	`+ overflow-x: auto;`
`23`	`24`	`}`
`24`	`25`
`25`	`26`	`.api-desc code {`
`@@ -36,6 +37,7 @@ input[type="text"] {`
`36`	`37`
`37`	`38`	`.api-body table {`
`38`	`39`	`width: 100%;`
	`40`	`+ overflow-x: scroll;`
`39`	`41`	`@apply border border-grey-light;`
`40`	`42`	`}`
`41`	`43`
`@@ -46,6 +48,7 @@ input[type="text"] {`
`46`	`48`	`.api-body th,`
`47`	`49`	`.api-body td {`
`48`	`50`	`@apply p-2 border border-grey-light;`
	`51`	`+ @apply leading-tight;`
`49`	`52`	`}`
`50`	`53`
`51`	`54`	`.api-body table code {`