primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-11-14 03:54:54 +03:00
Code Issues Projects Releases Wiki Activity

fix color system <var> styles

Browse Source
This commit is contained in:
Shawn Allen 2019-01-17 16:04:14 -08:00
parent d51305cd85
commit 8ca4c0e7e6
1 changed files with 4 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
docs/src/color-system.js
View File

@ -140,15 +140,13 @@ FadeVariables.propTypes = {
function Swatch(props) {
const {name, value, textColor = overlayColor(value), ...rest} = props
return (
<Box bg={value} {...rest}>
<Box bg={value} color={textColor} {...rest}>
<Text as={Flex} fontSize={1} justifyContent="space-between">
<Box p={3}>
<Var color={textColor}>${name}</Var>
<Var>${name}</Var>
</Box>
<Box p={3}>
<Text color={textColor} fontFamily="mono">
{value}
</Text>
<Text fontFamily="mono">{value}</Text>
</Box>
</Text>
</Box>
@ -163,7 +161,7 @@ Swatch.propTypes = {
function Var(props) {
// FIXME: fontStyle should be a prop, right?
return <Text as="var" fontWeight="bold" fontFamily="mono" css={{fontStyle: 'normal'}} {...props} />
return <Text as="var" fontWeight="bold" fontFamily="mono" style={{fontStyle: 'normal'}} {...props} />
}
function overlayColor(bg) {