Better title styling

DanielPower · May 21, 2024 · 7f147ad · 7f147ad
1 parent c37ee9e
commit 7f147ad
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/src/lib/utils/string.ts b/src/lib/utils/string.ts
@@ -0,0 +1,5 @@
+export const capitalize = (str: string) =>
+	str
+		.split(" ")
+		.map((s) => s[0].toUpperCase() + s.slice(1))
+		.join(" ");
diff --git a/src/routes/page/[page]/+page.svelte b/src/routes/page/[page]/+page.svelte
@@ -10,6 +10,7 @@
 	import { gfm } from "@milkdown/preset-gfm";
 	import { listener, listenerCtx } from "@milkdown/plugin-listener";
 	import { diagram } from "@milkdown/plugin-diagram";
+	import { capitalize } from "$lib/utils/string";
 
 	export let data: PageData;
 	let unsavedMarkdown: string | null = null;
@@ -69,11 +70,16 @@
 </script>
 
 <div class="page">
-	<h1>{data.fileName}</h1>
+	<div class="title">{capitalize(data.fileName)}</div>
 	<div use:editor></div>
 </div>
 
 <style>
+	.title {
+		font-size: 2rem;
+		text-align: center;
+		color: var(--lavender);
+	}
 	.page {
 		padding: 1rem;
 	}