fix(quality-slider): prevent resizing by making p2p warning hidden (#1890)
* fix(quality-slider): prevent resizing by making p2p warning hidden Instead of removing and appending the p2p warning, make it always appended but toggle visibility so it always takes up space. This should prevent resizing when the warning appears. Margin and padding were adjusted to account for the empty space displayed by a hidden p2p warning. * let vertical size change
This commit is contained in:
parent
5e4d3de8fd
commit
3e3577766d
|
@ -1,6 +1,11 @@
|
|||
.video-quality-dialog {
|
||||
color: $modalTextColor;
|
||||
|
||||
.hide-warning {
|
||||
height: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.video-quality-dialog-title {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
|
|
@ -115,13 +115,16 @@ class VideoQualityDialog extends Component {
|
|||
render() {
|
||||
const { _audioOnly, _p2p, t } = this.props;
|
||||
const activeSliderOption = this._mapCurrentQualityToSliderValue();
|
||||
const showP2PWarning = _p2p && !_audioOnly;
|
||||
|
||||
return (
|
||||
<div className = 'video-quality-dialog'>
|
||||
<h3 className = 'video-quality-dialog-title'>
|
||||
{ t('videoStatus.callQuality') }
|
||||
</h3>
|
||||
{ !_audioOnly && _p2p ? this._renderP2PMessage() : null }
|
||||
<div className = { showP2PWarning ? '' : 'hide-warning' }>
|
||||
{ this._renderP2PMessage() }
|
||||
</div>
|
||||
<div className = 'video-quality-dialog-contents'>
|
||||
<div className = 'video-quality-dialog-slider-container'>
|
||||
{ /* FIXME: onChange and onMouseUp are both used for
|
||||
|
|
Loading…
Reference in New Issue