From 9cf4294fe8951f0a979d58f14b394cdf35af93aa Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Thu, 10 Sep 2020 01:59:39 +0200
Subject: its all about the notch

---
 StoneIsland/www/css/index.css      |  5 ++---
 StoneIsland/www/css/nav.css        | 23 ++++++++++++++++-------
 StoneIsland/www/index.html         |  2 +-
 StoneIsland/www/js/lib/etc/push.js |  2 +-
 4 files changed, 20 insertions(+), 12 deletions(-)

(limited to 'StoneIsland')

diff --git a/StoneIsland/www/css/index.css b/StoneIsland/www/css/index.css
index 2130c675..d4336438 100755
--- a/StoneIsland/www/css/index.css
+++ b/StoneIsland/www/css/index.css
@@ -2,8 +2,8 @@
   -webkit-tap-highlight-color: rgba(0,0,0,0);
 }
 body, html {
-  height: 100%;
-  width: 100%;
+  height: 100vh;
+  width: 100vw;
   margin: 0px;
   padding: 0px;
   overflow: hidden;
@@ -18,7 +18,6 @@ body {
   background: #fff;
   font-family: pfd, sans-serif;
   font-size: 0.875rem;
-  padding-top: constant(safe-area-inset-top);
 }
 a, a:visited {
   color: #000;
diff --git a/StoneIsland/www/css/nav.css b/StoneIsland/www/css/nav.css
index 8ae57921..bd6747b1 100755
--- a/StoneIsland/www/css/nav.css
+++ b/StoneIsland/www/css/nav.css
@@ -3,7 +3,9 @@
 
 #nav {
   position: fixed;
-  top: 0; left: 0;
+  top: env(safe-area-inset-top);
+  left: 0;
+  height: calc(100vh - env(safe-area-inset-top));
   width: 249px;
   -webkit-transform: translateZ(0) translateX(-249px);
   -webkit-transition: -webkit-transform 0.1s;
@@ -11,8 +13,10 @@
 }
 #content {
   position: fixed;
-  top: 0; left: 0;
-  width: 100%; height: 100%;
+  top: env(safe-area-inset-top);
+  left: 0;
+  width: 100%;
+  height: calc(100vh - env(safe-area-inset-top));
   overflow: hidden;
   -webkit-transform: translateZ(0) translateX(0px);
   -webkit-transition: -webkit-transform 0.1s;
@@ -88,7 +92,7 @@
   position: absolute;
   width: 100%;
   padding: 20px 0;
-  top:0;
+  top: 0;
   border-top: 1px solid #ddd;
 }
 
@@ -102,9 +106,10 @@
 
 #nav .social {
   position: absolute;
-  top: calc(100vh - 48px);
+  bottom: env(safe-area-inset-bottom);
   left: 0;
   border-top: 1px solid #ddd;
+  border-bottom: 1px solid #ddd;
   display: flex;
   flex-direction: row;
 }
@@ -162,7 +167,7 @@
 
 #nav-container {
   display:flex;
-  height:calc(100vh - 40px);
+  height: 100%;
   width:100%;
   position:absolute;
   flex-direction: column;
@@ -343,9 +348,13 @@ padding-bottom:0px;
 #footer {
   display: block;
   position: fixed;
-  bottom: 0; left: 0; width: 100%;
+  bottom: 0;
+  left: 0;
+  width: 100%;
   background: #fff;
   border-top: 1px solid #ddd;
+  border-bottom: 1px solid #ddd;
+  margin-bottom: env(safe-area-inset-bottom);
   z-index: 1;
 }
 #footer div {
diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html
index d8065176..1fee338c 100755
--- a/StoneIsland/www/index.html
+++ b/StoneIsland/www/index.html
@@ -15,7 +15,7 @@
 <meta http-equiv="Content-Security-Policy" content="default-src * gap: 'unsafe-inline' 'unsafe-eval' https://ssl.gstatic.com https://www.google-analytics.com; script-src * 'unsafe-inline' 'unsafe-eval'; object-src * 'unsafe-inline' 'unsafe-eval' https://ssl.gstatic.com https://www.google-analytics.com; style-src * 'unsafe-inline' 'unsafe-eval'; img-src * 'unsafe-inline' 'unsafe-eval'; media-src * 'unsafe-inline' 'unsafe-eval'; frame-src * gap: 'unsafe-inline' 'unsafe-eval' https://ssl.gstatic.com https://www.google-analytics.com; font-src * 'unsafe-inline' 'unsafe-eval'; connect-src * 'unsafe-inline' 'unsafe-eval'">
   <meta name="format-detection" content="telephone=no">
   <meta name="msapplication-tap-highlight" content="no">
-  <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height">
+  <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width, height=device-height, viewport-fit=cover">
   <meta charset="utf-8">
   <link rel="stylesheet" type="text/css" href="css/fonts/fonts.css">
   <link rel="stylesheet" type="text/css" href="css/fonts/ionicons.css">
diff --git a/StoneIsland/www/js/lib/etc/push.js b/StoneIsland/www/js/lib/etc/push.js
index 1f0ab9b6..6158f04b 100755
--- a/StoneIsland/www/js/lib/etc/push.js
+++ b/StoneIsland/www/js/lib/etc/push.js
@@ -163,6 +163,6 @@ var push = (function(){
   }
   push.error = function(e){
     console.log("push error")
-  }  
+  }
   return push
 })()
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2