diff --git a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/styles.js b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/styles.js
index 6810e60691..22a845e703 100644
--- a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/styles.js
+++ b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/styles.js
@@ -91,7 +91,6 @@ const WebcamConnecting = styled.div`
min-width: 100%;
border-radius: 10px;
background-color: ${webcamBackgroundColor};
- scale: 1.5;
z-index: 0;
&::after {
diff --git a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/component.jsx b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/component.jsx
index 45ec5b207b..4712eafa73 100644
--- a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/component.jsx
@@ -117,13 +117,15 @@ const UserActions = (props) => {
});
}
- menuItems.push({
- key: `${cameraId}-mirror`,
- label: intl.formatMessage(intlMessages.mirrorLabel),
- description: intl.formatMessage(intlMessages.mirrorDesc),
- onClick: () => onHandleMirror(cameraId),
- dataTest: 'mirrorWebcamBtn',
- });
+ if (isStream) {
+ menuItems.push({
+ key: `${cameraId}-mirror`,
+ label: intl.formatMessage(intlMessages.mirrorLabel),
+ description: intl.formatMessage(intlMessages.mirrorDesc),
+ onClick: () => onHandleMirror(cameraId),
+ dataTest: 'mirrorWebcamBtn',
+ });
+ }
if (numOfStreams > 2 && isStream) {
menuItems.push({
diff --git a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/styles.js b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/styles.js
index 9def35b4f2..0cfdf9b438 100644
--- a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/styles.js
+++ b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-actions/styles.js
@@ -32,10 +32,7 @@ const DropdownTrigger = styled(DivElipsis)`
const UserName = styled(TextElipsis)`
position: relative;
- max-width: 75%;
// Keep the background with 0.5 opacity, but leave the text with 1
- background-color: rgba(0, 0, 0, 0.5);
- border-radius: 1px;
color: ${colorOffWhite};
padding: 0 1rem 0 .5rem !important;
font-size: 80%;
@@ -48,7 +45,9 @@ const UserName = styled(TextElipsis)`
const Dropdown = styled.div`
display: flex;
outline: none !important;
- width: 70%;
+ background-color: rgba(0, 0, 0, 0.5);
+ border-radius: 10px;
+ display: inline-block;
@media ${mediumUp} {
>[aria-expanded] {
diff --git a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-avatar/styles.js b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-avatar/styles.js
index 58c128901b..9386fe05ae 100644
--- a/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-avatar/styles.js
+++ b/bigbluebutton-html5/imports/ui/components/video-provider/video-list/video-list-item/user-avatar/styles.js
@@ -13,6 +13,7 @@ const UserAvatarStyled = styled(UserAvatar)`
width: 45%;
max-width: 66px;
max-height: 66px;
+ scale: 1.5;
${({ unhealthyStream }) => unhealthyStream && `
filter: grayscale(50%) opacity(50%);