imperial · matalex412 · Aug 27, 2024 · Aug 23, 2024
diff --git a/app/favicon.ico b/app/favicon.ico
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -9,15 +9,71 @@ import { Box, Flex } from "@radix-ui/themes"
 import "@radix-ui/themes/components.css"
 import "@radix-ui/themes/tokens/base.css"
 import "@radix-ui/themes/utilities.css"
-import { Metadata } from "next"
+import { Metadata, Viewport } from "next"
 import { ThemeProvider } from "next-themes"
 import { Inter } from "next/font/google"
+import Head from "next/head"
 import { ReactNode } from "react"
 
 // Next object for information in the HTML head
 export const metadata: Metadata = {
   title: "CPP Connect",
   description: "Connecting quality Imperial students with quality employers",
+  applicationName: "CPP Connect",
+  appleWebApp: {
+    title: "CPP Connect",
+  },
+  manifest: "/site.webmanifest",
+
+  // icons for all devices & platforms
+  icons: {
+    apple: [
+      {
+        url: "/apple-touch-icon.png",
+        sizes: "180x180",
+        type: "image/png",
+      },
+    ],
+    icon: [
+      {
+        url: "/favicon-32x32.png",
+        sizes: "32x32",
+        type: "image/png",
+      },
+      {
+        url: "/favicon-16x16.png",
+        sizes: "16x16",
+        type: "image/png",
+      },
+    ],
+  },
+
+  // rich previews
+  openGraph: {
+    title: "CPP Connect",
+    description: "Connecting quality Imperial students with quality employers",
+    url: "https://cpp.doc.ic.ac.uk/",
+    siteName: "CPP Connect",
+    locale: "en_GB",
+    type: "website",
+  },
+
+  twitter: {
+    card: "summary",
+    title: "CPP Connect",
+    description: "Connecting quality Imperial students with quality employers",
+    site: "@ICComputing",
+    creator: "@ICComputing",
+  },
+
+  // other stuff
+  other: {
+    "msapplication-TileColor": "#0000cd",
+  },
+}
+
+export const viewport: Viewport = {
+  themeColor: "#ffffff",
 }
 
 const inter = Inter({ subsets: ["latin"] })
@@ -29,6 +85,9 @@ const RootLayout = ({
 }>) => {
   return (
     <html lang="en">
+      <Head>
+        <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#0000cd" />
+      </Head>
       <body className={inter.className}>
         <ThemeProvider attribute="class">
           <Theme accentColor="blue" grayColor="gray">

diff --git a/assets/favicon.ai b/assets/favicon.ai
diff --git a/assets/favicon.svg b/assets/favicon.svg
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/browserconfig.xml b/public/browserconfig.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#0000cd</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>
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/mstile-144x144.png b/public/mstile-144x144.png
diff --git a/public/mstile-150x150.png b/public/mstile-150x150.png
diff --git a/public/mstile-310x150.png b/public/mstile-310x150.png
diff --git a/public/mstile-310x310.png b/public/mstile-310x310.png
diff --git a/public/mstile-70x70.png b/public/mstile-70x70.png
diff --git a/public/safari-pinned-tab.svg b/public/safari-pinned-tab.svg
diff --git a/public/site.webmanifest b/public/site.webmanifest
@@ -0,0 +1,19 @@
+{
+    "name": "CPP Connect",
+    "short_name": "CPP Connect",
+    "icons": [
+        {
+            "src": "/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#0000cd",
+    "background_color": "#ffffff",
+    "display": "standalone"
+}