Merge pull request #24 from markteekman/develop

Develop

README.md

@@ -187,11 +187,12 @@ If you need an exception on your font-size for a specific reason you can use siz
 
 ## Helping out
 
-If you find that something isn't working right then I'm also happy to hear it to improve this starter! Let me know by either:
+If you find that something isn't working right then I'm always happy to hear it to improve this starter! You can contribute in many ways and forms. Let me know by either:
 
 1. [Filing an issue](https://github.com/markteekman/accessible-astro-starter/issues)
 2. [Submitting a pull request](https://github.com/markteekman/accessible-astro-starter/pulls)
 3. [Starting a discussion](https://github.com/markteekman/accessible-astro-starter/discussions)
+4. [Buying me a coffee!](https://www.buymeacoffee.com/markteekman) This keeps the servers up and running 😊
 
 ## Thank you!
 

astro.config.mjs

@@ -1,16 +1,10 @@
-export default {
-  // projectRoot: '.',     // Where to resolve all URLs relative to. Useful if you have a monorepo project.
-  // pages: './src/pages', // Path to Astro components, pages, and data
-  // dist: './dist',       // When running `astro build`, path to final static output
-  // public: './public',   // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that don’t need processing.
-  buildOptions: {
-    // site: 'http://example.com',           // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs.
-    sitemap: true,         // Generate sitemap (set to "false" to disable)
-  },
-  devOptions: {
-    // hostname: 'localhost',  // The hostname to run the dev server on. 
-    // port: 3000,             // The port to run the dev server on.
-    // tailwindConfig: '',     // Path to tailwind.config.js if used, e.g. './tailwind.config.js'
-  },
-  renderers: [],
-};
+import { defineConfig } from 'astro/config'
+
+// https://astro.build/config
+export default defineConfig({
+  vite: {
+    ssr: {
+      external: ['svgo']
+    }
+  }
+})

package.json

@@ -1,13 +1,21 @@
 {
   "name": "accessible-astro-starter",
-  "version": "1.2.3",
-  "private": true,
+  "description": "An Accessible Starter Theme for Astro including accessiblity features and more.",
+  "version": "1.2.4",
+  "author": "Mark Teekman",
+  "homepage": "https://accessible-astro.dev",
   "scripts": {
+    "dev": "astro dev",
     "start": "astro dev",
-    "build": "astro build"
+    "build": "astro build",
+    "preview": "astro preview"
+  },
+  "dependencies": {
+    "accessible-astro-components": "^1.4.5",
+    "astro-icon": "^0.7.1"
   },
   "devDependencies": {
-    "astro": "^0.23.2",
+    "astro": "^1.0.0-beta.5",
     "autoprefixer": "^10.4.0",
     "sass": "^1.49.9",
     "stylelint": "^13.13.1",

src/pages/about.astro

@@ -1,11 +1,13 @@
 ---
 import DefaultLayout from '../layouts/DefaultLayout.astro'
+import DarkMode from '../components/DarkMode.astro'
 ---
 
 <DefaultLayout title="About">
   <section class="margin-48">
     <div class="container">
-      <h1>About page</h1>
+      <h1>About page</h1><br>
+      <DarkMode client:load />
     </div>
   </section>
   <section class="margin-24">

src/pages/contact.astro

@@ -1,11 +1,13 @@
 ---
 import DefaultLayout from '../layouts/DefaultLayout.astro'
+import DarkMode from '../components/DarkMode.astro'
 ---
 
 <DefaultLayout title="Contact">
   <section class="margin-48">
     <div class="container">
-      <h1>Contact page</h1>
+      <h1>Contact page</h1><br>
+      <DarkMode client:load />
     </div>
   </section>
   <section class="margin-24">