fix(video-thumbnail) Fixed name for remote participants

Display name on thumbnail for remote participants as well
Updated style
This commit is contained in:
robertpin 2021-10-22 16:50:07 +03:00 committed by Horatiu Muresan
parent f1e13404b7
commit 0715f85796
2 changed files with 9 additions and 1 deletions

View File

@ -190,6 +190,13 @@
z-index: $zindex2;
}
&__participant-name {
color: #fff;
background-color: rgba(0,0,0,.4);
padding: 3px 7px;
border-radius: 3px;
}
@media (min-width: 581px) {
&.shift-right {
&#largeVideoContainer {

View File

@ -812,7 +812,7 @@ class Thumbnail extends Component<Props, State> {
</span>
<div className = 'videocontainer__toolbar'>
<StatusIndicators participantID = { id } />
<div>{ _participant.name }</div>
<span className = 'videocontainer__participant-name'>{_participant.name}</span>
</div>
<div className = 'videocontainer__toptoolbar'>
{ this._renderTopIndicators() }
@ -960,6 +960,7 @@ class Thumbnail extends Component<Props, State> {
</div>
<div className = 'videocontainer__toolbar'>
<StatusIndicators participantID = { id } />
<span className = 'videocontainer__participant-name'>{_participant.name}</span>
</div>
<div className = 'videocontainer__hoverOverlay' />
<div className = 'displayNameContainer'>