From 2925a43138d8cbcc502c2a08812db89d920156f4 Mon Sep 17 00:00:00 2001
From: Claude AI Guide Project <project@howto-claude.local>
Date: Tue, 8 Jul 2025 00:26:02 -0600
Subject: [PATCH] feat: Add logo to top navigation

- Add logo.svg from assets to Starlight navigation bar
- Logo appears alongside site title in top nav
- Enhances site branding and visual identity
---
 astro.config.mjs    |  3 ++
 src/assets/logo.svg | 96 +++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 99 insertions(+)
 create mode 100644 src/assets/logo.svg

diff --git a/astro.config.mjs b/astro.config.mjs
index eda2e84..3668b93 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -8,6 +8,9 @@ export default defineConfig({
 		starlight({
 			title: 'How to Talk to Claude',
 			description: 'A comprehensive guide to AI collaboration skills - for humans',
+			logo: {
+				src: './src/assets/logo.svg',
+			},
 			social: [
 				{ icon: 'github', label: 'GitHub', href: 'https://github.com/your-username/how-to-talk-to-claude' }
 			],
diff --git a/src/assets/logo.svg b/src/assets/logo.svg
new file mode 100644
index 0000000..b6908fb
--- /dev/null
+++ b/src/assets/logo.svg
@@ -0,0 +1,96 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   viewBox="0 0 200 60"
+   version="1.1"
+   id="svg4"
+   sodipodi:docname="logo.svg"
+   inkscape:version="1.4.2 (2aeb623e1d, 2025-05-12)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview4"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     showgrid="false"
+     inkscape:zoom="4.185"
+     inkscape:cx="84.109916"
+     inkscape:cy="30.704898"
+     inkscape:window-width="3838"
+     inkscape:window-height="1975"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg4" />
+  <defs
+     id="defs2">
+    <linearGradient
+       id="logoGradient"
+       x1="0%"
+       y1="0%"
+       x2="100%"
+       y2="0%">
+      <stop
+         offset="0%"
+         style="stop-color:#667eea;stop-opacity:1"
+         id="stop1" />
+      <stop
+         offset="100%"
+         style="stop-color:#764ba2;stop-opacity:1"
+         id="stop2" />
+    </linearGradient>
+  </defs>
+  <!-- Chat bubble 1 -->
+  <rect
+     x="10"
+     y="20"
+     width="30"
+     height="20"
+     rx="10"
+     fill="url(#logoGradient)"
+     opacity="0.8"
+     id="rect2" />
+  <!-- Chat bubble 2 -->
+  <rect
+     x="25"
+     y="10"
+     width="30"
+     height="20"
+     rx="10"
+     fill="url(#logoGradient)"
+     opacity="0.6"
+     id="rect3" />
+  <!-- Text -->
+  <text
+     x="132.44209"
+     y="19.504181"
+     font-family="system-ui, sans-serif"
+     font-size="16px"
+     font-weight="600"
+     fill="currentColor"
+     id="text3"><tspan
+       sodipodi:role="line"
+       id="tspan4"
+       x="132.44209"
+       y="19.504181"
+       style="text-align:center;text-anchor:middle">How to Talk</tspan><tspan
+       sodipodi:role="line"
+       id="tspan5"
+       x="132.44209"
+       y="39.504181"
+       style="text-align:center;text-anchor:middle">to Claude</tspan></text>
+  <text
+     x="98.673836"
+     y="53.708485"
+     font-family="system-ui, sans-serif"
+     font-size="12px"
+     fill="currentColor"
+     opacity="0.7"
+     id="text4">for Humans</text>
+</svg>