From b96d2ea35202f28ecdd4314f3bc120f4df9bfa0f Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Mon, 9 Sep 2024 12:19:25 +0600
Subject: [PATCH] web: add og:title to head on all pages with custom title

---
 web/src/components/subnav/PageNav.svelte | 13 +++++++++----
 web/src/routes/+page.svelte              |  4 +++-
 web/src/routes/donate/+page.svelte       |  4 ++++
 web/src/routes/remux/+page.svelte        |  4 ++++
 web/src/routes/updates/+page.svelte      |  4 ++++
 5 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/web/src/components/subnav/PageNav.svelte b/web/src/components/subnav/PageNav.svelte
index eec10971..c3255c78 100644
--- a/web/src/components/subnav/PageNav.svelte
+++ b/web/src/components/subnav/PageNav.svelte
@@ -36,6 +36,10 @@
     <title>
         {homeTitle}{stringPageTitle} ~ {$t("general.cobalt")}
     </title>
+    <meta
+        property="og:title"
+        content="{homeTitle}{stringPageTitle} ~ {$t('general.cobalt')}"
+    />
 </svelte:head>
 
 <svelte:window bind:innerWidth={screenWidth} />
@@ -79,7 +83,10 @@
             {/if}
         </div>
 
-        <nav class="subnav-navigation" class:visible-mobile={isMobile && isHome}>
+        <nav
+            class="subnav-navigation"
+            class:visible-mobile={isMobile && isHome}
+        >
             <slot name="navigation"></slot>
             {#if isMobile && isHome && pageSubtitle}
                 <div class="subtext subnav-subtitle center">
@@ -108,9 +115,7 @@
     .subnav-page {
         --subnav-nav-width: 250px;
         --subnav-padding: 30px;
-        --subnav-padding-small: calc(
-            var(--subnav-padding) - var(--padding)
-        );
+        --subnav-padding-small: calc(var(--subnav-padding) - var(--padding));
         display: grid;
         width: 100%;
         grid-template-columns: var(--subnav-nav-width) 1fr;
diff --git a/web/src/routes/+page.svelte b/web/src/routes/+page.svelte
index 465d56e1..4b264897 100644
--- a/web/src/routes/+page.svelte
+++ b/web/src/routes/+page.svelte
@@ -8,6 +8,7 @@
 
 <svelte:head>
     <title>{$t("general.cobalt")}</title>
+    <meta property="og:title" content={$t("general.cobalt")} />
 </svelte:head>
 
 <div id="cobalt-save-container" class="center-column-container">
@@ -22,7 +23,8 @@
         <Omnibox />
     </main>
     <div id="terms-note">
-        {$t("save.terms.note.agreement")} <a href="/about/terms">{$t("save.terms.note.link")}</a>
+        {$t("save.terms.note.agreement")}
+        <a href="/about/terms">{$t("save.terms.note.link")}</a>
     </div>
 </div>
 
diff --git a/web/src/routes/donate/+page.svelte b/web/src/routes/donate/+page.svelte
index 3c3a6e9b..beb4b856 100644
--- a/web/src/routes/donate/+page.svelte
+++ b/web/src/routes/donate/+page.svelte
@@ -16,6 +16,10 @@
     <title>
         {$t("tabs.donate")} ~ {$t("general.cobalt")}
     </title>
+    <meta
+        property="og:title"
+        content="{$t("tabs.donate")} ~ {$t("general.cobalt")}"
+    />
 </svelte:head>
 
 <div id="donate-page-wrapper">
diff --git a/web/src/routes/remux/+page.svelte b/web/src/routes/remux/+page.svelte
index 6b31a6d6..69af6a09 100644
--- a/web/src/routes/remux/+page.svelte
+++ b/web/src/routes/remux/+page.svelte
@@ -190,6 +190,10 @@
 
 <svelte:head>
     <title>{$t("tabs.remux")} ~ {$t("general.cobalt")}</title>
+    <meta
+        property="og:title"
+        content="{$t("tabs.remux")} ~ {$t("general.cobalt")}"
+    />
 </svelte:head>
 
 <DropReceiver id="remux-container" bind:draggedOver bind:file>
diff --git a/web/src/routes/updates/+page.svelte b/web/src/routes/updates/+page.svelte
index ed2995b4..4786af3a 100644
--- a/web/src/routes/updates/+page.svelte
+++ b/web/src/routes/updates/+page.svelte
@@ -82,6 +82,10 @@
     <title>
         {$t("tabs.updates")} ~ {$t("general.cobalt")}
     </title>
+    <meta
+        property="og:title"
+        content="{$t("tabs.updates")} ~ {$t("general.cobalt")}"
+    />
 </svelte:head>
 
 <svelte:window on:keydown={handleKeydown} />