fix: convert component usage examples to text descriptions

Replace code examples in component comments with text descriptions
to prevent svelte-check from parsing them as actual component code.
This resolves 5 type errors related to component names in comments.

src/lib/components/cards/MemberCard.svelte

···
 	@param {string} handle - The member's full Bluesky handle
 	
 	Usage:
-	<MemberCard 
-		title="Alice" 
-		href="alice.bsky.social"
-		avatar="https://..."
-		handle="alice.bsky.social"
-	/>
+	Pass title, href (Bluesky handle), avatar URL, and handle props.
+	The card will display the member's profile with links to various platforms.
 -->
 <script lang="ts">
 	// Import external link icon from lucide-svelte icon library

src/lib/components/cards/ProjectCard.svelte

···
 	@param {boolean} [disabled] - If true, card is greyed out and non-clickable
 	
 	Usage:
-	<ProjectCard 
-		title="My Project" 
-		href="https://example.com"
-		logo="/logo.png"
-		handle="myproject.bsky.social"
-	/>
-	
-	<!-- Coming soon project -->
-	<ProjectCard 
-		title="Future Project" 
-		disabled={true}
-	/>
+	Import and use with props for title, href, logo, handle, and disabled.
+	For coming-soon projects, set disabled to true to grey out the card.
 -->
 <script lang="ts">
 	// Import external link icon from lucide-svelte icon library

src/lib/components/layout/Header.svelte

···
 	- High z-index to stay above other content
 	
 	Usage:
-	<Header />
+	No props required. Simply import and add to your layout.
 -->
 <script lang="ts">
 	// No props or logic needed at this time

src/lib/components/layout/Hero.svelte

···
 	- Tagline slides in from the left
 	
 	Usage:
-	<Hero title="Jollywhoppers" tagline="A freaky lil thing!" />
+	Pass title and optional tagline props to customize the hero section display.
 -->
 <script lang="ts">
 	// Import the Jollywhoppers logo

src/lib/components/sections/About.svelte

···
 	@param {Array} [items=[]] - Array of items with { label, href? } structure
 	
 	Usage:
-	<About 
-		title="About" 
-		items={[
-			{ label: 'Our Mission', href: '/mission' },
-			{ label: 'Contact Us', href: '/contact' },
-			{ label: 'Just some text' }
-		]}
-	/>
+	Pass title and items array. Items with href become clickable links,
+	items without href are displayed as plain text. Each item needs a label property.
 -->
 <script lang="ts">
 	// Import arrow icon for link indicators

src/lib/components/sections/MemberGrid.svelte

···
 	- handle: Full handle for display
 	
 	Usage:
-	<MemberGrid 
-		title="Members" 
-		members={[
-			{ title: 'Alice', href: 'alice.bsky.social', avatar: '...', handle: 'alice.bsky.social' },
-			{ title: 'Bob', href: 'bob.bsky.social', avatar: '...', handle: 'bob.bsky.social' }
-		]}
-	/>
+	Pass title and members array. Each member object should have title, href,
+	avatar, and handle properties. The grid automatically adjusts to screen size.
 -->
 <script lang="ts">
 	// Import the MemberCard component for displaying individual members

src/lib/components/sections/ProjectGrid.svelte

···
 	- disabled: If true, card is greyed out (for coming-soon projects)
 	
 	Usage:
-	<ProjectGrid 
-		title="Projects" 
-		projects={[
-			{ title: 'Project A', href: 'https://example.com' },
-			{ title: 'Project B', href: '#', disabled: true }
-		]}
-	/>
+	Pass title and projects array. Each project object should have title, optional
+	href, logo, handle, and disabled properties. Disabled projects appear greyed out.
 -->
 <script lang="ts">
 	// Import the ProjectCard component for displaying individual projects

src/lib/components/ui/Avatar.svelte

···
 	@param {...HTMLAttributes<HTMLDivElement>} restProps - Any additional HTML attributes
 	
 	Usage:
-	<!-- With image -->
-	<Avatar title="Alice" avatar="https://example.com/avatar.jpg" size={64} />
-	
-	<!-- Without image (uses fallback) -->
-	<Avatar title="Bob" size={48} />
-	
-	<!-- With custom size -->
-	<Avatar title="Charlie" avatar="..." size="5rem" />
-	
-	<!-- With additional classes -->
-	<Avatar title="Dana" avatar="..." class="custom-class" />
+	Pass title prop (required), optional avatar URL, size (number or string),
+	and any additional HTML div attributes. Component handles image loading errors
+	automatically by displaying a fallback icon.
 -->
 <script lang="ts">
 	// Import the Lollipop icon from lucide-svelte for the fallback display