Bladeren bron

Fixes #2261

Don't use 100vh, it doesn't work properly on mobile
JC Brand 4 jaren geleden
bovenliggende
commit
31a05f111b
3 gewijzigde bestanden met toevoegingen van 7 en 7 verwijderingen
  1. 3 3
      sass/_chatbox.scss
  2. 2 2
      sass/_chatrooms.scss
  3. 2 2
      sass/_controlbox.scss

+ 3 - 3
sass/_chatbox.scss

@@ -150,12 +150,12 @@
             @media screen and (max-height: $mobile-landscape-height) {
             @media screen and (max-height: $mobile-landscape-height) {
                 height: var(--mobile-chat-height);
                 height: var(--mobile-chat-height);
                 width: var(--mobile-chat-width);
                 width: var(--mobile-chat-width);
-                height: 100vh;
+                height: var(--fullpage-chat-height);
             }
             }
             @media screen and (max-width: $mobile-portrait-length) {
             @media screen and (max-width: $mobile-portrait-length) {
                 height: var(--mobile-chat-height);
                 height: var(--mobile-chat-height);
                 width: var(--mobile-chat-width);
                 width: var(--mobile-chat-width);
-                height: 100vh;
+                height: var(--fullpage-chat-height);
             }
             }
         }
         }
         .chat-title {
         .chat-title {
@@ -605,7 +605,7 @@
                 .box-flyout {
                 .box-flyout {
                     left: 50px;
                     left: 50px;
                     bottom: 0;
                     bottom: 0;
-                    height: 100vh;
+                    height: var(--fullpage-chat-height);
                     box-shadow: none;
                     box-shadow: none;
                 }
                 }
             }
             }

+ 2 - 2
sass/_chatrooms.scss

@@ -124,12 +124,12 @@
             @media screen and (max-height: $mobile-landscape-height) {
             @media screen and (max-height: $mobile-landscape-height) {
                 height: var(--mobile-chat-height);
                 height: var(--mobile-chat-height);
                 width: var(--mobile-chat-width);
                 width: var(--mobile-chat-width);
-                height: 100vh;
+                height: var(--fullpage-chat-height);
             }
             }
             @media screen and (max-width: $mobile-portrait-length) {
             @media screen and (max-width: $mobile-portrait-length) {
                 height: var(--mobile-chat-height);
                 height: var(--mobile-chat-height);
                 width: var(--mobile-chat-width);
                 width: var(--mobile-chat-width);
-                height: 100vh;
+                height: var(--fullpage-chat-height);
             }
             }
             .chatroom-body {
             .chatroom-body {
                 flex-direction: row;
                 flex-direction: row;

+ 2 - 2
sass/_controlbox.scss

@@ -593,7 +593,7 @@
                     bottom: 0;
                     bottom: 0;
                     border-radius: 0;
                     border-radius: 0;
                     width: 100vw !important;
                     width: 100vw !important;
-                    height: 100vh !important;
+                    height: var(--fullpage-chat-height);
                 }
                 }
             }
             }
 
 
@@ -601,7 +601,7 @@
                 width: 100vw !important;
                 width: 100vw !important;
                 .box-flyout {
                 .box-flyout {
                     width: 100vw !important;
                     width: 100vw !important;
-                    height: 100vh !important;
+                    height: var(--fullpage-chat-height);
                     margin-right: -15px;
                     margin-right: -15px;
                 }
                 }
                 .sidebar {
                 .sidebar {