fix(moderation) fix ui styles for advanced moderation context menu (#9758)

react/features/participants-pane/components/FooterContextMenu.js

 
 import {
     ContextMenu,
-    ContextMenuItem
+    ContextMenuItem,
+    ContextMenuItemGroup
 } from './web/styled';
 
 const useStyles = makeStyles(() => {
             right: 0,
             top: '-8px',
             transform: 'translateY(-100%)',
-            width: '238px'
+            width: '283px'
         },
         text: {
-            marginLeft: '52px',
-            lineHeight: '40px'
+            color: '#C2C2C2',
+            padding: '10px 16px 10px 52px'
         },
         paddedAction: {
             marginLeft: '36px;'
         <ContextMenu
             className = { classes.contextMenu }
             onMouseLeave = { onMouseLeave }>
-            <ContextMenuItem
-                id = 'participants-pane-context-menu-stop-video'
-                onClick = { muteAllVideo }>
-                <Icon
-                    size = { 20 }
-                    src = { IconVideoOff } />
-                <span>{ t('participantsPane.actions.stopEveryonesVideo') }</span>
-            </ContextMenuItem>
-
+            <ContextMenuItemGroup>
+                <ContextMenuItem
+                    id = 'participants-pane-context-menu-stop-video'
+                    onClick = { muteAllVideo }>
+                    <Icon
+                        size = { 20 }
+                        src = { IconVideoOff } />
+                    <span>{ t('participantsPane.actions.stopEveryonesVideo') }</span>
+                </ContextMenuItem>
+            </ContextMenuItemGroup>
             { isModerationSupported && !allModerators ? (
-                <>
+                <ContextMenuItemGroup>
                     <div className = { classes.text }>
                         {t('participantsPane.actions.allow')}
                     </div>
                             <span>{ t('participantsPane.actions.startModeration') }</span>
                         </ContextMenuItem>
                     )}
-                </>
+                </ContextMenuItemGroup>
             ) : undefined
             }
         </ContextMenu>

react/features/participants-pane/components/web/styled.js

   cursor: pointer;
   display: flex;
   min-height: 40px;
-  padding: 8px 16px;
+  padding: 10px 16px;
 
   & > *:not(:last-child) {
     margin-right: 16px;