Relocated "HD" label

This commit is contained in:
Maxim Voloshin 2016-10-19 15:31:13 +03:00
parent 4b82bc0e33
commit 88be44b472
3 changed files with 19 additions and 9 deletions

View File

@ -46,6 +46,8 @@ $dominantSpeakerBg: #165ecc;
$raiseHandBg: #D6D61E; $raiseHandBg: #D6D61E;
$audioLevelBg: #44A5FF; $audioLevelBg: #44A5FF;
$audioLevelShadow: rgba(9, 36, 77, 0.9); $audioLevelShadow: rgba(9, 36, 77, 0.9);
$videoStateIndicatorColor: $defaultColor;
$videoStateIndicatorBackground: $tooltipBg;
/** /**
* Feedback Modal * Feedback Modal

View File

@ -546,16 +546,24 @@
0px 0px 1px rgba(0,0,0,0.3); 0px 0px 1px rgba(0,0,0,0.3);
} }
.video-state-indicator {
background: $videoStateIndicatorBackground;
color: $videoStateIndicatorColor;
font-size: 13px;
line-height: 1.4;
text-align: center;
display: block;
min-width: 37px;
padding: 10px 0;
border-radius: 50%;
}
#videoResolutionLabel { #videoResolutionLabel {
display: none; display: none;
position: absolute; position: absolute;
top: 5px; top: 30px;
right: 5px; right: 30px;
background: rgba(0,0,0,.5);
padding: 10px;
color: rgba(255,255,255,.5);
z-index: 1011; z-index: 1011;
border-radius: 50%;
} }
.centeredVideoLabel { .centeredVideoLabel {
@ -580,8 +588,8 @@
} }
.moveToCorner { .moveToCorner {
top: 5px; top: 30px;
right: 50px; /*leave free space for the HD label*/ right: 80px; /*leave free space for the HD label*/
margin-right: 0px; margin-right: 0px;
margin-left: auto; margin-left: auto;
background: rgba(0,0,0,.3); background: rgba(0,0,0,.3);

View File

@ -240,7 +240,7 @@
<video id="largeVideo" muted="true" autoplay></video> <video id="largeVideo" muted="true" autoplay></video>
</div> </div>
<span id="localConnectionMessage"></span> <span id="localConnectionMessage"></span>
<span id="videoResolutionLabel">HD</span> <span id="videoResolutionLabel" class="video-state-indicator">HD</span>
<span id="recordingLabel" class="centeredVideoLabel"> <span id="recordingLabel" class="centeredVideoLabel">
<span id="recordingLabelText"></span> <span id="recordingLabelText"></span>
<img id="recordingSpinner" class="recordingSpinner" src="images/spin.svg"></img> <img id="recordingSpinner" class="recordingSpinner" src="images/spin.svg"></img>