From 6d7c86606951a9ed8e4f1c242688994c1a7480e1 Mon Sep 17 00:00:00 2001
From: Steve Paul <steveebenezer@protonmail.com>
Date: Fri, 15 Dec 2023 08:34:50 +0530
Subject: [PATCH] Refactor header and add tagline

---
 src/layouts/Layout.astro | 12 +++++++-----
 src/pages/index.astro    |  4 +++-
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 6b7d988..a5c251a 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,9 +1,11 @@
 ---
 export interface Props {
+	site: string;
 	title: string;
+	tagline: string;
 }
 
-const { title } = Astro.props;
+const { site, title, tagline } = Astro.props;
 ---
 
 <!DOCTYPE html>
@@ -14,7 +16,7 @@ const { title } = Astro.props;
 		<link rel="icon" type="image/svg+xml" href="/icon.png" />
 		<script src="./theme.js"></script>
 		<meta name="generator" content={Astro.generator} />
-		<title>{title}</title>
+		<title>{site} — {tagline}</title>
 	</head>
 
 <!-- Google tag (gtag.js) -->
@@ -28,9 +30,10 @@ const { title } = Astro.props;
 </script>
 
 	<body>
-		<header>
+		<header class="nu-u-mb-10 nu-u-mt-12">
 			<div class="container">
-				<h1 class="nu-c-h3 title">Enhance Your Craft with AI</h1>
+				<h1 class="nu-c-h3 nu-u-text--primary nu-u-mt-0 nu-u-mb-2 title">{title}</h1>
+				<p class="nu-c-fs-normal nu-u-text--secondary">{tagline}</p>
 			</div>
 		</header>
 		<button class="theme-toggle" id="theme-toggle" title="Toggles light & dark" aria-label="auto" aria-live="polite">
@@ -50,7 +53,6 @@ const { title } = Astro.props;
 	html { font-family: var(--system-ui); background-color: var(--background);}
 	body { margin: 0; padding: 0;}
 	main, .container { margin: auto var(--spacing-09);}
-	h1.title { margin-bottom: var(--spacing-10); color: var(--text-primary); margin-top: var(--spacing-12); }
 	section { margin-bottom: var(--spacing-10);}
 	p { margin-top: var(--spacing-00);}
 	.nu-u-link--subtle { color: var(--text-secondary) !important;}
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 9efe6ba..304f591 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -11,7 +11,9 @@ import "@new-ui/spacings";
 ---
 
 <Layout
-  title="Rise of Machine — A curated set of powerful AI tools for makers."
+  site="Rise of Machine"
+  title="Enhance Your Craft with AI"
+  tagline="A curated set of powerful AI tools for makers."
 >
   <main>
     {data.tools.map(section => {