Merge pull request #112 from markteekman/next

Next

Author: markteekman

.astro/data-store.json

@@ -1 +1 @@
-[["Map",1,2],"meta::meta",["Map",3,4],"astro-version","5.0.5"]
+[["Map",1,2],"meta::meta",["Map",3,4,5,6],"astro-version","5.1.3","astro-config-digest","{\"root\":{},\"srcDir\":{},\"publicDir\":{},\"outDir\":{},\"cacheDir\":{},\"compressHTML\":true,\"base\":\"/\",\"trailingSlash\":\"ignore\",\"output\":\"static\",\"scopedStyleStrategy\":\"attribute\",\"build\":{\"format\":\"directory\",\"client\":{},\"server\":{},\"assets\":\"_astro\",\"serverEntry\":\"entry.mjs\",\"redirects\":true,\"inlineStylesheets\":\"auto\",\"concurrency\":1},\"server\":{\"open\":false,\"host\":false,\"port\":4321,\"streaming\":true},\"redirects\":{},\"image\":{\"endpoint\":{\"route\":\"/_image\"},\"service\":{\"entrypoint\":\"astro/assets/services/sharp\",\"config\":{}},\"domains\":[],\"remotePatterns\":[]},\"devToolbar\":{\"enabled\":true},\"markdown\":{\"syntaxHighlight\":\"shiki\",\"shikiConfig\":{\"langs\":[],\"langAlias\":{},\"theme\":\"github-dark\",\"themes\":{},\"wrap\":false,\"transformers\":[]},\"remarkPlugins\":[],\"rehypePlugins\":[],\"remarkRehype\":{},\"gfm\":true,\"smartypants\":true},\"security\":{\"checkOrigin\":true},\"env\":{\"schema\":{},\"validateSecrets\":false},\"experimental\":{\"clientPrerender\":false,\"contentIntellisense\":false,\"responsiveImages\":false},\"legacy\":{\"collections\":false}}"]

.astro/settings.json

@@ -1,5 +1,5 @@
 {
 	"_variables": {
-		"lastUpdateCheck": 1733168096785
+		"lastUpdateCheck": 1736275209506
 	}
 }

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.2.3",
+  "version": "3.2.4",
   "author": "Mark Teekman",
   "homepage": "https://accessible-astro.netlify.app/",
   "scripts": {
@@ -11,14 +11,14 @@
     "preview": "astro preview"
   },
   "devDependencies": {
-    "@astrojs/mdx": "^4.0.2",
-    "@astrojs/partytown": "^2.1.2",
-    "@astrojs/tailwind": "^5.1.3",
+    "@astrojs/mdx": "^4.0.3",
+    "@astrojs/partytown": "^2.1.3",
+    "@astrojs/tailwind": "^5.1.4",
     "@iconify-json/ion": "^1.2.1",
     "@iconify-json/mdi": "^1.2.1",
     "@typescript-eslint/eslint-plugin": "^6.21.0",
     "@typescript-eslint/parser": "^6.21.0",
-    "astro": "^5.0.5",
+    "astro": "^5.1.3",
     "astro-compress": "^2.3.5",
     "astro-icon": "^1.1.4",
     "eslint": "^8.57.0",

src/layouts/DefaultLayout.astro

@@ -71,14 +71,14 @@ const {
       html,
       body {
         height: 100%;
-        overflow-x: hidden;
       }
 
       body {
         display: flex;
         flex-direction: column;
         color: var(--font-color);
         background-color: var(--background);
+        overflow-x: hidden;
 
         main {
           flex: 1 0 auto;

src/pages/accessible-components.astro

@@ -24,7 +24,7 @@ import {
       <h1>Accessible Components</h1>
       <p class="text-2xl">
         This theme has a lot of extra a11y components provided by the <a
-          href="https://github.com/markteekman/accessible-astro-components">Accessible Astro Component</a
+          href="https://github.com/markteekman/accessible-astro-components">Accessible Astro Components</a
         > NPM package to help you build accessible pages faster:
       </p>
     </div>
@@ -159,23 +159,23 @@ import {
           <Notification>
             <Icon name="ion:notifications-outline" /><p><strong>Message:</strong> This is a notification!</p>
           </Notification>
-          <Notification type="info">
+          <Notification role="status" type="info">
             <Icon name="ion:information-circle-outline" /><p>
               <strong>Info:</strong> This is a notification of type info.
             </p>
           </Notification>
-          <Notification type="success">
+          <Notification role="status" type="success">
             <Icon name="ion:checkbox-outline" /><p>
               <strong>Success:</strong> This is a notification of type success.
             </p>
           </Notification>
-          <Notification type="warning">
+          <Notification role="status" type="warning">
             <Icon name="ion:warning-outline" /><p>
               <strong>Warning:</strong> This is a notification of type warning and goes on multiple lines to see how that
               looks.
             </p>
           </Notification>
-          <Notification type="error">
+          <Notification role="alert" type="error">
             <Icon name="ion:alert-circle-outline" /><p>
               <strong>Error:</strong> This is a notification of type error.
             </p>