coop-cloud-chaos-patchs/outline
coop-cloud-chaos-patchs
/
outline
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix: Toast color in dark mode

This commit is contained in:
Tom Moor 2020-05-19 21:55:26 -07:00
parent 092d9dce18
commit ee7e1959c9
2 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/components/Toasts/components/Toast.js
View File

@ -61,13 +61,13 @@ const Action = styled.span`
height: 100%;
text-transform: uppercase;
font-size: 12px;
color: ${props => props.theme.white};
background: ${props => darken(0.05, props.theme[props.type])};
color: ${props => props.theme.toastText};
background: ${props => darken(0.05, props.theme.toastBackground)};
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
&:hover {
background: ${props => darken(0.1, props.theme[props.type])};
background: ${props => darken(0.1, props.theme.toastBackground)};
}
`;
@ -76,14 +76,14 @@ const Container = styled.div`
align-items: center;
animation: ${fadeAndScaleIn} 100ms ease;
margin: 8px 0;
color: ${props => props.theme.white};
background: ${props => props.theme[props.type]};
color: ${props => props.theme.toastText};
background: ${props => props.theme.toastBackground};
font-size: 15px;
border-radius: 5px;
cursor: default;
&:hover {
background: ${props => darken(0.05, props.theme[props.type])};
background: ${props => darken(0.05, props.theme.toastBackground)};
}
`;

6
shared/styles/theme.js
View File

@ -129,6 +129,9 @@ export const light = {
tooltipBackground: colors.almostBlack,
tooltipText: colors.white,
toastBackground: colors.almostBlack,
toastText: colors.white,
quote: colors.slateLight,
codeBackground: colors.smoke,
codeBorder: colors.smokeDark,
@ -176,6 +179,9 @@ export const dark = {
tooltipBackground: colors.white,
tooltipText: colors.lightBlack,
toastBackground: colors.white,
toastText: colors.lightBlack,
quote: colors.almostWhite,
codeBackground: colors.black,
codeBorder: colors.black50,