Tweak iOS only CSS

benjaminma · Aug 28, 2021 · c81f274 · c81f274
1 parent 788059d
commit c81f274
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/styles/Home.module.css b/styles/Home.module.css
@@ -136,7 +136,7 @@
 
 .footer {
   width: 100vw;
-  height: 20vh;
+  height: 15vh;
   display: flex;
   justify-content: center;
   align-items: stretch;
@@ -360,6 +360,5 @@
     /* fix mobile viewport */
     height: -webkit-fill-available;
     min-height: -webkit-fill-available;
-    border: 4rem dashed tomato;
   }
 }
diff --git a/styles/globals.css b/styles/globals.css
@@ -46,3 +46,13 @@ a:active {
 * {
   box-sizing: border-box;
 }
+
+/* CSS for iOS only */
+@supports (-webkit-touch-callout: none) {
+  html,
+  body {
+    /* fix mobile viewport */
+    height: -webkit-fill-available;
+    min-height: -webkit-fill-available;
+  }
+}