[yew-devel] [PATCH proxmox-yew-widget-toolkit-assets] change vh/vw to dvh/dvw

[yew-devel] [PATCH proxmox-yew-widget-toolkit-assets] change vh/vw to dvh/dvw

[Dominik Csapak]

using 100vh/vw as the viewport height/width works most of the time, but
on mobile this might be bigger than the viewable part, since the address
bar sometimes is added to that size, even if visible.

to always really show the visible part, use 'dvh/dvw' which are the
'dynamic viewport height/width' and always is the viewable part of the
screen.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 scss/_dialog.scss    | 4 ++--
 scss/_dropdown.scss  | 4 ++--
 scss/_menu.scss      | 4 ++--
 scss/_utilities.scss | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/scss/_dialog.scss b/scss/_dialog.scss
index 3474b77..cd9d533 100644
--- a/scss/_dialog.scss
+++ b/scss/_dialog.scss
@@ -138,8 +138,8 @@ dialog.pwt-outer-dialog {
     width: 100vw;
     max-width: 100vw;
 
-    height: 100vh;
-    max-height: 100vh;
+    height: 100dvh;
+    max-height: 100dvh;
 
     margin: 0px;
     padding: 0px;
diff --git a/scss/_dropdown.scss b/scss/_dropdown.scss
index b07f2cc..671b872 100644
--- a/scss/_dropdown.scss
+++ b/scss/_dropdown.scss
@@ -6,8 +6,8 @@
 
     @include elevation-box-shadow(1);
 
-    max-height: 100vh;
-    max-width: 100vw;
+    max-height: 100dvh;
+    max-width: 100dvw;
     /* make e.g. the header menu overflow visible */
     overflow: visible;
 }
diff --git a/scss/_menu.scss b/scss/_menu.scss
index 1d35c9e..1f81a0f 100644
--- a/scss/_menu.scss
+++ b/scss/_menu.scss
@@ -10,8 +10,8 @@
 
 	@include elevation-box-shadow(2);
 
-	max-height: 100vh;
-	max-width: 100vw;
+	max-height: 100dvh;
+	max-width: 100dvw;
 
 	.pwt-menu {
 		overflow: hidden;
diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index c658885..b52201c 100644
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -188,8 +188,8 @@ $height-width-values: (
     left: 0;
     position: absolute;
     display: flex !important;
-    width: 100vw !important;
-    height: 100vh !important;
+    width: 100dvw !important;
+    height: 100dvh !important;
     overflow: hidden !important;
     box-sizing: border-box;
 }
-- 
2.39.5



_______________________________________________
yew-devel mailing list
yew-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/yew-devel

[yew-devel] applied: [PATCH proxmox-yew-widget-toolkit-assets] change vh/vw to dvh/dvw

[Dietmar Maurer]

applied


_______________________________________________
yew-devel mailing list
yew-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/yew-devel