Skip to content

Commit 0afb560

Browse files
committed
Prep for patch
1 parent 0dd13de commit 0afb560

File tree

3 files changed

+936
-661
lines changed

3 files changed

+936
-661
lines changed

README.md

+19-19
Original file line numberDiff line numberDiff line change
@@ -74,21 +74,21 @@ Or load via CDN:
7474

7575
In general, use CSS variables.
7676

77-
| Name | Default | Description |
78-
| ---------------------------- | ------------ | --------------------------------------------- |
79-
| --jsonPaddingLeft | 1rem | Amount of left padding to apply at each depth |
80-
| --jsonBorderLeft | 1px dotted | Style applied to left border for each depth |
81-
| --jsonBracketColor | currentcolor | Color for brackets `[`, `{`, `}` and `]` |
82-
| --jsonBracketHoverBackground | #e5e7eb | Hover background for brackets |
83-
| --jsonSeparatorColor | currentcolor | Color for separators `:` and `,` |
84-
| --jsonKeyColor | currentcolor | Color for keys |
85-
| --jsonValColor | #9ca3af | Default color for values |
86-
| --jsonValStringColor | #059669 | Color for `string` values |
87-
| --jsonValNumberColor | #d97706 | Color for `number` values |
88-
| --jsonValBooleanColor | #2563eb | Color for `boolean` values |
89-
90-
It's recommended to wrap the component to apply your own font family (a monospaced font is
91-
recommended) and also to apply custom CSS var overrides.
77+
| Name | Default | Description |
78+
| ------------------------------ | -------------- | --------------------------------------------- |
79+
| `--jsonPaddingLeft` | `1rem` | Amount of left padding to apply at each depth |
80+
| `--jsonBorderLeft` | `1px dotted` | Style applied to left border for each depth |
81+
| `--jsonBracketColor` | `currentcolor` | Colour for brackets `[`, `{`, `}` and `]` |
82+
| `--jsonBracketHoverBackground` | `#e5e7eb` | Hover background for brackets |
83+
| `--jsonSeparatorColor` | `currentcolor` | Colour for separators `:` and `,` |
84+
| `--jsonKeyColor` | `currentcolor` | Colour for keys |
85+
| `--jsonValColor` | `#9ca3af` | Default colour for values |
86+
| `--jsonValStringColor` | `#059669` | Colour for `string` values |
87+
| `--jsonValNumberColor` | `#d97706` | Colour for `number` values |
88+
| `--jsonValBooleanColor` | `#2563eb` | Colour for `boolean` values |
89+
90+
To apply your own font family (a monospaced font is recommended) or apply custom CSS var overrides,
91+
try wrapping the component and applying these styles to the wrapper like so:
9292

9393
<!-- prettier-ignore -->
9494
```html
@@ -109,10 +109,10 @@ recommended) and also to apply custom CSS var overrides.
109109

110110
## Props
111111

112-
| Name | Type | Default | Description |
113-
| ----- | ------ | --------- | -------------------------------- |
114-
| json | Object | undefined | Un-stringified object to display |
115-
| depth | Number | Infinity | Initial expansion depth |
112+
| Name | Type | Default | Description |
113+
| ------- | -------- | ----------- | -------------------------------- |
114+
| `json` | `object` | `undefined` | Un-stringified object to display |
115+
| `depth` | `number` | `Infinity` | Initial expansion depth |
116116

117117
## Development
118118

0 commit comments

Comments
 (0)