Formatting

Author: reinink

src/pages/docs/caption-side.mdx

@@ -4,7 +4,6 @@ description: "Utilities for controlling the alignment of a caption element insid
 ---
 
 import utilities from 'utilities?plugin=captionSide'
-import { ArbitraryValues } from '@/components/ArbitraryValues'
 import { BreakpointsAndMediaQueries } from '@/components/BreakpointsAndMediaQueries'
 import { HoverFocusAndOtherStates } from '@/components/HoverFocusAndOtherStates'
 
@@ -13,6 +12,7 @@ export const classes = { utilities }
 ## Basic usage
 
 ### Top
+
 Use `caption-top` to position a caption element at the top of a table.
 
 <Example p="none">
@@ -50,7 +50,7 @@ Use `caption-top` to position a caption element at the top of a table.
   <caption class="**caption-top**">
     Table 3.1: Professional wrestlers and their signature moves.
   </caption>
-  <thead >
+  <thead>
     <tr>
       <th>Wrestler</th>
       <th>Signature Move(s)</th>
@@ -74,6 +74,7 @@ Use `caption-top` to position a caption element at the top of a table.
 ```
 
 ### Bottom
+
 Use `caption-bottom` to position a caption element at the bottom of a table.
 
 <Example p="none">
@@ -111,7 +112,7 @@ Use `caption-bottom` to position a caption element at the bottom of a table.
   <caption class="**caption-bottom**">
     Table 3.1: Professional wrestlers and their signature moves.
   </caption>
-  <thead >
+  <thead>
     <tr>
       <th>Wrestler</th>
       <th>Signature Move(s)</th>
@@ -145,5 +146,3 @@ Use `caption-bottom` to position a caption element at the bottom of a table.
 ### <Heading ignore>Breakpoints and media queries</Heading>
 
 <BreakpointsAndMediaQueries defaultClass="caption-top" featuredClass="caption-bottom" element="table" />
-
----

src/pages/docs/hyphens.mdx

@@ -12,28 +12,27 @@ export const classes = { utilities }
 ## Basic usage
 
 ### None
-Use `hyphens-none` to prevent words from being hyphenated even if the line break suggestion `­` is used:
 
+Use `hyphens-none` to prevent words from being hyphenated even if the line break suggestion `­` is used:
 
 <Example p="none">
   <div class="overflow-x-scroll sm:overflow-x-visible px-4">
-    <div class="mx-auto max-w-xs bg-white shadow-xl p-12 text-slate-500 dark:bg-slate-800 dark:text-slate-400">  
+    <div class="mx-auto max-w-xs bg-white shadow-xl p-12 text-slate-500 dark:bg-slate-800 dark:text-slate-400">
       <p class="hyphens-none">Officially recognized by the Duden dictionary as the longest word in German, <span class="text-slate-900 font-medium dark:text-slate-200" lang="de"> Kraftfahrzeug&shy;Haftpflichtversicherung</span> is a 36 letter word for motor vehicle liability insurance.</p>
     </div>
   </div>
 </Example>
 
 ```html
 <p class="**hyphens-none** ...">
-    ... Kraftfahrzeug**&shy;**Haftpflichtversicherung is a ...
+  ... Kraftfahrzeug**&shy;**Haftpflichtversicherung is a ...
 </p>
 ```
 
 ### Manual
 
 Use `hyphens-manual` to only set hyphenation points where the line break suggestion `&shy;` is used:
 
-
 <Example p="none">
   <div class="overflow-x-scroll sm:overflow-x-visible px-4">
     <div class="mx-auto max-w-xs bg-white shadow-xl p-12 text-slate-500 dark:bg-slate-800 dark:text-slate-400">
@@ -44,15 +43,14 @@ Use `hyphens-manual` to only set hyphenation points where the line break suggest
 
 ```html
 <p class="**hyphens-manual** ...">
-    ... Kraftfahrzeug**&shy;**Haftpflichtversicherung is a ...
+  ... Kraftfahrzeug**&shy;**Haftpflichtversicherung is a ...
 </p>
 ```
 
 ### Auto
 
 Use `hyphens-auto` to allow the browser to automatically choose hyphenation points based on the language. The line break suggestion `&shy;` will be preferred over automatic hyphenation points.
 
-
 <Example p="none">
   <div class="overflow-x-scroll sm:overflow-x-visible px-4">
     <div class="mx-auto max-w-xs bg-white shadow-xl p-12 text-slate-500 dark:bg-slate-800 dark:text-slate-400 ">
@@ -63,11 +61,10 @@ Use `hyphens-auto` to allow the browser to automatically choose hyphenation poin
 
 ```html
 <p class="**hyphens-auto** ..." **lang**="de">
-    ... KraftfahrzeugHaftpflichtversicherung is a ...
+  ... KraftfahrzeugHaftpflichtversicherung is a ...
 </p>
 ```
 
-
 ---
 
 ## <Heading ignore>Applying conditionally</Heading>
@@ -78,4 +75,4 @@ Use `hyphens-auto` to allow the browser to automatically choose hyphenation poin
 
 ### <Heading ignore>Breakpoints and media queries</Heading>
 
-<BreakpointsAndMediaQueries defaultClass="hyphens-none" featuredClass="hyphens-auto" element="p" />
+<BreakpointsAndMediaQueries defaultClass="hyphens-none" featuredClass="hyphens-auto" element="p" />