Define vh CSS variable from viewport height

2022-08-29 14:21:06 +02:00
parent 5ed7142e9e
commit f0a7e9f38d
3 changed files with 8 additions and 3 deletions
--- a/src/style/organisms/_cart.scss
+++ b/src/style/organisms/_cart.scss
@@ -4,7 +4,7 @@
    top: 80px;
    right: 0;
    width: 100%;
-    height: calc(100vh - 80px);
+    height: calc(var(--vh) - 80px);
    display: flex;
    flex-direction: column;
    overflow: auto;
@@ -16,7 +16,7 @@
        top: 24px;
        right: 24px;
        width: clamp(320px, 45vw, 500px);
-        height: calc(100vh - 48px);
+        height: calc(var(--vh) - 48px);
        max-height: 1000px;
        border-radius: 8px;
        padding: 24px 32px 32px;
--- a/src/style/pages/_viewer.scss
+++ b/src/style/pages/_viewer.scss
@@ -1,7 +1,7 @@
 :global(.photo-page) {
    position: relative;
    width: 100vw;
-    height: 100vh;
+    height: var(--vh);
    display: flex;
    align-items: center;
    overflow: hidden;