fix(toolbar) Fix styles (#12863)
This commit is contained in:
parent
9409e64066
commit
a594aac078
|
@ -30,24 +30,24 @@
|
|||
right: -4px;
|
||||
top: -3px;
|
||||
|
||||
&:hover {
|
||||
&:hover {
|
||||
background: #F2F3F4;
|
||||
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
|
||||
|
||||
&> svg {
|
||||
fill: #000;
|
||||
& > svg {
|
||||
fill: #040404;
|
||||
}
|
||||
|
||||
&.settings-button-small-icon--disabled {
|
||||
background: #36383C;
|
||||
|
||||
&> svg {
|
||||
fill: #929292;
|
||||
}
|
||||
fill: #929292;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&> svg {
|
||||
& > svg {
|
||||
fill: #fff;
|
||||
}
|
||||
|
||||
|
|
|
@ -120,12 +120,16 @@
|
|||
margin: 8px 0;
|
||||
}
|
||||
|
||||
.hangup-button {
|
||||
background-color: $hangupColor;
|
||||
div.hangup-button {
|
||||
background-color: #CB2233;
|
||||
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
&:hover {
|
||||
background-color: $hangupHoverColor;
|
||||
background-color: #E04757;
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-color: #A21B29;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -134,12 +138,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
.hangup-menu-button {
|
||||
background-color: $hangupColor;
|
||||
div.hangup-menu-button {
|
||||
background-color: #CB2233;
|
||||
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
&:hover {
|
||||
background-color: $hangupHoverColor;
|
||||
background-color: #E04757;
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-color: #A21B29;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -4,8 +4,6 @@
|
|||
* Style variables
|
||||
*/
|
||||
$baseFontFamily: -apple-system, BlinkMacSystemFont, 'open_sanslight', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
$hangupColor:#DD3849;
|
||||
$hangupHoverColor: #F25363;
|
||||
|
||||
/**
|
||||
* Size variables.
|
||||
|
|
|
@ -228,7 +228,11 @@ export const commonStyles = (theme: Theme) => {
|
|||
|
||||
'@media (hover: hover) and (pointer: fine)': {
|
||||
'&:hover': {
|
||||
background: theme.palette.ui04
|
||||
backgroundColor: theme.palette.ui04
|
||||
},
|
||||
|
||||
'&:active': {
|
||||
backgroundColor: theme.palette.ui03
|
||||
}
|
||||
},
|
||||
[theme.breakpoints.down(320)]: {
|
||||
|
@ -237,7 +241,7 @@ export const commonStyles = (theme: Theme) => {
|
|||
},
|
||||
|
||||
'&.toggled': {
|
||||
background: theme.palette.ui03
|
||||
backgroundColor: theme.palette.ui03
|
||||
},
|
||||
|
||||
'&.disabled': {
|
||||
|
@ -265,7 +269,15 @@ export const commonStyles = (theme: Theme) => {
|
|||
padding: 6,
|
||||
textAlign: 'center' as const,
|
||||
pointerEvents: 'all' as const,
|
||||
boxShadow: '0px 2px 8px 4px rgba(0, 0, 0, 0.25), 0px 0px 0px 1px rgba(0, 0, 0, 0.15)'
|
||||
boxShadow: '0px 2px 8px 4px rgba(0, 0, 0, 0.25), 0px 0px 0px 1px rgba(0, 0, 0, 0.15)',
|
||||
|
||||
'& > div': {
|
||||
marginRight: theme.spacing(2),
|
||||
|
||||
'&:last-of-type': {
|
||||
marginRight: 0
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
|
|
@ -16,8 +16,8 @@ const useStyles = makeStyles()(theme => {
|
|||
...withPixelLineHeight(theme.typography.labelBold),
|
||||
pointerEvents: 'none',
|
||||
position: 'absolute',
|
||||
right: '-3px',
|
||||
top: '-2px'
|
||||
right: '-4px',
|
||||
top: '-3px'
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue