web: add dynamic page titles

This commit is contained in:
wukko 2024-06-25 21:01:08 +06:00
parent 7b289bfb16
commit 635561394c
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
5 changed files with 30 additions and 0 deletions

View file

@ -3,6 +3,10 @@
import MeowbaltLoaf from "$components/meowbalt/MeowbaltLoaf.svelte"; import MeowbaltLoaf from "$components/meowbalt/MeowbaltLoaf.svelte";
</script> </script>
<svelte:head>
<title>cobalt</title>
</svelte:head>
<div id="cobalt-save-container" class="center-column-container"> <div id="cobalt-save-container" class="center-column-container">
<main id="cobalt-save"> <main id="cobalt-save">
<MeowbaltLoaf /> <MeowbaltLoaf />

View file

@ -2,4 +2,10 @@
import Placeholder from "$components/misc/Placeholder.svelte"; import Placeholder from "$components/misc/Placeholder.svelte";
</script> </script>
<svelte:head>
<title>
cobalt: about
</title>
</svelte:head>
<Placeholder pageName="about" /> <Placeholder pageName="about" />

View file

@ -2,4 +2,10 @@
import Placeholder from "$components/misc/Placeholder.svelte"; import Placeholder from "$components/misc/Placeholder.svelte";
</script> </script>
<svelte:head>
<title>
cobalt: donate
</title>
</svelte:head>
<Placeholder pageName="donate" /> <Placeholder pageName="donate" />

View file

@ -15,11 +15,19 @@
let screenWidth: number; let screenWidth: number;
$: currentPageTitle = $page.url.pathname.split("/").at(-1); $: currentPageTitle = $page.url.pathname.split("/").at(-1);
$: stringPageTitle =
currentPageTitle !== "settings" ? `/ ${currentPageTitle}` : "";
$: isMobile = screenWidth <= 750; $: isMobile = screenWidth <= 750;
$: isHome = $page.url.pathname === `/settings`; $: isHome = $page.url.pathname === `/settings`;
</script> </script>
<svelte:head>
<title>
cobalt: settings {stringPageTitle}
</title>
</svelte:head>
<svelte:window bind:innerWidth={screenWidth} /> <svelte:window bind:innerWidth={screenWidth} />
<div id="settings-page"> <div id="settings-page">

View file

@ -2,4 +2,10 @@
import Placeholder from "$components/misc/Placeholder.svelte"; import Placeholder from "$components/misc/Placeholder.svelte";
</script> </script>
<svelte:head>
<title>
cobalt: updates
</title>
</svelte:head>
<Placeholder pageName="updates" /> <Placeholder pageName="updates" />