3.0 KiB
3.0 KiB
GEMINI.md - Haumdaucher Project Handbook
This document serves as the "Source of Truth" for the Haumdaucher website. It outlines the design principles, technical architecture, and specialized features to ensure consistent future development.
🦢 Project Essence
Haumdaucher is a community project from Regensburg, Germany. The website is designed to be humorous, culturally rich (Bavarian), and technically "surprising."
🎨 Design Principles
- Vibrant Aesthetics: Each theme must feel like a completely different app.
- Glassmorphism: Use
backdrop-filterand semi-transparent backgrounds for a premium feel. - Micro-interactions: Subtle entrance animations (logo spin, hero text slide) and consistent hover states.
- Accessibility: Mobile-first design with safe-area support for PWA usage on iOS/Android.
🛠 Technical Specifications
- Framework: Vue 3 (Composition API) + Vite + TypeScript.
- State Management: Centralized in
App.vueusing standardrefhooks. Persisted inlocalStorage. - Theming System:
- Driven by
data-themeattribute on:root. - Defined in
src/assets/styles/global.css. - Themes:
Classic,Unicorn,Luxury,Win95,NAT.
- Driven by
- Localization:
- Centralized in
src/locales/i18n.ts. - Supports
de(Standard German) andbar(Bavarian Dialect).
- Centralized in
- PWA:
- Managed via
vite-plugin-pwa. - Custom icons and standalone manifest for "Add to Home Screen" support.
- Managed via
🧪 Testing
- Framework: Vitest + HappyDOM.
- Scope: Lightweight sanity checks (e.g., verifying App mount).
- Commands:
npm test: Run tests in watch mode.npm test -- --run: Run tests once (CI mode).
🕹 The Haumdaucher Game
- Engine: HTML5 Canvas rendering.
- Controls: Touch-responsive (horizontal drag) and Keyboard (Arrow Keys).
- Thematization: The game visual style (backgrounds, player, obstacles) changes dynamically based on the site's active theme.
- Difficulty: Balanced (10 levels). Level 10 triggers a "Boar Rain" supermode.
🔐 Progression & Gating
- NAT Mode: This theme is locked by default to maintain the "collectible" feel.
- Unlocking:
- Natural: Reach Level 10 in the game.
- Backdoor: Single 1x1 pixel in the bottom-left corner of the site. Clicking it triggers a prompt. Type
nat modeto unlock.
🚢 Deployment & DevOps
- Docker: Dual-stage build (Node build -> Nginx serving).
- Registry:
registry.haumdaucher.de. - Kubernetes:
- Managed via
k8s-manifests.yaml. - Features
cert-managerfor SSL andregistry-haumdaucher-depull secret.
- Managed via
- CI/CD Logic: The
deploy.shscript handles builds, pushes, and triggers akubectl rollout restartto force deployment updates when utilizing thelatestimage tag.
📝 Ongoing Maintenance
- Assets: Static images should be placed in
public/images/to avoid bundling issues in production containers. - Style Overrides: Mobile-first approach is mandatory. Always test with
max-width: 375px.