trailofbits/tubertc

View on GitHub
public/css/viewports.css

Summary

Maintainability
Test Coverage
#trtc_dashboard {
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border: 50px solid transparent;
}

.trtc_row {
    width:100%;
    position: relative;
}

.trtc_column {
    height: 100%;
    float: left;
    position: relative;
}

.trtc_viewport {
    position: relative;
    float: left;
    box-sizing: border-box;
    border: 5px solid transparent;
}

.trtc_viewport video {
    height: 100%;
    width: 100%;
    object-fit: contain;
}

.trtc_view {
    height: 100%;
    width: 100%;
  
    position: relative;
}

.trtc_label {
    position: absolute;
    opacity: 0.8;
    color: #ffffff;
    background: #000000;
    padding: 2px 2px 2px 2px;
    margin: 2px 2px 2px 2px;
}

.trtc_local_mute {
    position: absolute;
    height:29px;
    width:29px;
    top:0;
    right:0;
    background-image: url('../images/speaker.svg');
    opacity:0;
}

.trtc_local_mute_muted {
    opacity:0.7;
    background-image: url('../images/muted_speaker.svg');
}

.trtc_usericon {
    display: none;
    height: 100%;
    width: 100%;
    object-fit: contain;
}

.trtc_muted {
    display: none;
    position: absolute;
    top: 30px;
    right: 15px;
    height: 50px;
    width: 50px;
    object-fit: contain;
    opacity: 0.3;
}

.video_mirror {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
}

.trtc_audiometer {
    position: absolute;
    height: 2px;
}

.trtc_audiometerfill {
    background: #00ff00;
    width: 0%;
    height: 100%;
}