31 lines
1.7 KiB
Markdown
31 lines
1.7 KiB
Markdown
## 1. Install dependencies
|
|
|
|
- [x] 1.1 Install `tailwindcss` and `@tailwindcss/vite` in `website/`
|
|
- [x] 1.2 Install `@astrojs/sitemap` in `website/`
|
|
|
|
## 2. Configure Astro
|
|
|
|
- [x] 2.1 Update `astro.config.mjs` to add `@tailwindcss/vite` as a Vite plugin and `@astrojs/sitemap` as an integration with `site: 'https://qumo.io'`
|
|
|
|
## 3. Create global.css
|
|
|
|
- [x] 3.1 Create `src/styles/global.css` with `@import "tailwindcss"`
|
|
- [x] 3.2 Add `@theme` block with brand color tokens: `--color-midnight`, `--color-snow`, `--color-brand-blue`, `--color-brand-red`
|
|
- [x] 3.3 Add `--font-archia` to the `@theme` block with system fallback stack
|
|
- [x] 3.4 Add `:root` block with `--gradient-brand: linear-gradient(135deg, #5257E4, #F71E3E)`
|
|
- [x] 3.5 Add `@font-face` declarations for all 6 Archia weights (Thin/100, Light/300, Regular/400, Medium/500, SemiBold/600, Bold/700) pointing to `../assets/fonts/archia/` woff2 files, each with `font-display: swap`
|
|
|
|
## 4. Wire global.css into Astro
|
|
|
|
- [x] 4.1 Import `../styles/global.css` in `src/pages/index.astro` (will move to BaseLayout in step 002)
|
|
|
|
## 5. Brand smoke test page
|
|
|
|
- [x] 5.1 Replace the default `src/pages/index.astro` content with a smoke test page: a color swatch grid (Midnight, Snow, Brand Blue, Brand Red, + gradient bar) and a font weight table (Thin through Bold, each row showing uppercase + sentence-case sample text)
|
|
|
|
## 6. Verify
|
|
|
|
- [x] 6.1 Run `npm run build` inside `website/` — must succeed with zero errors
|
|
- [x] 6.2 Run `npm run dev` and open the index page — verify all 4 color swatches, the gradient bar, and all 6 font weights render correctly
|
|
- [x] 6.3 Confirm `dist/sitemap-index.xml` is present in the build output
|