add opengraph info maybe

src/mainPage.tsx

@@ -5,6 +5,8 @@ import { FoodExcludeTypes } from "./types";
 
 const FONT_TYPES = [
   ["default", "Default (Comic Sans, Comic Neue or Default)"],
+  ["system", "System Sans Font (as picked by Bootstrap Defaults)"],
+
   ["comicneue", "Comic Neue"],
   ["opendyslexic", "Open Dyslexic"]
 ];

src/theme.scss

@@ -63,6 +63,9 @@ body {
 html [data-font="default"] {
     font-family: $fonts-comic-sans-neue;
 }
+html [data-font="system"] {
+    font-family: $default-fonts;
+}
 html [data-font="comicneue"] {
     font-family: $fonts-comic-neue;
 }

webpack-dev.config.js

@@ -22,7 +22,14 @@ module.exports = {
     },
     devtool: "eval-source-map",
     plugins: [
-    new HtmlWebpackPlugin({ title: "Chaos's Food Likes/Dislikes" })
+        new HtmlWebpackPlugin({
+            title: "Chaos's Food Likes/Dislikes",
+            aseUrl: './',
+            meta: {
+                'og:title': { property: 'og:title', content: "Chaos's Food Likes/Dislikes" },
+                'og:description': { property: 'og:description', content: "A list for all the foods we like, dislike and find unable to eat due to sensory difficulties." },
+            },
+        })
     ],
     devServer: {
         historyApiFallback: true,

webpack.config.js

@@ -20,7 +20,14 @@ module.exports = {
     hints: false,
   },
   plugins: [
-    new HtmlWebpackPlugin({ title: "Chaos's Food Likes/Dislikes", baseUrl: './' })
+    new HtmlWebpackPlugin({
+      title: "Chaos's Food Likes/Dislikes",
+      aseUrl: './',
+      meta: {
+        'og:title': { property: 'og:title', content: "Chaos's Food Likes/Dislikes" },
+        'og:description': { property: 'og:description', content: "A list for all the foods we like, dislike and find unable to eat due to sensory difficulties." },
+      },
+    })
   ],
   devServer: {
     historyApiFallback: true,