finished navbar and blog. todo: finishing touches

template/ROUTING_GUIDE.md

@@ -0,0 +1,98 @@
+# SvelteKit Routing Guide
+
+This guide explains how the dynamic routing system works in this Sanity + SvelteKit template, including URL patterns and content management.
+
+## URL Structure
+
+The template uses the following URL patterns:
+
+### Custom Pages
+- **Pattern**: `/{slug}`
+- **Example**: `/about`, `/contact`, `/services`
+- **Content Type**: `custom` pages from Sanity
+- **Route File**: `src/routes/[slug]/+page.svelte`
+
+### Blog Posts
+- **Pattern**: `/blog/{slug}`
+- **Example**: `/blog/my-first-post`, `/blog/web-development-tips`
+- **Content Type**: `blog` posts from Sanity
+- **Route File**: `src/routes/blog/[slug]/+page.svelte`
+
+### Blog Index
+- **Pattern**: `/blog`
+- **Shows**: List of all blog posts
+- **Route File**: `src/routes/blog/+page.svelte`
+
+## File Structure
+
+```
+src/routes/
+├── [slug]/                          # Custom pages at root level
+│   ├── +page.server.ts             # Server-side data loading
+│   └── +page.svelte                # Custom page component
+├── blog/
+│   ├── +page.server.ts             # Blog index server load
+│   ├── +page.svelte                # Blog index component
+│   └── [slug]/                     # Individual blog posts
+│       ├── +page.server.ts         # Blog post server load
+│       └── +page.svelte            # Blog post component
+├── +layout.server.ts               # Global layout data
+└── +layout.svelte                  # Global layout component
+```
+
+## How It Works
+
+### 1. URL Resolution Order
+
+SvelteKit resolves URLs in this order:
+1. **Exact routes** (e.g., `/blog`)
+2. **Parameterized routes** (e.g., `/blog/[slug]`, `/[slug]`)
+
+This means:
+- `/blog` → Blog index page
+- `/blog/some-post` → Blog post page
+- `/about` → Custom page (if exists)
+- `/nonexistent` → 404 error
+
+### 2. Data Loading Flow
+
+#### Custom Pages (`/[slug]`)
+
+```typescript
+// +page.server.ts
+const CUSTOM_QUERY = `*[_type == "custom" && slug.current == $slug][0]`;
+const custom = await serverClient.fetch(CUSTOM_QUERY, { slug });
+```
+
+#### Blog Posts (`/blog/[slug]`)
+
+```typescript
+// +page.server.ts
+const BLOG_QUERY = `*[_type == "blog" && slug.current == $slug][0]`;
+const blog = await serverClient.fetch(BLOG_QUERY, { slug });
+```
+
+### 3. Content Types
+
+#### Custom Page Schema
+```typescript
+type Custom = {
+  _id: string;
+  _type: 'custom';
+  title?: string;
+  slug?: Slug;
+  tags?: Array<string>;
+  publishedAt?: string;
+  body?: BlockContent;
+  seoTitle?: string;
+  seoDescription?: string;
+}
+```
+
+#### Blog Post Schema
+```typescript
+type Blog = {
+  _id: string;
+  _type: 'blog';
+  title?: string;
+  slug