fix graph paper pattern from not extending beyond first 100vh of page…

… before overflow page content
eighty4 · Aug 29, 2024 · 02e4aa0 · 02e4aa0
1 parent 8e41c66
commit 02e4aa0
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 9 deletions.
diff --git a/frontend/index.html b/frontend/index.html
@@ -43,6 +43,10 @@
             --card-text-color: var(--black);
             --card-graph-color: rgb(var(--black-rgb), 40%);
             font-family: 'Inter Variable', Helvetica, sans-serif;
+            background-color: var(--card-bg-color);
+            background-image: radial-gradient(circle, var(--card-graph-color) 1px, transparent 1px);
+            background-position: center;
+            background-size: 3rem 3rem;
 
             &.flipped {
                 --head-bg-color: var(--white);
@@ -54,17 +58,10 @@
         }
 
         html, body {
-            background: var(--card-bg-color);
             min-height: 100vh;
             overflow-x: hidden;
         }
 
-        body {
-            background-image: radial-gradient(circle, var(--card-graph-color) 1px, transparent 1px);
-            background-position: center;
-            background-size: 3rem 3rem;
-        }
-
         #grid {
             height: 100vh;
             width: 100vw;

diff --git a/frontend/src/graphPaper.css b/frontend/src/graphPaper.css
@@ -12,14 +12,16 @@ html.out:not(.reader) #triangle {
 }
 
 #graph-paper-positioning {
-    position: relative;
+    position: absolute;
     left: 20vw;
     top: 20vh;
     width: 60vw;
+    min-height: 60vh;
 }
 
 #graph-paper {
-    margin: 10vw auto 0;
+    margin: 0 auto;
+    padding: 10vh 0;
     max-width: 38rem;
     width: 40vw;
 }