Migrate design system from ethereal/cool to warm/craft/guild theme

Replace ghost/whisper/sparkle color palettes with guild/candlelight/parchment/ember/earth tokens.
Switch typography from NB Television Pro to Quietism serif. Update all 25 Vue components,
layouts, and pages to new design system. Add circle color tokens, typography scale, prose-guild
class, and warm texture effects. Clean up stale documentation files.
This commit is contained in:
Jennie Robinson Faber 2026-02-24 20:01:11 +00:00
parent d588c49946
commit a62e167876
39 changed files with 1300 additions and 2087 deletions

367
CLAUDE.md
View file

@ -1,329 +1,94 @@
## 2. Member Features
# CLAUDE.md
### Member Profiles
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
**Core Fields:**
## Project Overview
- Name, pronouns, time zone
- Avatar/photo - choose from ghosts
- Studio/organization affiliation
- Bio (rich text)
- Skills tags (searchable)
- Location (city/region)
- Social links (Mastodon, LinkedIn, etc.)
- **Offering:** What I can contribute
- **Looking For:** What I need support with
Ghost Guild is a membership community platform for game developers exploring cooperative business models. Built with Nuxt 4, Vue 3, MongoDB, and Nuxt UI 4.
**Privacy Controls:**
## Commands
- Public/members-only/private toggle per field
- Opt-in to member directory
### Member Updates/Mini Blog
- Post updates about projects, learnings, questions
- Rich text with image support
- Comments enabled
- Filter by circle or topic tags
## 3. Events System
### Core Features
- RSVP with capacity limits
- Waitlist management
- Add to calendar (.ics download)
- Pre-event discussion threads
- Post-event recordings archive
- Speaker/facilitator profiles
### Member-Proposed Events
**Proposal Flow:**
1. Member submits event idea via form
2. Include: Topic, format, target circle, time commitment
3. Admin quick review (spam check only)
4. Published to "Proposed Events" board
5. Members can express interest (like feature upvote pages)
6. If threshold met (e.g., 5 interested), event is scheduled
7. Proposer gets facilitator support if needed
## 4. Resources Integration
### Consolidating Existing Assets
**Import and organize from:**
- learn.weirdghosts.ca content
- Existing tools and templates
- PA curriculum materials (where appropriate)
- Case studies and examples
**Organization Structure:**
```
Resources/
├── Start Here/
│ ├── Welcome Letter from Jennie & Eileen
│ ├── How Ghost Guild Works
│ └── Solidarity Economics Explained
├── Learning Paths/
│ ├── Community Track → links to learn.weirdghosts.ca
│ ├── Founder Track → practical tools
│ └── Practitioner Track → advanced resources
├── Templates & Tools/
│ ├── Governance/
│ ├── Financial/
│ ├── Operations/
│ └── Legal/
├── Case Studies/
│ └── Member stories and examples
└── External Resources/
└── Curated links and recommendations
```bash
npm run dev # Start dev server at http://localhost:3000
npm run build # Production build
npm run preview # Preview production build
```
### Resource Features
No test framework is currently configured.
- Tag by circle relevance (but accessible to all)
- Download tracking for impact metrics
- Version control for templates
- Comment threads on resources
- "Request a resource" feature
## Architecture
## 5. Peer Support System
### Stack
### Cal.com Integration for 1:1s
- **Framework:** Nuxt 4 (Vue 3 + Nitro server)
- **UI:** Nuxt UI 4 (`@nuxt/ui@^4`) with Tailwind CSS
- **Database:** MongoDB via Mongoose
- **Auth:** JWT magic link (email-only, no passwords)
- **Payments:** Helcim (recurring subscriptions + ticket sales)
- **Email:** Resend
- **Slack:** `@slack/web-api` for member invitations and notifications
- **Images:** Cloudinary
- **Analytics:** Plausible (`ghostguild.org`)
**Setup:**
### Key Directories
- Each member can enable peer support availability
- Set their own hours/frequency
- Cal.com handles scheduling
- Types of sessions:
- Peer support (30 min)
- Co-founder check-in (45 min)
- Practitioner office hours (60 min)
- `app/composables/` — State management via `useState()` (no Pinia/Vuex). Key composables: `useAuth`, `useHelcim`, `useMemberPayment`, `useMemberStatus`
- `app/config/` — Circle definitions (`circles.js`) and contribution tiers (`contributions.js`) used across frontend and forms
- `app/middleware/` — Route guards: `auth.js` (member pages), `admin.js` (admin pages), `coming-soon.global.js` (launch gate)
- `app/layouts/``default`, `admin`, `landing`, `coming-soon`
- `server/api/` — Nitro API routes organized by feature: `auth/`, `events/`, `members/`, `helcim/`, `series/`, `updates/`, `admin/`, `slack/`
- `server/models/` — Mongoose schemas: `Member`, `Event`, `Series`, `Update`
- `server/utils/` — Service integrations: `mongoose.js`, `helcim.js`, `resend.js`, `slack.ts`, `tickets.js`
**Matching System:**
### Domain Model
- Simple questionnaire about current needs
- Suggest 3 potential peers based on:
- Complementary skills/needs
- Time zone compatibility
- Circle alignment (optional)
- Book directly via Cal.com links
Three membership **circles**: Community, Founder, Practitioner — each with different access and context. Five **contribution tiers**: $0, $5, $15, $30, $50/month via Helcim subscriptions.
## 6. Dashboard Design
Member statuses: `pending_payment`, `active`, `suspended`, `cancelled`.
### Personalized Sections
Events support ticketing with circle-specific pricing overrides and can be grouped into Series with bundled passes.
**Welcome Block:**
### Design System
- "Welcome back, [Name]"
- Your circle: [Circle] | Your contribution: $X/month
- Quick stats: Days as member, events attended, peers met
- **Colors:** `guild-*` (warm neutral), `candlelight-*` (amber/gold accent), `parchment-*` (cream surfaces), `ember-*` (rust accent), `earth-*` (brown/ochre) — defined in `app/assets/css/main.css`
- **Circle tokens:** `--color-circle-community`, `--color-circle-founder`, `--color-circle-practitioner` with `-light`, `-dark`, `-bg` variants
- **Typography:** Inter (body), Quietism (display/headers, self-hosted from `public/fonts/`), Ubuntu Mono (code)
- **Theme:** `primary: amber`, `neutral: stone` — configured in `app/app.config.ts`
- **Effects:** `.candlelight-glow`, `.warm-text`, `.ink-grain`, `.paper-texture`, `.woodcut-border`, `.guild-stamp`, `.halftone-texture`, `.dithered-bg`, `.dithered-warm`
- **Content:** `.prose-guild` class for wiki/long-form content with warm palette and Quietism headings
**Community Pulse:**
### Environment
- Recent member updates (mini blog posts)
- Upcoming events this week
- New resources added
- New members to welcome
Copy `.env.example` to `.env`. Required: `MONGODB_URI`, `JWT_SECRET`, `RESEND_API_KEY`, `HELCIM_API_TOKEN`, `SLACK_BOT_TOKEN`. Public vars are prefixed `NUXT_PUBLIC_`. The `NUXT_PUBLIC_COMING_SOON` flag gates access behind a launch page.
**Your Activity:**
## Conventions
- Your upcoming events
- Scheduled peer sessions
- Recent discussions you're in
- Resources you've bookmarked
- All frontend code is plain JavaScript (not TypeScript), using Vue 3 Composition API
- Server utilities auto-imported by Nitro — no explicit imports needed in API routes
- Use `USwitch` (not `UToggle`) — this is the correct Nuxt UI 3+ component name
- No fallback/placeholder data — always use real data
- Follow Nuxt 4 file-based routing conventions for route naming
- Always check Nuxt UI 3 latest documentation on the web when implementing UI components
**Take Action:**
## Product Spec
- Post an update
- Propose an event
- Book a peer session
- Browse resources
- Update profile
The sections below describe planned and in-progress features for reference.
**Impact Metrics:**
### Member Features
- Profiles with privacy controls (public/members-only/private per field)
- Member updates/mini blog with rich text and images
- Peer support system with Cal.com integration for 1:1 scheduling
- Total solidarity spots funded
- Events hosted this month
- Active members this week
- Resources shared
### Events System
- RSVP with capacity limits and waitlist management
- Calendar export (.ics), ticketing, series passes
- Member-proposed events with interest threshold
## 7. Collaborative Tools
### Resources (Planned)
- Learning paths by circle, templates and tools, case studies
- Tag by circle relevance, download tracking, version control
### Etherpad Integration
**Use Cases:**
- Meeting notes templates
- Collaborative resource creation
- Event planning documents
- Shared learning notes
**Implementation:**
- Self-hosted Etherpad instance
- SSO with Ghost Guild accounts
- Auto-save and version history
- Export to multiple formats
- Embed in event pages for notes
### Living Documents
- Community-maintained guides
- Glossaries and definitions
- Frequently asked questions
- Best practices collections
## 8. Technical Infrastructure
### Notification System
**Channels:**
- Email (via Resend)
- In-app notifications
- Slack integration via bot
**Configurable Preferences:**
- Event reminders
- New resources in your area
- Peer session invitations
- Member updates digest
- Community announcements
### Search & Discovery
- Full-text search across:
- Resources
- Member profiles
- Event descriptions
- Member updates
- Filter by circle, tags, date
- Save searches for alerts
### Analytics & Reporting
- Member engagement metrics
- Resource usage stats
- Event attendance patterns
- Contribution distribution
- Circle movement tracking
## 9. Content for Launch
### Essential Content Pieces
1. **Welcome Video** - Jennie & Eileen introduce Ghost Guild
2. **How This Works** - Clear explanation of circles and contributions
3. **Circle Guides** - What to expect in each circle
4. **Solidarity Economics** - Practical examples from gaming
5. **Getting Started Checklist** - First week actions
### Pre-Populated Content
- 10-15 essential resources per circle
- 3-5 upcoming events scheduled
- Sample member updates to show activity
- FAQ based on pre-registration questions
## 10. Launch Strategy
### Soft Launch (Week Before)
- Invite 10-15 friendly testers
- Each from different backgrounds/circles
- Gather feedback on:
- Onboarding flow
- Resource organization
- Event system
- Profile creation
### Launch Week
**Day 1-2:** PA alumni and close network
- Personal invitations
- Extra support available
- Gather testimonials
**Day 3-4:** Gamma Space announcement
- Post in relevant channels
- Host info session
**Day 5-7:** Public launch
- Email pre-registration list
- Social media announcement
- Open registration
### Success Metrics
**Week 1:**
- 30 members across all circles
- 80% complete profiles
- 50% attend first event
**Month 1:**
- 75 active members
- 5 member-proposed events
- 20 peer sessions booked
- 90% Slack participation
## 11. Ongoing Operations
### Weekly Tasks
- Review member proposals for events
- Process Gamma Space channel access
- Update resource library
- Send member spotlight
### Monthly Tasks
- Impact report to members
- Review and adjust contribution distribution
- Plan next month's events
- Gather member feedback
### Quarterly Reviews
- Assess circle definitions
- Evaluate pricing model
- Review platform features
- Plan new initiatives
---
## Implementation Priority Order
### Must Have for Launch
1. Payment processing (Helcim)
2. Basic Slack automation
3. Member dashboard
4. Simple resource library
5. Event listing and RSVP
### Nice to Have for Launch
7. Member profiles
8. Peer matching system
9. Cal.com integration
10. Member updates/blog
### Can Build Post-Launch
11. Etherpad integration
12. Member-proposed events
13. Advanced search
14. Analytics dashboard
15. Monthly themes
### Implementation Priority
**Must have:** Payment processing, Slack automation, member dashboard, resource library, event listing/RSVP
**Nice to have:** Member profiles, peer matching, Cal.com, member updates
**Post-launch:** Etherpad integration, member-proposed events, advanced search, analytics dashboard