feat: migrate website-creator from Next.js+Payload to Astro+Tina CMS
Major changes: - Replace Payload CMS with Tina CMS (self-hosted) - Add Astro DB for consent logging (PDPA compliant) - Update Tailwind v3 to v4 (@tailwindcss/vite plugin) - Add astro-tina-starter template - Rewrite consent template for Astro (ConsentBanner.astro, Astro DB, Nano Stores) - Add install-tina-backend.sh for self-hosted Tina per customer - Rename convert-astro.sh to migrate-tina.sh - Add AGENTS.md template for generated websites - Delete all Payload/Next.js files Technical updates: - Astro DB using defineDb with eq operators for queries - Tailwind v4 with @theme block - Tina CMS local development mode - Proper Astro API routes for consent Research-verified with official documentation (April 2026)
This commit is contained in:
@@ -0,0 +1,27 @@
|
||||
---
|
||||
interface Props {
|
||||
siteName?: string
|
||||
}
|
||||
|
||||
const { siteName = "Astro Tina Starter" } = Astro.props
|
||||
---
|
||||
|
||||
<header class="sticky top-0 z-50 bg-white/80 backdrop-blur-md border-b border-primary-200">
|
||||
<nav class="max-w-6xl mx-auto px-6 h-16 flex items-center justify-between">
|
||||
<a href="/" class="font-bold text-xl text-primary-900 hover:text-accent-600 transition-colors">
|
||||
{siteName}
|
||||
</a>
|
||||
|
||||
<div class="flex items-center gap-6">
|
||||
<a href="/" class="text-primary-600 hover:text-primary-900 transition-colors">
|
||||
Home
|
||||
</a>
|
||||
<a href="/blog" class="text-primary-600 hover:text-primary-900 transition-colors">
|
||||
Blog
|
||||
</a>
|
||||
<a href="/about" class="text-primary-600 hover:text-primary-900 transition-colors">
|
||||
About
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
@@ -0,0 +1,34 @@
|
||||
import { defineCollection, z } from "astro:content"
|
||||
|
||||
const postCollection = defineCollection({
|
||||
type: "content",
|
||||
schema: z.object({
|
||||
title: z.string(),
|
||||
description: z.string().optional(),
|
||||
publishedAt: z.date().optional(),
|
||||
category: z.enum(["news", "blog", "tutorial"]).optional(),
|
||||
}),
|
||||
})
|
||||
|
||||
const pageCollection = defineCollection({
|
||||
type: "content",
|
||||
schema: z.object({
|
||||
title: z.string(),
|
||||
description: z.string().optional(),
|
||||
}),
|
||||
})
|
||||
|
||||
const settingsCollection = defineCollection({
|
||||
type: "data",
|
||||
schema: z.object({
|
||||
siteName: z.string(),
|
||||
siteDescription: z.string(),
|
||||
language: z.enum(["th", "en", "th-en"]).default("th"),
|
||||
}),
|
||||
})
|
||||
|
||||
export const collections = {
|
||||
posts: postCollection,
|
||||
pages: pageCollection,
|
||||
settings: settingsCollection,
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
---
|
||||
title: Welcome to Astro Tina Starter
|
||||
description: A modern starter template with Astro 6, Tina CMS, and Thai language support.
|
||||
publishedAt: 2026-04-17
|
||||
category: blog
|
||||
---
|
||||
|
||||
Welcome to our new blog built with Astro and Tina CMS!
|
||||
|
||||
## Features
|
||||
|
||||
- **Tina CMS** - Self-hosted content management
|
||||
- **Tailwind CSS v4** - Latest styling with @tailwindcss/vite
|
||||
- **Astro DB** - Built-in database support
|
||||
- **Thai Support** - Ready for Thai language content
|
||||
|
||||
Stay tuned for more updates!
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"siteName": "Astro Tina Starter",
|
||||
"siteDescription": "Astro 6 + Tina CMS starter template with Thai language support",
|
||||
"language": "th"
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
---
|
||||
import "@/styles/global.css"
|
||||
|
||||
interface Props {
|
||||
title?: string
|
||||
description?: string
|
||||
}
|
||||
|
||||
const {
|
||||
title = "Astro Tina Starter",
|
||||
description = "Astro 6 + Tina CMS starter template",
|
||||
} = Astro.props
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="th">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="description" content={description} />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body class="bg-primary-50 text-primary-900 min-h-screen">
|
||||
<slot />
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,47 @@
|
||||
---
|
||||
import Layout from "@/layouts/Layout.astro"
|
||||
---
|
||||
|
||||
<Layout>
|
||||
<main>
|
||||
<section class="px-6 py-24 max-w-4xl mx-auto">
|
||||
<h1 class="text-4xl md:text-5xl font-bold tracking-tight mb-6">
|
||||
Welcome to Astro Tina Starter
|
||||
</h1>
|
||||
<p class="text-lg text-primary-600 mb-8 max-w-2xl">
|
||||
A modern starter template with Astro 6, Tina CMS, Tailwind CSS 4.x,
|
||||
and Thai language support.
|
||||
</p>
|
||||
|
||||
<div class="grid gap-6 md:grid-cols-2">
|
||||
<div class="p-6 bg-white rounded-xl border border-primary-200">
|
||||
<h2 class="text-xl font-semibold mb-3">Tina CMS</h2>
|
||||
<p class="text-primary-600">
|
||||
Self-hosted content management with schema-based editing.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="p-6 bg-white rounded-xl border border-primary-200">
|
||||
<h2 class="text-xl font-semibold mb-3">Tailwind v4</h2>
|
||||
<p class="text-primary-600">
|
||||
Latest Tailwind CSS with @tailwindcss/vite plugin.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="p-6 bg-white rounded-xl border border-primary-200">
|
||||
<h2 class="text-xl font-semibold mb-3">Astro DB</h2>
|
||||
<p class="text-primary-600">
|
||||
Built-in database for consent logging and more.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="p-6 bg-white rounded-xl border border-primary-200">
|
||||
<h2 class="text-xl font-semibold mb-3">Thai Support</h2>
|
||||
<p class="text-primary-600">
|
||||
Ready for Thai language content with Noto Sans Thai.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</Layout>
|
||||
@@ -0,0 +1,57 @@
|
||||
@import "tailwindcss";
|
||||
@plugin "@tailwindcss/typography";
|
||||
|
||||
@theme {
|
||||
--font-sans: "Inter", "Noto Sans Thai", system-ui, sans-serif;
|
||||
--font-serif: "Merriweather", Georgia, serif;
|
||||
|
||||
--color-primary-50: #f8fafc;
|
||||
--color-primary-100: #f1f5f9;
|
||||
--color-primary-200: #e2e8f0;
|
||||
--color-primary-300: #cbd5e1;
|
||||
--color-primary-400: #94a3b8;
|
||||
--color-primary-500: #64748b;
|
||||
--color-primary-600: #475569;
|
||||
--color-primary-700: #334155;
|
||||
--color-primary-800: #1e293b;
|
||||
--color-primary-900: #0f172a;
|
||||
--color-primary-950: #020617;
|
||||
|
||||
--color-accent-50: #eff6ff;
|
||||
--color-accent-100: #dbeafe;
|
||||
--color-accent-200: #bfdbfe;
|
||||
--color-accent-300: #93c5fd;
|
||||
--color-accent-400: #60a5fa;
|
||||
--color-accent-500: #3b82f6;
|
||||
--color-accent-600: #2563eb;
|
||||
--color-accent-700: #1d4ed8;
|
||||
--color-accent-800: #1e40af;
|
||||
--color-accent-900: #1e3a8a;
|
||||
|
||||
--color-success-500: #22c55e;
|
||||
--color-warning-500: #f59e0b;
|
||||
--color-error-500: #ef4444;
|
||||
|
||||
--radius-sm: 0.25rem;
|
||||
--radius-md: 0.5rem;
|
||||
--radius-lg: 0.75rem;
|
||||
--radius-xl: 1rem;
|
||||
--radius-2xl: 1.5rem;
|
||||
--radius-full: 9999px;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-sans);
|
||||
line-height: 1.6;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background-color: var(--color-accent-200);
|
||||
color: var(--color-primary-900);
|
||||
}
|
||||
Reference in New Issue
Block a user