Add favicon

benscobie · Aug 5, 2024 · 3e10944 · 3e10944
1 parent 7915bb8
commit 3e10944
Show file tree

Hide file tree

Showing 9 changed files with 47 additions and 9 deletions.
diff --git a/components/Layout.tsx b/components/Layout.tsx
@@ -1,6 +1,7 @@
 import { ReactNode } from "react";
 import Footer from "./ui/organisms/Footer";
 import Header from "./ui/organisms/Header";
+import Head from "next/head";
 
 interface LayoutProps {
   children?: ReactNode | undefined;
@@ -9,11 +10,33 @@ interface LayoutProps {
 
 function Layout({ children, className }: LayoutProps) {
   return (
-    <div className={className}>
-      <Header />
-      <main className="container mx-auto max-w-7xl my-8">{children}</main>
-      <Footer />
-    </div>
+    <>
+      <Head>
+        <link
+          rel="apple-touch-icon"
+          sizes="180x180"
+          href="/apple-touch-icon.png"
+        />
+        <link
+          rel="icon"
+          type="image/png"
+          sizes="32x32"
+          href="/favicon-32x32.png"
+        />
+        <link
+          rel="icon"
+          type="image/png"
+          sizes="16x16"
+          href="/favicon-16x16.png"
+        />
+        <link rel="manifest" href="/site.webmanifest" />
+      </Head>
+      <div className={className}>
+        <Header />
+        <main className="container mx-auto max-w-7xl my-8">{children}</main>
+        <Footer />
+      </div>
+    </>
   );
 }
 

diff --git a/public/android-chrome-192x192.png b/public/android-chrome-192x192.png
diff --git a/public/android-chrome-512x512.png b/public/android-chrome-512x512.png
diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png
diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/site.webmanifest b/public/site.webmanifest
@@ -0,0 +1,19 @@
+{
+  "name": "UK Student Loan Repayment Calculator",
+  "short_name": "UK SLRC",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#FFFFFF",
+  "background_color": "#FFFFFF",
+  "display": "standalone"
+}
diff --git a/public/vercel.svg b/public/vercel.svg