Add 256-step widths for Compact for consistency

Amsterdam · Apr 25, 2024 · 9684e8e · 9684e8e
1 parent ebda1a8
commit 9684e8e
Showing 1 changed file with 16 additions and 0 deletions.
diff --git a/storybook/src/docs/space.docs.mdx b/storybook/src/docs/space.docs.mdx
@@ -44,7 +44,9 @@ In Compact Mode, the medium grid space grows from 16 to 40 pixels between window
       <th style={{ textAlign: "center" }}>1088</th>
       <th style={{ textAlign: "center" }}>1344</th>
       <th style={{ textAlign: "center" }}>1600</th>
+      <th style={{ textAlign: "center" }}>1856</th>
       <th style={{ textAlign: "center" }}>2112</th>
+      <th style={{ textAlign: "center" }}>2368</th>
       <th style={{ textAlign: "center" }}>2624</th>
     </tr>
   </thead>
@@ -58,7 +60,9 @@ In Compact Mode, the medium grid space grows from 16 to 40 pixels between window
       </td>
       <td style={{ textAlign: "center" }}>5</td>
       <td style={{ textAlign: "center" }}>6</td>
+      <td style={{ textAlign: "center" }}>7</td>
       <td style={{ textAlign: "center" }}>8</td>
+      <td style={{ textAlign: "center" }}>9</td>
       <td style={{ textAlign: "center" }}>10</td>
     </tr>
     <tr>
@@ -70,7 +74,9 @@ In Compact Mode, the medium grid space grows from 16 to 40 pixels between window
       </td>
       <td style={{ textAlign: "center" }}>10</td>
       <td style={{ textAlign: "center" }}>12</td>
+      <td style={{ textAlign: "center" }}>14</td>
       <td style={{ textAlign: "center" }}>16</td>
+      <td style={{ textAlign: "center" }}>18</td>
       <td style={{ textAlign: "center" }}>20</td>
     </tr>
     <tr>
@@ -86,9 +92,15 @@ In Compact Mode, the medium grid space grows from 16 to 40 pixels between window
       <td style={{ textAlign: "center" }}>
         <strong>24</strong>
       </td>
+      <td style={{ textAlign: "center" }}>
+        <strong>28</strong>
+      </td>
       <td style={{ textAlign: "center" }}>
         <strong>32</strong>
       </td>
+      <td style={{ textAlign: "center" }}>
+        <strong>36</strong>
+      </td>
       <td style={{ textAlign: "center" }}>
         <strong>40</strong>
       </td>
@@ -102,7 +114,9 @@ In Compact Mode, the medium grid space grows from 16 to 40 pixels between window
       </td>
       <td style={{ textAlign: "center" }}>30</td>
       <td style={{ textAlign: "center" }}>36</td>
+      <td style={{ textAlign: "center" }}>42</td>
       <td style={{ textAlign: "center" }}>48</td>
+      <td style={{ textAlign: "center" }}>54</td>
       <td style={{ textAlign: "center" }}>60</td>
     </tr>
     <tr>
@@ -114,7 +128,9 @@ In Compact Mode, the medium grid space grows from 16 to 40 pixels between window
       </td>
       <td style={{ textAlign: "center" }}>40</td>
       <td style={{ textAlign: "center" }}>48</td>
+      <td style={{ textAlign: "center" }}>56</td>
       <td style={{ textAlign: "center" }}>64</td>
+      <td style={{ textAlign: "center" }}>72</td>
       <td style={{ textAlign: "center" }}>80</td>
     </tr>
   </tbody>