michael/FumbleAround
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added tags to allow usage as a pwa

Browse source
This commit is contained in:
Michael Andrew Maurakis 2025-01-19 23:30:59 -06:00
parent 2f2035bf35
commit 2618d9cc14
3 changed files with 40 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
index.html
View file

@ -6,6 +6,23 @@
<title>FumbleAround</title> <title>FumbleAround</title>
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<link rel="icon" type="image/png" href="./Assets/smily.png"> <link rel="icon" type="image/png" href="./Assets/smily.png">
<!-- PWA Meta Tags -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="FumbleAround">
<meta name="mobile-web-app-capable" content="yes">
<meta name="theme-color" content="#ffffff">
<meta name="application-name" content="FumbleAround">
<!-- Apple Touch Icons -->
<link rel="apple-touch-icon" href="./Assets/smily.png">
<link rel="apple-touch-icon" sizes="152x152" href="./Assets/smily.png">
<link rel="apple-touch-icon" sizes="180x180" href="./Assets/smily.png">
<link rel="apple-touch-icon" sizes="167x167" href="./Assets/smily.png">
<!-- Web Manifest -->
<link rel="manifest" href="manifest.json">
</head> </head>
<body> <body>
<header> <header>

20
manifest.json
View file

@ -1,8 +1,26 @@
{ {
"manifest_version": 3, "manifest_version": 3,
"name": "FumbleUpon", "name": "FumbleAround",
"short_name": "FumbleAround",
"version": "1.0", "version": "1.0",
"description": "Discover random websites, just like StumbleUpon used to do!", "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": [], "permissions": [],
"content_scripts": [ "content_scripts": [
{ {

5
styles.css
View file

@ -288,10 +288,13 @@ body {
@media (max-width: 768px) { @media (max-width: 768px) {
body { body {
flex-direction: column-reverse; 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 { header {
padding: 0.75rem 1rem; padding: 0.75rem 1rem;
padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;
@ -319,7 +322,7 @@ body {
} }
#contentFrame { #contentFrame {
height: calc(100% - 60px); /* Adjust based on header height */ height: calc(100% - 60px - env(safe-area-inset-bottom));
} }
.social-buttons { .social-buttons {