docs: make large code blocks more legible

Components with large blocks of Default code
cause the table to extend beyond the page, making
it difficult to read. Make the code wrap properly
and allow the container to scroll.

As a specific example, this can be seen in the props
for Search.Result.

docs/app/Components/ComponentDoc/ComponentDoc.js

@@ -191,7 +191,7 @@ export default class ComponentDoc extends Component {
           {subComponentItems}
         </div>
         {selectedDocgen && (
-          <div>
+          <div style={{ overflowX: 'auto' }}>
             {showSubDescription && (
               <div style={subDescriptionStyle}>
                 {selectedDocgen.docBlock.description}

docs/app/index.ejs

@@ -117,13 +117,12 @@
     }
 
     code:not(.hljs) {
-      padding: 0;
-      padding-top: 0.1em;
-      padding-bottom: 0.2em;
       margin: 0;
       font-size: 87.5%;
       background-color: rgba(0, 0, 0, 0.04);
       border-radius: 3px;
+      white-space: pre;
+      display: inline-block;
     }
 
     code:not(.hljs)::before {