Dark Mode (#912)

closes #704
This commit is contained in:
Tom Moor
2019-03-12 21:35:35 -07:00
committed by GitHub
parent 6445da33db
commit 59c82f1f06
46 changed files with 648 additions and 252 deletions

View File

@@ -8,8 +8,8 @@ const RealButton = styled.button`
margin: 0;
padding: 0;
border: 0;
background: ${props => props.theme.blackLight};
color: ${props => props.theme.white};
background: ${props => props.theme.buttonBackground};
color: ${props => props.theme.buttonText};
box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 2px;
border-radius: 4px;
font-size: 12px;
@@ -28,26 +28,26 @@ const RealButton = styled.button`
}
&:hover {
background: ${props => darken(0.05, props.theme.blackLight)};
background: ${props => darken(0.05, props.theme.buttonBackground)};
}
&:disabled {
cursor: default;
pointer-events: none;
color: ${props => lighten(0.2, props.theme.blackLight)};
color: ${props => lighten(0.2, props.theme.buttonText)};
}
${props =>
props.neutral &&
`
background: ${props.theme.white};
color: ${props.theme.text};
background: ${props.theme.buttonNeutralBackground};
color: ${props.theme.buttonNeutralText};
box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px;
border: 1px solid ${props.theme.slateLight};
border: 1px solid ${darken(0.1, props.theme.buttonNeutralBackground)};
&:hover {
background: ${darken(0.05, props.theme.white)};
border: 1px solid ${darken(0.05, props.theme.slateLight)};
background: ${darken(0.05, props.theme.buttonNeutralBackground)};
border: 1px solid ${darken(0.15, props.theme.buttonNeutralBackground)};
}
`} ${props =>
props.danger &&