diff --git a/ts/components/session/calling/CallInFullScreenContainer.tsx b/ts/components/session/calling/CallInFullScreenContainer.tsx
index 63005592f..99b6f628a 100644
--- a/ts/components/session/calling/CallInFullScreenContainer.tsx
+++ b/ts/components/session/calling/CallInFullScreenContainer.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import useKey from 'react-use/lib/useKey';
import styled from 'styled-components';
@@ -21,7 +21,7 @@ const CallInFullScreenVisible = styled.div`
left: 0;
display: flex;
flex-direction: column;
- background-color: rgba(0, 0, 0, 0.6);
+ background-color: black;
border: var(--session-border);
opacity: 1;
`;
@@ -47,6 +47,14 @@ export const CallInFullScreenContainer = () => {
useKey('Escape', () => {
toggleFullScreenOFF();
});
+
+ useEffect(() => {
+ // close fullscreen mode if the remote video gets muted
+ if (remoteStreamVideoIsMuted) {
+ dispatch(setFullScreenCall(false));
+ }
+ }, [remoteStreamVideoIsMuted]);
+
if (
!hasOngoingCall ||
!ongoingCallPubkey ||
diff --git a/ts/components/session/calling/InConversationCallContainer.tsx b/ts/components/session/calling/InConversationCallContainer.tsx
index df06d6e74..e4903b68f 100644
--- a/ts/components/session/calling/InConversationCallContainer.tsx
+++ b/ts/components/session/calling/InConversationCallContainer.tsx
@@ -343,7 +343,7 @@ export const InConversationCallContainer = () => {
showAudioInputMenu(currentConnectedAudioInputs, e);
}}
/>
-
+ {!remoteStreamVideoIsMuted && }