docs: improve readability of classnames and styles properties (#520)

pradel · Sep 18, 2023 · acfe228 · acfe228
1 parent e5c9aac
commit acfe228
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/website/src/docs/index.mdx b/website/src/docs/index.mdx
@@ -192,8 +192,8 @@ By default, the Modal will be rendered at the end of the html body tag. If you w
 | **focusTrapped**        | `boolean`                                                                                                                                                                                                                              | true      | When the modal is open, trap focus within it.                                                                                                                                                                      |
 | **initialFocusRef**     | `React.RefElement<HTMLElement>`                                                                                                                                                                                                        | undefined | Sets focus on this specific element when modal opens if focus trap is used.                                                                                                                                        |
 | **container**           | `Element`                                                                                                                                                                                                                              |           | You can specify a container prop which should be of type `Element`. The portal will be rendered inside that element. The default behavior will create a div node and render it at the at the end of document.body. |
-| **classNames**          | `{ root?: string; overlay?: string; overlayAnimationIn?: string; overlayAnimationOut?: string; modal?: string; modalAnimationIn?: string; modalAnimationOut?: string; closeButton?: string; closeIcon?: string; }`                     |           | An object containing classNames to style the modal.                                                                                                                                                                |
-| **styles**              | `{ root?: React.CSSProperties; overlay?: React.CSSProperties; overlay?: React.CSSProperties; modalContainer?: React.CSSProperties; modal?: React.CSSProperties; closeButton?: React.CSSProperties; closeIcon?: React.CSSProperties; }` |           | An object containing the styles objects to style the modal.                                                                                                                                                        |
+| **classNames**          | `{`<br/>`root?: string;`<br/>`overlay?: string;`<br/>`overlayAnimationIn?: string;`<br/>`overlayAnimationOut?: string;`<br/>`modal?: string;`<br/>`modalAnimationIn?: string;`<br/>`modalAnimationOut?: string;`<br/>`closeButton?: string;`<br/>`closeIcon?: string;`<br/>`}`                     |           | An object containing classNames to style the modal.                                                                                                                                                                |
+| **styles**              | `{`<br/>`root?: React.CSSProperties;`<br/>`overlay?: React.CSSProperties;`<br/>`overlay?: React.CSSProperties;`<br/>`modalContainer?: React.CSSProperties;`<br/>`modal?: React.CSSProperties;`<br/>`closeButton?: React.CSSProperties;`<br/>`closeIcon?: React.CSSProperties;`<br/>`}` |           | An object containing the styles objects to style the modal.                                                                                                                                                        |
 | **animationDuration**   | `number`                                                                                                                                                                                                                               | 300       | Animation duration in milliseconds.                                                                                                                                                                                |
 | **role**                | `string`                                                                                                                                                                                                                               | "dialog"  | ARIA role for modal                                                                                                                                                                                                |
 | **ref**                 | `React.RefElement<HTMLDivElement>`                                                                                                                                                                                                     | undefined | Ref for modal dialog element                                                                                                                                                                                       |