From 2618d9cc1489171b67981990a8924f0d3759e166 Mon Sep 17 00:00:00 2001 From: Michael Maurakis Date: Sun, 19 Jan 2025 23:30:59 -0600 Subject: [PATCH] added tags to allow usage as a pwa --- index.html | 17 +++++++++++++++++ manifest.json | 20 +++++++++++++++++++- styles.css | 5 ++++- 3 files changed, 40 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index a680eb2..689d234 100644 --- a/index.html +++ b/index.html @@ -6,6 +6,23 @@ FumbleAround + + + + + + + + + + + + + + + + +
diff --git a/manifest.json b/manifest.json index 851f366..21a8370 100644 --- a/manifest.json +++ b/manifest.json @@ -1,8 +1,26 @@ { "manifest_version": 3, - "name": "FumbleUpon", + "name": "FumbleAround", + "short_name": "FumbleAround", "version": "1.0", "description": "Discover random websites, just like StumbleUpon used to do!", + "display": "standalone", + "orientation": "portrait", + "start_url": "/", + "background_color": "#ffffff", + "theme_color": "#ffffff", + "icons": [ + { + "src": "./Assets/smily.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "./Assets/smily.png", + "sizes": "512x512", + "type": "image/png" + } + ], "permissions": [], "content_scripts": [ { diff --git a/styles.css b/styles.css index ba5d1db..b7489a6 100644 --- a/styles.css +++ b/styles.css @@ -288,10 +288,13 @@ body { @media (max-width: 768px) { body { flex-direction: column-reverse; + /* Add padding for iOS safe areas */ + padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); } header { padding: 0.75rem 1rem; + padding-bottom: calc(0.75rem + env(safe-area-inset-bottom)); position: fixed; bottom: 0; left: 0; @@ -319,7 +322,7 @@ body { } #contentFrame { - height: calc(100% - 60px); /* Adjust based on header height */ + height: calc(100% - 60px - env(safe-area-inset-bottom)); } .social-buttons {