From ec8570e355dc719852e4a9c46f9c07d5b4a93ae0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= Date: Tue, 9 Jul 2019 12:48:47 +0200 Subject: Reduce opacity of avatars for peers that are not connected MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Until now the opacity of the avatar was reduced when the peer was created until it got connected for the first time. Now the opacity of the avatar is reduced whenever the peer is not connected. In practice, the difference is that now the opacity is changed too when there are issues with the connection to the other peer. Note that the issues were already signaled using the loading icon, but only after a long disconnection; now the opacity is reduced as soon as there is a disconnection, which provides quicker feedback of the issue while keeping the previous behaviour (as the loading icon is still shown in a long disconnection). Signed-off-by: Daniel Calviño Sánchez --- css/video.scss | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'css') diff --git a/css/video.scss b/css/video.scss index e858a7c77..1559d8ec3 100644 --- a/css/video.scss +++ b/css/video.scss @@ -72,6 +72,10 @@ video { box-shadow: 0 0 15px $color-box-shadow; } +#videos .videoContainer .avatar.not-connected { + opacity: 0.5; +} + .participants-1 #videos .videoContainer video, .participants-2 #videos .videoContainer video { padding: 0; -- cgit v1.2.3 From ac7c311efe4e69494ee46b6e7dda7a3be2b9bced Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= Date: Tue, 9 Jul 2019 12:48:47 +0200 Subject: Reduce opacity of videos for peers that are not connected MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Until now only the opacity of the avatar was reduced when the peer was not connected. However, if the video was being shown the avatar was hidden, so if there was an issue with the connection to the other peer it was not reflected in the VideoView. Note that the loading icon should be shown too in the video for long disconnections or failures, but ":after" CSS pseudo classes (which are used by the loading icon) do not work with video elements, so for now only the opacity is reduced. Signed-off-by: Daniel Calviño Sánchez --- css/video.scss | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) (limited to 'css') diff --git a/css/video.scss b/css/video.scss index 1559d8ec3..8a0d909a4 100644 --- a/css/video.scss +++ b/css/video.scss @@ -60,6 +60,13 @@ video { filter: none; } +#videos .videoContainer.not-connected { + video, + .avatar { + opacity: 0.5; + } +} + #videos .videoContainer:not(.promoted) video { max-height: 200px; max-width: 100%; @@ -72,10 +79,6 @@ video { box-shadow: 0 0 15px $color-box-shadow; } -#videos .videoContainer .avatar.not-connected { - opacity: 0.5; -} - .participants-1 #videos .videoContainer video, .participants-2 #videos .videoContainer video { padding: 0; -- cgit v1.2.3