Merge pull request #727 from arthelokyo/modernize/astro7-refinement

Astro7 refinement

Author: prototypa

.nvmrc

@@ -0,0 +1 @@
+22

AGENTS.md

@@ -2,9 +2,9 @@
 
 ## Project Overview
 
-AstroWind is a free, open-source website template built with **Astro v6** and **Tailwind CSS v4**. It generates a fully static site optimized for performance, SEO, and accessibility.
+AstroWind is a free, open-source website template built with **Astro v7** and **Tailwind CSS v4**. It generates a fully static site optimized for performance, SEO, and accessibility.
 
-**Stack:** Astro v6 | Tailwind CSS v4 | TypeScript 5.9 | MDX | Sharp
+**Stack:** Astro v7 | Tailwind CSS v4 | TypeScript 5.9 | MDX | Sharp
 
 ## Quick Reference
 
@@ -27,11 +27,11 @@ src/
   assets/styles/tailwind.css   # Tailwind v4 config (themes, utilities, plugins)
   components/
     common/        # Shared: Image, Metadata, Analytics, ToggleTheme
-    ui/            # Primitives: Button, Headline, WidgetWrapper, ItemGrid
+    ui/            # Primitives: Button, Form, Headline, Timeline, WidgetWrapper
     widgets/       # Page sections: Hero, Features, Pricing, Header, Footer
     blog/          # Blog: SinglePost, List, Pagination, Tags
     CustomStyles.astro  # CSS variables for colors and fonts
-  content.config.ts    # Content Collections schema (Astro v6 location)
+  content.config.ts    # Content Collections schema (Astro 5+ location)
   data/post/           # Blog posts (.md, .mdx)
   layouts/             # Layout.astro, PageLayout.astro, MarkdownLayout.astro
   pages/               # File-based routing
@@ -75,7 +75,7 @@ Components use `twMerge` from `tailwind-merge` v3 for conditional class composit
 
 ## Content Collections
 
-Defined in `src/content.config.ts` using the Astro v6 Content Layer API with `glob()` loader. Posts are in `src/data/post/` as `.md` or `.mdx` files.
+Defined in `src/content.config.ts` using Astro's Content Layer API with `glob()` loader. Posts are in `src/data/post/` as `.md` or `.mdx` files.
 
 Post frontmatter: `title` (required), `publishDate`, `updateDate`, `draft`, `excerpt`, `image`, `category`, `tags`, `author`, `metadata`.
 
@@ -97,6 +97,18 @@ Post frontmatter: `title` (required), `publishDate`, `updateDate`, `draft`, `exc
 
 Hero images use `loading="eager"` and `fetchpriority="high"`.
 
+## Fonts
+
+Fonts are handled by Astro's native **Fonts API**, configured in `astro.config.ts` under the `fonts` key (provider, family, `cssVariable`) and injected via the `<Font />` component in `src/layouts/Layout.astro`. Astro self-hosts, subsets, preloads, and generates metric-adjusted fallbacks. To change the typeface, edit the `fonts` entry and point `--aw-font-*` in `CustomStyles.astro` at the new `cssVariable`.
+
+## Third-party Scripts (Partytown)
+
+`@astrojs/partytown` is wired as an **opt-in** in `astro.config.ts`, gated behind `const hasExternalScripts = false`. Set it to `true` to offload third-party scripts (e.g. Google Analytics via `analytics.vendors.googleAnalytics.partytown`) to a web worker. It is disabled by default so the base template ships no external scripts.
+
+## Content Security Policy
+
+Astro's native CSP is intentionally **not** enabled in this version: it is incompatible with `<ClientRouter />` view transitions (shipped on by default) and would break the arbitrary third-party scripts a template user typically adds. CSP is deferred to AstroWind v2, where the component model (and optional SSR) make it clean and opt-in.
+
 ## Verification Checklist
 
 After changes, always verify:

README.md

@@ -13,7 +13,7 @@
 - ✅ **Image Optimization** (using new **Astro Assets** and **Unpic** for Universal image CDN).
 - ✅ Generation of **project sitemap** based on your routes.
 - ✅ **Open Graph tags** for social media sharing.
-- ✅ **Analytics** built-in Google Analytics, and Splitbee integration.
+- ✅ **Analytics** built-in Google Analytics integration.
 
 <br>
 
@@ -124,7 +124,7 @@ Inside **AstroWind** template, you'll see the following folders and files:
 │   │   └── ...
 │   ├── utils/
 │   ├── config.yaml
-│   └── navigation.js
+│   └── navigation.ts
 ├── package.json
 ├── astro.config.ts
 └── ...
@@ -280,14 +280,6 @@ Clone this repository on your own GitHub account and deploy to PandaStack:
 
 <br>
 
-## Frequently Asked Questions
-
-- Why?
--
--
-
-<br>
-
 ## Contributing
 
 If you have any ideas, suggestions or find any bugs, feel free to open a discussion, an issue or create a pull request.

astro.config.ts

@@ -1,7 +1,7 @@
 import path from 'path';
 import { fileURLToPath } from 'url';
 
-import { defineConfig } from 'astro/config';
+import { defineConfig, fontProviders } from 'astro/config';
 
 import { unified } from '@astrojs/markdown-remark';
 
@@ -26,6 +26,28 @@ const whenExternalScripts = (items: (() => AstroIntegration) | (() => AstroInteg
 export default defineConfig({
   output: 'static',
 
+  // Prefetch links as they enter the viewport for snappier navigations
+  // (works together with <ClientRouter />, which enables prefetch by default).
+  prefetch: {
+    prefetchAll: true,
+    defaultStrategy: 'viewport',
+  },
+
+  // Native Fonts API: self-hosts + subsets + preloads Inter and generates
+  // metric-adjusted fallbacks. Injected via <Font /> in Layout.astro and
+  // consumed through the `--font-inter` CSS variable in CustomStyles.astro.
+  fonts: [
+    {
+      provider: fontProviders.fontsource(),
+      name: 'Inter',
+      cssVariable: '--font-inter',
+      weights: ['100 900'],
+      styles: ['normal'],
+      subsets: ['latin'],
+      fallbacks: ['sans-serif'],
+    },
+  ],
+
   integrations: [
     sitemap(),
     mdx(),
@@ -86,6 +108,11 @@ export default defineConfig({
     // native <Image /> (i.e. providers Unpic can't detect, like Pixabay).
     // Listed entries are authorized to be processed by Sharp.
     domains: ['cdn.pixabay.com'],
+
+    // Emit responsive styles for the native <Image layout=…> used by
+    // src/components/common/Image.astro (local images). Utility classes on
+    // each usage still win, since these styles use low-specificity selectors.
+    responsiveStyles: true,
   },
 
   markdown: {

eslint.config.js

@@ -1,4 +1,4 @@
-import astroEslintParser from 'astro-eslint-parser';
+import * as astroEslintParser from 'astro-eslint-parser';
 import eslintPluginAstro from 'eslint-plugin-astro';
 import globals from 'globals';
 import js from '@eslint/js';