Dynamically set og:url

theninthsky · Jul 3, 2022 · 3af8cf4 · 3af8cf4
1 parent a077be3
commit 3af8cf4
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 5 deletions.
diff --git a/public/index.js b/public/index.js
@@ -1,4 +1,4 @@
-module.exports = ({ scripts, title, description, data = [] }) => `
+module.exports = ({ path, title, description, scripts, data = [] }) => `
   <!DOCTYPE html>
   <html lang="en">
     <head>
@@ -8,7 +8,7 @@ module.exports = ({ scripts, title, description, data = [] }) => `
       <meta name="description" content="${description}">
       <meta property="og:title" content="${title}">
       <meta property="og:type" content="website">
-      <meta property="og:url" content="https://client-side-rendering.pages.dev">
+      <meta property="og:url" content="https://client-side-rendering.pages.dev${path}">
       <meta property="og:image" content="https://client-side-rendering.pages.dev/icons/og-icon.png">
 
       <link rel="shortcut icon" href="icons/favicon.ico">

diff --git a/src/components/Navigation.jsx b/src/components/Navigation.jsx
@@ -71,7 +71,7 @@ const style = {
   drawer: css`
     .MuiDrawer-paper {
       align-items: flex-start;
-      padding: 10px 15px;
+      padding: 10px 22px;
       background-color: var(--bg-color);
     }
   `,

diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
@@ -49,6 +49,11 @@ const style = {
   `,
   input: css`
     margin-top: 20px;
+    color: #1976d2;
+
+    .MuiOutlinedInput-notchedOutline {
+      border: 1px solid rgba(25, 118, 210, 0.5);
+    }
   `,
   switch: css`
     margin-left: -10px;

diff --git a/webpack.config.js b/webpack.config.js
@@ -86,7 +86,7 @@ module.exports = (_, { mode }) => {
       ...(production ? [] : [new ForkTsCheckerPlugin()]),
       new ESLintPlugin(),
       ...pagesManifest.map(
-        ({ name, title, description, vendors, data }) =>
+        ({ name, path, title, description, vendors, data }) =>
           new HtmlPlugin({
             filename: `${name}.html`,
             scriptLoading: 'module',
@@ -99,7 +99,7 @@ module.exports = (_, { mode }) => {
 
               if (data && !Array.isArray(data)) data = [data]
 
-              return htmlTemplate({ scripts: [script, ...vendorScripts], title, description, data })
+              return htmlTemplate({ path, title, description, scripts: [script, ...vendorScripts], data })
             }
           })
       ),