fix(tables): fix tables overflowing divs and unaligned borders (#160)

## 🧰 Changes
- add `overflow: auto` to `.rdmd-table-inner` to allow large tables
to scroll as per the request in:
https://linear.app/readme-io/issue/CX-179/tables-no-longer-scrolling-horizontally
- remove the `:after` border and replace it with a border applied
directly to the table (also, nests `:first-child` CSS rules under
the new `table` rule)
- sort CSS properties and lints CSS

Separated the linting/sorting changes into a separate commit for easier review:
Content changes commit:
8134338

Just linting and sorting fixes commit:
ba6a949

## 🧬 QA & Testing

- Do long tables with multiple columns that were built with the table
widget now show correctly and...
  - stay inside their containing div?
  - don't appear to have extra columns?
  - don't appear to have a line through the first overflow column?
  (see video in https://linear.app/readme-io/issue/CX-179/tables-no-longer-scrolling-horizontally)

Fixes CX-179

.gitignore

@@ -6,6 +6,7 @@ node_modules
 .vscode/
 *.code-*
 *.sublime-*
+*.stylelintrc.json
 
 .DS_Store
 

components/Table/style.scss

@@ -46,44 +46,43 @@
   }
 }
 
-.markdown-body { 
+.markdown-body {
   @include markdown-table;
+
   .rdmd-table {
     $border-wrap-width: 1px;
+
     & {
-      position: relative;
       display: block;
+      position: relative;
     }
-    &:after {
-      content: ' ';
-      position: absolute;
-      box-shadow: inset 0 0 0 $border-wrap-width var(--table-edges, #dfe2e5);
-      width: 100%;
-      height: 100%;
-      top: 0;
-      pointer-events: none;
-      z-index: 1;
-    }
+
     &-inner {
-      min-width: 100%;
       box-sizing: content-box;
+      min-width: 100%;
+      overflow: auto;
       width: 100%;
     }
-    table:only-child {
-      margin: 0 !important;
-      thead th {
-        position: sticky;
-        left: 0;
-        z-index: 1;
-        background: inherit;
-      }
-      td:last-child,
-      th:last-child {
-        border-right: none;
-      }
-      thead tr,
-      thead th:last-child {
-        box-shadow: 3px 0 0 var(--table-head);
+
+    table {
+      border: 1px solid var(--table-edges, #dfe2e5);
+
+      &:only-child {
+        margin: 0 !important;
+
+        thead th {
+          background: inherit;
+        }
+
+        td:last-child,
+        th:last-child {
+          border-right: none;
+        }
+
+        thead tr,
+        thead th:last-child {
+          box-shadow: 3px 0 0 var(--table-head);
+        }
       }
     }
   }