A multilingual website built with Astro and Directus, deployed on Cloudflare Pages.
- Static Site Generation: The site is pre-rendered at build-time and served as a static web site for fast loading times and SEO performance.
- Headless CMS: Content management through Directus configured from scratch.
- Astro Content Collections: Type-safe schemas that fetch data from Directus to dynamically generate pages.
- Astro Image: Optimized image handling with automatic format conversion and responsive images.
- View Transitions: Smooth navbar icon animations during page navigation using Astro's View Transitions API.
- Multilingual: Support for English and Spanish.
- Dark & Light Modes: Theme switching with system preference detection and user preference persistence.
- Fluid Typography and Space: Design tokens generated using Utopia for scalable and responsive typography and spacing.
- Responsive Design: Mobile-first and fluid CSS styling.
- Framework: Astro 5
- Language: TypeScript
- CMS: Directus
- Styling: SCSS
- Markdown: Marked with hljs syntax highlighting
- Deployment: Cloudflare Pages
- Color Palette: Happy Hues Palette #17 by Mackenzie Child
- SVG Illustrations: Modified from DrawKit (camera and avatar SVGs by me)
- Icons: Lets Icons by Leonid Tsvetkov - Licensed under CC BY 4.0