Add Support for iOS "Add to Homescreen"

* Adds basic Manifest.json
 * Adds Meta Tags for iOS
 * Adds Meta Tags for Android
 * Adds Logo for Manifest.json
 * Adds iOS Logo for homescreen

src/main.rs

@@ -19,6 +19,21 @@ async fn style() -> HttpResponse {
 	HttpResponse::Ok().content_type("text/css").body(include_str!("../static/style.css"))
 }
 
+// Required for creating a PWA
+async fn manifest() -> HttpResponse {
+	HttpResponse::Ok().content_type("application/json").body(include_str!("../static/manifest.json"))
+}
+
+// Required for the manifest to be valid
+async fn pwa_logo() -> HttpResponse {
+	HttpResponse::Ok().content_type("image/png").body(include_bytes!("../static/logo.png").as_ref())
+}
+
+// Required for iOS App Icons
+async fn iphone_logo() -> HttpResponse {
+	HttpResponse::Ok().content_type("image/png").body(include_bytes!("../static/touch-icon-iphone.png").as_ref())
+}
+
 async fn robots() -> HttpResponse {
 	HttpResponse::Ok()
 		.header("Cache-Control", "public, max-age=1209600, s-maxage=86400")
@@ -75,7 +90,7 @@ async fn main() -> std::io::Result<()> {
 					.header("X-Frame-Options", "DENY")
 					.header(
 						"Content-Security-Policy",
-						"default-src 'none'; media-src 'self'; style-src 'self' 'unsafe-inline'; base-uri 'none'; img-src 'self' data:; form-action 'self'; frame-ancestors 'none';",
+						"default-src 'none'; manifest-src 'self'; media-src 'self'; style-src 'self' 'unsafe-inline'; base-uri 'none'; img-src 'self' data:; form-action 'self'; frame-ancestors 'none';",
 					),
 			)
 			// Default service in case no routes match
@@ -84,6 +99,9 @@ async fn main() -> std::io::Result<()> {
 			.route("/style.css/", web::get().to(style))
 			.route("/favicon.ico/", web::get().to(favicon))
 			.route("/robots.txt/", web::get().to(robots))
+			.route("/manifest.json/", web::get().to(manifest))
+			.route("/logo.png/", web::get().to(pwa_logo))
+			.route("/touch-icon-iphone.png/", web::get().to(iphone_logo))
 			// Proxy media through Libreddit
 			.route("/proxy/{url:.*}/", web::get().to(proxy::handler))
 			// Browse user profile

static/manifest.json

@@ -0,0 +1,15 @@
+{
+    "name": "Libreddit",
+    "short_name": "Libreddit",
+    "display": "standalone",
+    "background_color": "#2A3443",
+    "description": "An alternative private front-end to Reddit",
+    "theme_color": "#2A3443",
+    "icons": [
+      {
+        "src": "./logo.png",
+        "sizes": "512x512",
+        "type": "image/png"
+      }
+    ]
+  }

templates/base.html

@@ -6,6 +6,19 @@
 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 		<meta name="description" content="View on Libreddit, an alternative private front-end to Reddit.">
 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<!-- General PWA -->
+		<meta name="theme-color" content="#009a9a"/>
+		<!-- iOS Application -->
+		<meta name="apple-mobile-web-app-title" content="Libreddit">
+		<meta name="apple-mobile-web-app-capable" content="yes">
+		<meta name="apple-mobile-web-app-status-bar-style" content="default">
+		<!-- Android  -->
+		<meta name="theme-color" content="#2A3443">
+		<meta name="mobile-web-app-capable" content="yes">
+		<!-- iOS Logo -->
+		<link href="/touch-icon-iphone.png" rel="apple-touch-icon">
+		<!-- PWA Manifest -->
+		<link rel="manifest" type="application/json" href="/manifest.json">
 		<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"> 
 		<link rel="stylesheet" type="text/css" href="/style.css">
 		{% endblock %}