+4

.gitignore

··· 22 22 *.njsproj 23 23 *.sln 24 24 *.sw? 25 25 + 26 26 + # Claude Code project instructions 27 27 + claude.md 28 28 + CLAUDE.md

-59

claude.md

··· 1 1 - 2 2 - Project: Social Meshes builder, you are a distinguished Staff engineer actively building social meshes, This project is a web-based explorer for open social networks. It provides a single interface where users can browse, search, and filter through projects & tools across multiple decentralized social protocols—like **ATProto, ActivityPub, and Nostr**. 3 3 - 4 4 - 5 5 - 6 6 - ## Builder Mindset 7 7 - 8 8 - 9 9 - 10 10 - - Ship working code today, refactor tomorrow 11 11 - 12 12 - - Security is built-in, not bolted-on 13 13 - 14 14 - - Test-driven: write the test, then make it pass 15 15 - 16 16 - - When stuck, check Context7 for patterns and examples 17 17 - 18 18 - - ASK QUESTIONS if you need context surrounding the product DONT ASSUME 19 19 - 20 20 - 21 21 - 22 22 - #### Human & LLM Readability Guidelines: 23 23 - 24 24 - - Descriptive Naming: Use full words over abbreviations (e.g., CommunityGovernance not CommGov) 25 25 - 26 26 - 27 27 - 28 28 - ## Tech Stack 29 29 - 30 30 - - **Frontend**: **Vite + React + TypeScript** (simple SPA, no Next.js) 31 31 - - **Fuse.js** for client-side search 32 32 - - **Static JSON data** in `/data/projects.json` (split per network if desired) 33 33 - - **Tailwind CSS** for styling (dark theme) 34 34 - 35 35 - 36 36 - 37 37 - 38 38 - ## Core Principles 39 39 - 40 40 - 1. **Type Safety** - TypeScript strict mode, no `any` 41 41 - 42 42 - 2. **Security by Default** - OWASP guidelines 43 43 - 44 44 - 3. **Clean Architecture** - Separation of concerns 45 45 - 46 46 - 47 47 - 48 48 - ## TypeScript Standards 49 49 - 50 50 - - Strict mode enabled 51 51 - - Explicit return types 52 52 - - Proper error types 53 53 - - Use `unknown` over `any` 54 54 - - Interfaces for object shapes 55 55 - 56 56 - ## Key Reminders 57 57 - 58 58 - - Validate all user inputs 59 59 - - Implement proper error handling

+4 -2

src/components/ProjectCard.tsx

··· 54 54 }; 55 55 56 56 return ( 57 57 - <div className="bg-gray-800 rounded-lg overflow-hidden border border-gray-700 hover:border-gray-600 transition-colors"> 58 58 - <div className="p-4 space-y-3"> 57 57 + <div className="bg-gray-800 rounded-lg overflow-hidden border border-gray-700 hover:border-gray-600 transition-colors h-full flex flex-col"> 58 58 + <div className="p-4 flex flex-col flex-grow space-y-3"> 59 59 <div className="flex items-start justify-between"> 60 60 <div className="flex items-center space-x-3"> 61 61 {project.logoUrl ? ( ··· 117 117 </span> 118 118 )} 119 119 </div> 120 120 + 121 121 + <div className="flex-grow"></div> 120 122 121 123 {project.links && project.links.length > 0 && ( 122 124 <div className="flex gap-2 pt-2 border-t border-gray-700">