1
Fork 0
mirror of https://github.com/jech/galene.git synced 2024-11-23 00:55:58 +01:00

Fix show chat button always hidden on mobile layout

The maximum device with for mobile layout in css is 1024px, for device with > 768 (Ipad)
chat button will stay hidded while chat box is also hidden when there is a video call.
This commit fix the issue.
This commit is contained in:
Alain Takoudjou 2021-03-26 11:08:21 +01:00
parent b660bc404c
commit ffcd866301
2 changed files with 11 additions and 3 deletions

View file

@ -98,7 +98,9 @@
</div> </div>
<div id="resizer"></div> <div id="resizer"></div>
<div class="coln-right" id="right"> <div class="coln-right" id="right">
<span class="show-video blink" id="switch-video"><i class="fas fa-exchange" aria-hidden="true"></i></span> <span class="show-video blink" id="switch-video">
<i class="fas fa-exchange-alt" aria-hidden="true"></i>
</span>
<div class="collapse-video" id="collapse-video"> <div class="collapse-video" id="collapse-video">
<i class="far fa-comment-alt open-chat" title="Open chat"></i> <i class="far fa-comment-alt open-chat" title="Open chat"></i>
</div> </div>

View file

@ -40,6 +40,12 @@ let serverConnection;
let fallbackUserPass = null; let fallbackUserPass = null;
/* max-device-width which is defined in css for mobile layout */
/**
* @type {number}
*/
let mobileViewportWidth = 1024;
/** /**
* @param {string} username * @param {string} username
* @param {string} password * @param {string} password
@ -257,7 +263,7 @@ function showVideo() {
let width = window.innerWidth; let width = window.innerWidth;
let video_container = document.getElementById('video-container'); let video_container = document.getElementById('video-container');
video_container.classList.remove('no-video'); video_container.classList.remove('no-video');
if (width <= 768) if (width <= mobileViewportWidth)
document.getElementById('collapse-video').style.display = "block"; document.getElementById('collapse-video').style.display = "block";
} }
@ -2667,7 +2673,7 @@ document.getElementById('collapse-video').onclick = function(e) {
left.style.display = "block"; left.style.display = "block";
this.style.display = ""; this.style.display = "";
} }
if (width <= 768) { if (width <= mobileViewportWidth) {
// fixed div for small screen // fixed div for small screen
this.style.display = ""; this.style.display = "";
hideVideo(true); hideVideo(true);