Update Astro to 4.0 and update dependencies

README.md

@@ -8,6 +8,7 @@ Accessible Astro Starter is a ready to use, SEO and a11y friendly blogging theme
 
 ## ♿ (Accessibility) Features
 
+- Astro 4.0
 - Tailwind CSS support
 - Prettier integration with `prettier-plugin-astro` and `prettier-plugin-tailwind`
 - ESLint integration with strict accessibility settings for `eslint-plugin-jsx-a11y`
@@ -30,6 +31,7 @@ Accessible Astro Starter is a ready to use, SEO and a11y friendly blogging theme
 - `prefers-reduced-motion` disables animations for users that have this preference turned on
 - Ships with many components such as Accordions, Breadcrumbs, Modals, Pagination [and many more](https://accessible-astro.dev/accessible-components)
 - A collection of utility classes such as breakpoints, button classes, font settings, resets and outlines in `src/assets/scss/base`
+- View Transitions (⚠️ see [astro-docs](https://docs.astro.build/en/guides/view-transitions/#accessibility) for accessibility considerations)
 
 ## 🚀 Getting started
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "accessible-astro-starter",
   "description": "An Accessible Starter Theme for Astro including several accessibility features and tools to help you build faster.",
-  "version": "3.0.3",
+  "version": "3.1.0",
   "author": "Mark Teekman",
   "homepage": "https://accessible-astro.netlify.app/",
   "scripts": {
@@ -11,13 +11,13 @@
     "preview": "astro preview"
   },
   "devDependencies": {
-    "@astrojs/mdx": "^1.0.2",
-    "@astrojs/partytown": "^2.0.0",
-    "@astrojs/tailwind": "^5.0.0",
+    "@astrojs/mdx": "^2.0.2",
+    "@astrojs/partytown": "^2.0.2",
+    "@astrojs/tailwind": "^5.0.4",
     "@typescript-eslint/eslint-plugin": "^5.50.0",
     "@typescript-eslint/parser": "^5.50.0",
-    "accessible-astro-components": "^2.3.0",
-    "astro": "^3.0.10",
+    "accessible-astro-components": "^2.3.3",
+    "astro": "^4.0.7",
     "astro-compress": "^2.0.6",
     "astro-icon": "^0.7.3",
     "eslint": "^8.33.0",

src/pages/index.astro

@@ -59,11 +59,11 @@ import ContentMedia from '../components/ContentMedia.astro'
       reaching WCAG AA compliance.
     </p>
   </ContentMedia>
-  <section class="mt-64 mb-32">
+  <section class="mb-32 mt-64">
     <div class="container">
       <h2 class="mb-16 text-6xl">Counters</h2>
       <div class="grid grid-cols-1 gap-12 sm:grid-cols-2 md:grid-cols-4">
-        <Counter count="130" title="Stars" sub="On GitHub" />
+        <Counter count="520" title="Stars" sub="On GitHub" />
         <Counter count="17" title="Accessible" sub="Components" />
         <Counter count="500" title="Commits" sub="Merged" />
         <Counter count="18+" title="Months" sub="Since launch" />