Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
: props.unSelectedBg};
color: ${getPaletteColor('base')};
${space} ${fontSize};
&:hover {
background-color: ${props =>
getPaletteColor(props.bg || props.color, 'light')(props)};
}
${applyVariations('ToggleBadge')}
`
ToggleBadge.displayName = 'ToggleBadge'
ToggleBadge.propTypes = {
selected: PropTypes.bool,
...space.propTypes,
...fontSize.propTypes,
color: deprecatedColorValue(),
bg: deprecatedPropType('color')
}
ToggleBadge.defaultProps = {
selected: false,
px: 2,
py: 1,
mx: 1,
my: 1,
fontSize: 0,
color: 'primary',
unSelectedBg: 'transparent'
}
export default ToggleBadge
border-color: ${themeGet('colors.blue')};
box-shadow: 0 0 0 1px ${themeGet('colors.blue')};
}
`
SelectBase.defaultProps = {
theme,
fontSize: 1,
m: 0,
pl: 12,
pr: 32,
py: 14
}
SelectBase.propTypes = {
...space.propTypes,
...fontSize.propTypes
}
const Select = styled(props => (
))``
Select.isField = true
export default Select
...order.propTypes
};
const Text = styled('div')`
${space}
${fontSize}
${fontWeight}
${lineHeight}
${fontStyle}
${textAlign}
${color}
`;
Text.propTypes = {
...space.propTypes,
...fontSize.propTypes,
...fontWeight.propTypes,
...lineHeight.propTypes,
...color.propTypes
};
const Heading = Text.withComponent('h1');
Heading.defaultProps = {
fontSize: 5,
lineHeight: 1.5,
m: 0
};
export { Box, Text, Heading, Flex };
import { space, fontSize, fontWeight, lineHeight, color, textAlign, themeGet as _ } from 'styled-system'
export const Text = styled.p`
${space}
${fontSize}
${fontWeight}
${lineHeight}
${color}
${textAlign}
${p => p.allCaps && css`
text-transform:uppercase;
`}
`
Text.propTypes = {
...space.propTypes,
...fontSize.propTypes,
...fontWeight.propTypes,
...lineHeight.propTypes,
...color.propTypes,
...textAlign.propTypes
}
Text.defaultProps = {
m: 0
}
export const Header = styled(Text.withComponent('h1'))`
letter-spacing: -0.03em;
text-shadow: 1px 2px 3px ${_('colors.textShadow')};
`
Header.defaultProps = {
fontSize: 5,
fontWeight: 600,
css('p'),
)
p.propTypes = {
...fontSize.propTypes,
...space.propTypes,
...color.propTypes
}
p.defaultProps = {
fontSize: 2
}
const ul = styled.ul([], {
textAlign: 'left'
}, fontSize, css('ul'))
ul.propTypes = {
...fontSize.propTypes
}
ul.defaultProps = {
fontSize: 2
}
const ol = styled.ol([], {
textAlign: 'left'
}, fontSize, css('ol'))
ol.propTypes = {
...fontSize.propTypes
}
ol.defaultProps = {
fontSize: 2
}
const li = styled.li([], css('li'))
cursor: pointer;
background-color: ${props =>
props.selected ? props.theme.colors[props.bg] : props.unSelectedBg};
color: ${props => props.theme.colors[props.color]};
${space} ${fontSize};
&:hover {
background-color: ${props => props.theme.colors[props.bg]};
}
`
ToggleBadge.displayName = 'ToggleBadge'
ToggleBadge.propTypes = {
selected: PropTypes.bool,
...space.propTypes,
...fontSize.propTypes
}
ToggleBadge.defaultProps = {
selected: false,
px: 2,
py: 1,
mx: 1,
my: 1,
fontSize: 0,
theme: theme,
color: 'blue',
bg: 'lightBlue',
unSelectedBg: 'transparent'
}
export default ToggleBadge
const Text = styled.div`
${color}
${space}
${fontSize}
${fontWeight}
${lineHeight}
${textAlign}
${letterSpacing}
`
Text.defaultProps = {}
Text.propTypes = {
...color.propTypes,
...space.propTypes,
...fontSize.propTypes,
...fontWeight.propTypes,
...lineHeight.propTypes,
...textAlign.propTypes,
...letterSpacing.propTypes
}
Text.displayName = 'Text'
export default Text
${fontSize}
${fontWeight}
${textAlign}
${lineHeight}
${space}
${caps}
${regular}
${bold}
${textShadow}
`)
Text.displayName = 'Text'
Text.propTypes = {
...textStyle.propTypes,
...fontSize.propTypes,
...fontWeight.propTypes,
...textAlign.propTypes,
...lineHeight.propTypes,
...space.propTypes,
color: deprecatedColorValue(),
caps: PropTypes.bool,
regular: PropTypes.bool,
bold: PropTypes.bool,
enableTextShadow: PropTypes.bool,
textShadowSize: PropTypes.oneOf(['sm', 'md']),
align: deprecatedPropType('textAlign')
}
Text.span = Text.withComponent('span')
Text.p = Text.withComponent('p')
Text.s = Text.withComponent('s')
const Flex = styled('div')({
display: 'flex'
}, space)
const Spacer = styled('div')({ margin: 'auto' })
const NavLink = styled(Link)({
display: 'block',
fontWeight: 'bold',
textDecoration: 'none',
}, space, fontSize, color, props => props.css)
NavLink.propTypes = {
...space.propTypes,
...fontSize.propTypes,
...color.propTypes,
}
NavLink.defaultProps = {
py: 1,
fontSize: 3,
color: 'inherit',
}
export const Pagination = withRouter(({
routes = [],
order = [],
filter,
history,
location,
match,
const Root = styled('div')`
font-family: system-ui, sans-serif;
line-height: 1.5;
`
const Box = styled('div')`
${space}
${width}
${fontSize}
${color}
`
Box.propTypes = {
...space.propTypes,
...width.propTypes,
...fontSize.propTypes,
...color.propTypes,
}
const Text = styled('div')`
${space}
${fontSize}
${fontWeight}
${lineHeight}
${color}
`
Text.propTypes = {
...space.propTypes,
...fontSize.propTypes,
...fontWeight.propTypes,
...lineHeight.propTypes,
...color.propTypes,