docs: Rafiki style guide update (#51)

Adding custom table styles to Rafiki style guide

src/content/docs/content/rafiki.mdx

@@ -24,4 +24,59 @@ pnpm install
 cd packages/documentation
 pnpm start
 ```
-</Card>
+</Card>
+
+## Custom table styles
+
+We've implemented a few different custom table styles specifically for Rafiki docs. These custom styles were developed because we were running into scrolling issues as well as column width issues, primarily when text was formatted as code.
+
+You can wrap your markdown table in an HTML `<div>` with one of the following custom table styles:
+
+### overflow-table
+
+A long and wide table (vertical and horizontal scrollbars on overflow) with **regular column sizing**.
+
+```html
+<div class="overflow-table">
+
+| Column Header 1 | Column Header 2 | Column Header 3 |
+| --------------- | --------------- | --------------- |
+| Content         | Content         | Content         |
+| Content         | Content         | Content         |
+
+</div>
+```
+
+### overflow-table wide-column
+
+A long and wide table (vertical and horizontal scrollbars on overflow) that needs extra wide columns to accommodate text formatted as code.
+
+`wide-column` sets the minimum width of the table (sum of the total width of all columns) to **60rem**.
+
+```html
+<div class="overflow-table wide-column">
+
+| Column Header 1 | Column Header 2 | Column Header 3 |
+| --------------- | --------------- | --------------- |
+| Content         | Content         | Content         |
+| Content         | Content         | Content         |
+
+</div>
+```
+
+### overflow-table wider-column
+
+A long and wide table (vertical and horizontal scrollbars on overflow) that needs even larger, extra wide columns to accommodate text formatted as code.
+
+`wider-column` sets the minimum width of the table (sum of the total width of all columns) to **80rem**.
+
+```html
+<div class="overflow-table wider-column">
+
+| Column Header 1 | Column Header 2 | Column Header 3 |
+| --------------- | --------------- | --------------- |
+| Content         | Content         | Content         |
+| Content         | Content         | Content         |
+
+</div>
+```