haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(context-menu) Minor style fixes (#12874)

This commit is contained in:
Robert Pintilii 2023-02-07 12:05:46 +02:00 committed by GitHub
parent 6b8afbcceb
commit ae7e441e21
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 18 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
css/_popup_menu.scss
View File

@ -5,15 +5,15 @@
.popupmenu__contents { .popupmenu__contents {
.popupmenu__volume-slider { .popupmenu__volume-slider {
&::-webkit-slider-runnable-track { &::-webkit-slider-runnable-track {
background-color: $popupSliderColor; background-color: #246FE5;
} }
&::-moz-range-track { &::-moz-range-track {
background-color: $popupSliderColor; background-color: #246FE5;
} }
&::-ms-fill-lower { &::-ms-fill-lower {
background-color: $popupSliderColor; background-color: #246FE5;
} }
} }
} }

1
css/themes/_light.scss
View File

@ -65,7 +65,6 @@ $errorColor: #c61600;
// Popover colors // Popover colors
$popoverFontColor: #ffffff !important; $popoverFontColor: #ffffff !important;
$popupSliderColor: #0376da;
// Toolbar // Toolbar
$toolbarBackground: rgba(0, 0, 0, 0.5); $toolbarBackground: rgba(0, 0, 0, 0.5);

2
react/features/base/ui/components/web/ContextMenu.tsx
View File

@ -108,7 +108,7 @@ const useStyles = makeStyles()(theme => {
backgroundColor: theme.palette.ui01, backgroundColor: theme.palette.ui01,
border: `1px solid ${theme.palette.ui04}`, border: `1px solid ${theme.palette.ui04}`,
borderRadius: `${Number(theme.shape.borderRadius)}px`, borderRadius: `${Number(theme.shape.borderRadius)}px`,
boxShadow: '0px 4px 25px 4px rgba(20, 20, 20, 0.6)', boxShadow: '0px 1px 2px rgba(41, 41, 41, 0.25)',
color: theme.palette.text01, color: theme.palette.text01,
...withPixelLineHeight(theme.typography.bodyShortRegular), ...withPixelLineHeight(theme.typography.bodyShortRegular),
marginTop: `${(participantsPaneTheme.panePadding * 2) + theme.typography.bodyShortRegular.fontSize}px`, marginTop: `${(participantsPaneTheme.panePadding * 2) + theme.typography.bodyShortRegular.fontSize}px`,

6
react/features/base/ui/components/web/ContextMenuItem.tsx
View File

@ -90,6 +90,10 @@ const useStyles = makeStyles()(theme => {
'&:active': { '&:active': {
backgroundColor: theme.palette.ui03 backgroundColor: theme.palette.ui03
},
'&:focus': {
boxShadow: `inset 0 0 0 2px ${theme.palette.action01Hover}`
} }
}, },
@ -154,7 +158,7 @@ const ContextMenuItem = ({
className = { styles.contextMenuItemIcon } className = { styles.contextMenuItemIcon }
size = { 20 } size = { 20 }
src = { icon } />} src = { icon } />}
<span className = { cx(textClassName) }>{text}</span> <span className = { cx(styles.text, textClassName) }>{text}</span>
</div> </div>
); );
}; };

2
react/features/base/ui/components/web/ContextMenuItemGroup.tsx
View File

@ -25,7 +25,7 @@ const useStyles = makeStyles()(theme => {
}, },
'& + &:not(:empty)': { '& + &:not(:empty)': {
borderTop: `1px solid ${theme.palette.ui04}` borderTop: `1px solid ${theme.palette.ui03}`
}, },
'&:first-of-type': { '&:first-of-type': {

2
react/features/participants-pane/components/web/FooterContextMenu.tsx
View File

@ -25,6 +25,7 @@ import {
getParticipantCount, getParticipantCount,
isEveryoneModerator isEveryoneModerator
} from '../../../base/participants/functions'; } from '../../../base/participants/functions';
import { withPixelLineHeight } from '../../../base/styles/functions.web';
import ContextMenu from '../../../base/ui/components/web/ContextMenu'; import ContextMenu from '../../../base/ui/components/web/ContextMenu';
import ContextMenuItemGroup from '../../../base/ui/components/web/ContextMenuItemGroup'; import ContextMenuItemGroup from '../../../base/ui/components/web/ContextMenuItemGroup';
import { isInBreakoutRoom } from '../../../breakout-rooms/functions'; import { isInBreakoutRoom } from '../../../breakout-rooms/functions';
@ -45,6 +46,7 @@ const useStyles = makeStyles()(theme => {
}, },
text: { text: {
...withPixelLineHeight(theme.typography.bodyShortRegular),
color: theme.palette.text02, color: theme.palette.text02,
padding: '10px 16px', padding: '10px 16px',
height: '40px', height: '40px',

3
react/features/toolbox/components/web/Toolbox.tsx
View File

@ -358,7 +358,8 @@ const styles = () => {
right: 'auto', right: 'auto',
margin: 0, margin: 0,
marginBottom: '8px', marginBottom: '8px',
maxHeight: 'calc(100vh - 100px)' maxHeight: 'calc(100vh - 100px)',
width: '240px'
}, },
hangupMenu: { hangupMenu: {

9
react/features/video-menu/components/web/VolumeSlider.tsx
View File

@ -54,23 +54,22 @@ const styles = (theme: Theme) => {
cursor: 'pointer', cursor: 'pointer',
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
padding: '0 5px', padding: '10px 16px',
'&:hover': { '&:hover': {
backgroundColor: theme.palette.ui04 backgroundColor: theme.palette.ui02
} }
}, },
icon: { icon: {
minWidth: '20px', minWidth: '20px',
padding: '5px', marginRight: '16px',
position: 'relative' as const position: 'relative' as const
}, },
sliderContainer: { sliderContainer: {
position: 'relative' as const, position: 'relative' as const,
width: '100%', width: '100%'
paddingRight: '5px'
}, },
slider: { slider: {