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%);