# Astro Tina Starter

Astro 6.1.7 + Tina CMS starter template with Tailwind CSS 4.x

## Tech Stack

- **Framework:** Astro 6.1.7
- **CMS:** Tina CMS (self-hosted)
- **Styling:** Tailwind CSS 4.x with `@tailwindcss/vite`
- **Database:** Astro DB (LibSQL)
- **State:** Nano Stores + React
- **Language:** TypeScript

## Features

- Self-hosted Tina CMS with schema-based content
- Tailwind CSS 4.x using `@tailwindcss/vite` plugin
- Astro DB for consent logging (PDPA compliant)
- Nano Stores for client-side state management
- Thai language support foundation
- Docker-ready deployment

## Quick Start

```bash
# Install dependencies
npm install

# Start development
npm run dev

# Build for production
npm run build
```

## Tina CMS Access

During development, access Tina CMS at:
- http://localhost:4321/admin

For production, you'll need a TINA_TOKEN environment variable.

## Project Structure

```
astro-tina-starter/
├── .tina/
│   ├── config.ts      # Tina CMS configuration
│   └── schema.ts       # Content schema definitions
├── db/
│   ├── config.ts       # Astro DB schema (consent logs)
│   └── seed.ts         # Database seed script
├── src/
│   ├── styles/
│   │   └── global.css  # Tailwind v4 styles
│   ├── layouts/
│   │   └── Layout.astro
│   ├── pages/
│   │   └── index.astro
│   ├── components/
│   │   └── Header.astro
│   └── content/
│       └── config.ts   # Tina content collections
├── Dockerfile
└── package.json
```

## Tailwind CSS 4.x

This template uses Tailwind CSS 4.x with the `@tailwindcss/vite` plugin.
The configuration is done via CSS `@theme` block in `src/styles/global.css`.

```css
@import "tailwindcss";

@theme {
  --color-primary: #1a1a1a;
  --color-accent: #3b82f6;
}
```

## Astro DB

The template includes a consent-log table for PDPA compliance:

```ts
// db/config.ts
export const ConsentLog = defineTable({
  columns: {
    action: text(),
    purpose: text(),
    analytics: boolean(),
    marketing: boolean(),
    functional: boolean(),
    userAgent: text(),
    ip: text(),
    timestamp: text(),
  },
})
```

## License

MIT