/
List.js
81 lines (72 loc) · 1.63 KB
/
List.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
import styled from 'styled-components'
import {space, propTypes} from 'styled-system'
import {Text} from './Text'
/** @component */
export const ListItem = styled(Text)`
color: inherit;
& *:matches(p) {
margin: 0;
}
`
/** @component */
export const OrderedList = styled(Text)`
& *:matches(ol, ul) {
padding-left: 40px;
}
`
/** @component */
export const UnorderedList = styled(Text)`
& *:matches(ol, ul) {
padding-left: 40px;
}
`
ListItem.displayName = 'gatsby-ui.ListItem'
ListItem.defaultProps = {
as: 'li',
fontSize: 2,
lineHeight: 'copy'
}
ListItem.propTypes = {
as: propTypes.numberOrString,
bg: propTypes.responsive,
color: propTypes.responsive,
fontSize: propTypes.responsive,
fontWeight: propTypes.responsive,
lineHeight: propTypes.responsive,
textAlign: propTypes.responsive,
...space.propTypes
}
OrderedList.displayName = 'gatsby-ui.OrderedList'
OrderedList.defaultProps = {
as: 'ol',
pl: 0,
mt: 1,
mb: 3
}
OrderedList.propTypes = {
as: propTypes.numberOrString,
bg: propTypes.responsive,
color: propTypes.responsive,
fontSize: propTypes.responsive,
fontWeight: propTypes.responsive,
lineHeight: propTypes.responsive,
textAlign: propTypes.responsive,
...space.propTypes
}
UnorderedList.displayName = 'gatsby-ui.UnorderedList'
UnorderedList.defaultProps = {
as: 'ul',
pl: 0,
mt: 1,
mb: 3
}
UnorderedList.propTypes = {
as: propTypes.numberOrString,
bg: propTypes.responsive,
color: propTypes.responsive,
fontSize: propTypes.responsive,
fontWeight: propTypes.responsive,
lineHeight: propTypes.responsive,
textAlign: propTypes.responsive,
...space.propTypes
}