Skip to content

Commit 717384b

Browse files
committed
📝 Update FlexGrid docs
1 parent 6c48515 commit 717384b

File tree

5 files changed

+18
-10
lines changed

5 files changed

+18
-10
lines changed

docs/flex-grid.mdx

+17-3
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,10 @@ import { Box, FlexGrid } from '../src'
1111

1212
# FlexGrid
1313

14-
## Description
14+
Grid component based on [Flex](/flex) and [Box](/box).
1515

16-
Grid component based on [Flex](/flex) and [Box](/box).
16+
Useful if you need to support old browsers without `display: grid`,
17+
if don't: use [Grid](/grid) instead.
1718

1819

1920
### Components:
@@ -25,7 +26,7 @@ Grid component based on [Flex](/flex) and [Box](/box).
2526
- `spacex` — horizontal space
2627
- `spacey` — vertical space
2728

28-
Possible values for spacing is defined in `theme.space`. See [space docs](https://github.com/exah/pss/blob/master/docs/api.md#space)
29+
For possible values for spacing see [space docs](https://github.com/exah/pss/blob/master/docs/api.md#space).
2930

3031

3132
#### `FlexGrid.Item` — Item / column component, size can be set with props:
@@ -224,6 +225,19 @@ import { FlexGrid } from 'pss-components'
224225
</FlexGrid>
225226
</Playground>
226227

228+
### Create your own grid
229+
230+
```js
231+
const MyGrid = (props) => (
232+
<FlexGrid
233+
columns={16}
234+
space={1}
235+
{...props}
236+
/>
237+
)
238+
```
239+
240+
227241
## Props
228242

229243
### FlexGrid

docs/grid.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { Box, Grid } from '../src'
1111

1212
# Grid
1313

14-
[Grid Layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout) component, based on [Box](/box) with `display: 'grid'`.
14+
[Grid Layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout) component, based on [Box](/box) with `display: grid`.
1515

1616
- Item conrolled with `column`, `row` prop in `Grid.Item` component
1717
- [Space](https://github.com/exah/pss/blob/master/docs/api.md#space) between items conrolled with `gap`, `columnGap` and `rowGap` props

docs/input.mdx

-2
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,6 @@ import { Input, Link, ThemeDefaults } from '../src'
1010

1111
# Input
1212

13-
## Description
14-
1513
Based on [Box](/box). Renders `<input>` or `<textarea>` element.
1614

1715

docs/layout.mdx

-2
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,6 @@ import { Image, Layout, Box } from '../src'
1111

1212
# Layout
1313

14-
## Description
15-
1614
Implements [Media Object](http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code) with [Flex](/flex) - one of most useful layout components.
1715

1816
Components:

docs/theme-defaults.mdx

-2
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,6 @@ import { ThemeDefaults, Box } from '../src'
99

1010
# ThemeDefaults
1111

12-
## Description
13-
1412
Change `theme.default` with props.
1513

1614

0 commit comments

Comments
 (0)