Merge branch 'release/3.5.0'

.ddev/config.yaml

@@ -3,21 +3,20 @@ type: craftcms
 docroot: public
 php_version: '8.2'
 webserver_type: apache-fpm
-router_http_port: '80'
-router_https_port: '443'
 xdebug_enabled: false
+project_tld: local.statik.be
 additional_hostnames: []
-additional_fqdns: ['basecraft.local.statik.be']
+additional_fqdns: []
 database:
   type: mysql
   version: '5.7'
-nfs_mount_enabled: false
-mutagen_enabled: false
 use_dns_when_possible: true
 composer_version: '2'
 web_environment: []
-nodejs_version: '16'
-# Key features of ddev's config.yaml:
+upload_dirs:
+  - files
+  - ../node_modules
+# Key features of DDEV's config.yaml:
 
 # name: <projectname> # Name of the project, automatically provides
 #   http://projectname.ddev.site and https://projectname.ddev.site
@@ -26,34 +25,34 @@ nodejs_version: '16'
 
 # docroot: <relative_path> # Relative path to the directory containing index.php.
 
-# php_version: "7.4"  # PHP version to use, "5.6", "7.0", "7.1", "7.2", "7.3", "7.4", "8.0", "8.1", "8.2"
+# php_version: "8.1"  # PHP version to use, "5.6", "7.0", "7.1", "7.2", "7.3", "7.4", "8.0", "8.1", "8.2", "8.3"
 
 # You can explicitly specify the webimage but this
-# is not recommended, as the images are often closely tied to ddev's' behavior,
+# is not recommended, as the images are often closely tied to DDEV's' behavior,
 # so this can break upgrades.
 
 # webimage: <docker_image>  # nginx/php docker image.
 
 # database:
-#   type: <dbtype> # mysql, mariadb
-#   version: <version> # database version, like "10.3" or "8.0"
-# Note that mariadb_version or mysql_version from v1.18 and earlier
-# will automatically be converted to this notation with just a "ddev config --auto"
+#   type: <dbtype> # mysql, mariadb, postgres
+#   version: <version> # database version, like "10.4" or "8.0"
+#   MariaDB versions can be 5.5-10.8 and 10.11, MySQL versions can be 5.5-8.0
+#   PostgreSQL versions can be 9-16.
 
-# router_http_port: <port>  # Port to be used for http (defaults to port 80)
-# router_https_port: <port> # Port for https (defaults to 443)
+# router_http_port: <port>  # Port to be used for http (defaults to global configuration, usually 80)
+# router_https_port: <port> # Port for https (defaults to global configuration, usually 443)
 
-# xdebug_enabled: false  # Set to true to enable xdebug and "ddev start" or "ddev restart"
+# xdebug_enabled: false  # Set to true to enable Xdebug and "ddev start" or "ddev restart"
 # Note that for most people the commands
-# "ddev xdebug" to enable xdebug and "ddev xdebug off" to disable it work better,
-# as leaving xdebug enabled all the time is a big performance hit.
+# "ddev xdebug" to enable Xdebug and "ddev xdebug off" to disable it work better,
+# as leaving Xdebug enabled all the time is a big performance hit.
 
-# xhprof_enabled: false  # Set to true to enable xhprof and "ddev start" or "ddev restart"
+# xhprof_enabled: false  # Set to true to enable Xhprof and "ddev start" or "ddev restart"
 # Note that for most people the commands
-# "ddev xhprof" to enable xhprof and "ddev xhprof off" to disable it work better,
-# as leaving xhprof enabled all the time is a big performance hit.
+# "ddev xhprof" to enable Xhprof and "ddev xhprof off" to disable it work better,
+# as leaving Xhprof enabled all the time is a big performance hit.
 
-# webserver_type: nginx-fpm  # or apache-fpm
+# webserver_type: nginx-fpm, apache-fpm, or nginx-gunicorn
 
 # timezone: Europe/Berlin
 # This is the timezone used in the containers and by PHP;
@@ -62,7 +61,7 @@ nodejs_version: '16'
 # For example Europe/Dublin or MST7MDT
 
 # composer_root: <relative_path>
-# Relative path to the composer root directory from the project root. This is
+# Relative path to the Composer root directory from the project root. This is
 # the directory which contains the composer.json and where all Composer related
 # commands are executed.
 
@@ -77,10 +76,12 @@ nodejs_version: '16'
 # Alternatively, an explicit Composer version may be specified, for example "2.2.18".
 # To reinstall Composer after the image was built, run "ddev debug refresh".
 
-# nodejs_version: "16"
-# change from the default system Node.js version to another supported version, like 12, 14, 17, 18.
+# nodejs_version: "18"
+# change from the default system Node.js version to another supported version, like 16, 18, 20.
 # Note that you can use 'ddev nvm' or nvm inside the web container to provide nearly any
 # Node.js version, including v6, etc.
+# You only need to configure this if you are not using nvm and you want to use a major
+# version that is not the default.
 
 # additional_hostnames:
 #  - somename
@@ -94,10 +95,20 @@ nodejs_version: '16'
 # would provide http and https URLs for "example.com" and "sub1.example.com"
 # Please take care with this because it can cause great confusion.
 
-# upload_dir: custom/upload/dir
-# would set the destination path for ddev import-files to <docroot>/custom/upload/dir
-# When mutagen is enabled this path is bind-mounted so that all the files
-# in the upload_dir don't have to be synced into mutagen
+# would set the destination paths for ddev import-files to <docroot>/custom/upload/dir
+# When Mutagen is enabled this path is bind-mounted so that all the files
+# in the upload_dirs don't have to be synced into Mutagen.
+
+# disable_upload_dirs_warning: false
+# If true, turns off the normal warning that says
+# "You have Mutagen enabled and your 'php' project type doesn't have upload_dirs set"
+
+# ddev_version_constraint: ""
+# Example:
+# ddev_version_constraint: ">= 1.22.4"
+# This will enforce that the running ddev version is within this constraint.
+# See https://github.com/Masterminds/semver#checking-version-constraints for
+# supported constraint formats
 
 # working_dir:
 #   web: /var/www/html
@@ -106,19 +117,24 @@ nodejs_version: '16'
 # These values specify the destination directory for ddev ssh and the
 # directory in which commands passed into ddev exec are run.
 
-# omit_containers: [db, dba, ddev-ssh-agent]
+# omit_containers: [db, ddev-ssh-agent]
 # Currently only these containers are supported. Some containers can also be
 # omitted globally in the ~/.ddev/global_config.yaml. Note that if you omit
-# the "db" container, several standard features of ddev that access the
+# the "db" container, several standard features of DDEV that access the
 # database container will be unusable. In the global configuration it is also
 # possible to omit ddev-router, but not here.
 
-# nfs_mount_enabled: false
-# Great performance improvement but requires host configuration first.
+# performance_mode: "global"
+# DDEV offers performance optimization strategies to improve the filesystem
+# performance depending on your host system. Should be configured globally.
+#
+# If set, will override the global config. Possible values are:
+#   - "global":  uses the value from the global config.
+#   - "none":    disables performance optimization for this project.
+#   - "mutagen": enables Mutagen for this project.
+#   - "nfs":     enables NFS for this project.
+#
 # See https://ddev.readthedocs.io/en/latest/users/install/performance/#nfs
-
-# mutagen_enabled: false
-# Performance improvement using mutagen asynchronous updates.
 # See https://ddev.readthedocs.io/en/latest/users/install/performance/#mutagen
 
 # fail_on_hook_fail: False
@@ -140,20 +156,12 @@ nodejs_version: '16'
 # The host port binding for the ddev-dbserver can be explicitly specified. It is dynamic
 # unless explicitly specified.
 
-# phpmyadmin_port: "8036"
-# phpmyadmin_https_port: "8037"
-# The PHPMyAdmin ports can be changed from the default 8036 and 8037
-
-# host_phpmyadmin_port: "8036"
-# The phpmyadmin (dba) port is not normally bound on the host at all, instead being routed
-# through ddev-router, but it can be specified and bound.
-
-# mailhog_port: "8025"
-# mailhog_https_port: "8026"
-# The MailHog ports can be changed from the default 8025 and 8026
+# mailpit_http_port: "8025"
+# mailpit_https_port: "8026"
+# The Mailpit ports can be changed from the default 8025 and 8026
 
-# host_mailhog_port: "8025"
-# The mailhog port is not normally bound on the host at all, instead being routed
+# host_mailpit_port: "8025"
+# The mailpit port is not normally bound on the host at all, instead being routed
 # through ddev-router, but it can be bound directly to localhost if specified here.
 
 # webimage_extra_packages: [php7.4-tidy, php-bcmath]
@@ -168,18 +176,17 @@ nodejs_version: '16'
 # instead of editing /etc/hosts
 # Defaults to true
 
-# project_tld: ddev.site
 # The top-level domain used for project URLs
 # The default "ddev.site" allows DNS lookup via a wildcard
 # If you prefer you can change this to "ddev.local" to preserve
 # pre-v1.9 behavior.
 
 # ngrok_args: --basic-auth username:pass1234
 # Provide extra flags to the "ngrok http" command, see
-# https://ngrok.com/docs#http or run "ngrok http -h"
+# https://ngrok.com/docs/ngrok-agent/config or run "ngrok http -h"
 
 # disable_settings_management: false
-# If true, ddev will not create CMS-specific settings files like
+# If true, DDEV will not create CMS-specific settings files like
 # Drupal's settings.php/settings.ddev.php or TYPO3's AdditionalConfiguration.php
 # In this case the user must provide all such settings.
 
@@ -189,19 +196,19 @@ nodejs_version: '16'
 # - SOMEOTHERENV=someothervalue
 
 # no_project_mount: false
-# (Experimental) If true, ddev will not mount the project into the web container;
+# (Experimental) If true, DDEV will not mount the project into the web container;
 # the user is responsible for mounting it manually or via a script.
 # This is to enable experimentation with alternate file mounting strategies.
 # For advanced users only!
 
 # bind_all_interfaces: false
 # If true, host ports will be bound on all network interfaces,
-# not just the localhost interface. This means that ports
+# not the localhost interface only. This means that ports
 # will be available on the local network if the host firewall
 # allows it.
 
 # default_container_timeout: 120
-# The default time that ddev waits for all containers to become ready can be increased from
+# The default time that DDEV waits for all containers to become ready can be increased from
 # the default 120. This helps in importing huge databases, for example.
 
 #web_extra_exposed_ports:
@@ -214,12 +221,16 @@ nodejs_version: '16'
 #  https_port: 4000
 #  http_port: 3999
 # Allows a set of extra ports to be exposed via ddev-router
+# Fill in all three fields even if you don’t intend to use the https_port!
+# If you don’t add https_port, then it defaults to 0 and ddev-router will fail to start.
+#
 # The port behavior on the ddev-webserver must be arranged separately, for example
 # using web_extra_daemons.
 # For example, with a web app on port 3000 inside the container, this config would
 # expose that web app on https://<project>.ddev.site:9999 and http://<project>.ddev.site:9998
 # web_extra_exposed_ports:
-#  - container_port: 3000
+#  - name: myapp
+#    container_port: 3000
 #    http_port: 9998
 #    https_port: 9999
 
@@ -234,10 +245,10 @@ nodejs_version: '16'
 # override_config: false
 # By default, config.*.yaml files are *merged* into the configuration
 # But this means that some things can't be overridden
-# For example, if you have 'nfs_mount_enabled: true'' you can't override it with a merge
+# For example, if you have 'use_dns_when_possible: true'' you can't override it with a merge
 # and you can't erase existing hooks or all environment variables.
 # However, with "override_config: true" in a particular config.*.yaml file,
-# 'nfs_mount_enabled: false' can override the existing values, and
+# 'use_dns_when_possible: false' can override the existing values, and
 # hooks:
 #   post-start: []
 # or
@@ -247,8 +258,8 @@ nodejs_version: '16'
 # can have their intended affect. 'override_config' affects only behavior of the
 # config.*.yaml file it exists in.
 
-# Many ddev commands can be extended to run tasks before or after the
-# ddev command is executed, for example "post-start", "post-import-db",
+# Many DDEV commands can be extended to run tasks before or after the
+# DDEV command is executed, for example "post-start", "post-import-db",
 # "pre-composer", "post-composer"
 # See https://ddev.readthedocs.io/en/stable/users/extend/custom-commands/ for more
 # information on the commands that can be extended and the tasks you can define

.nvmrc

@@ -1 +1 @@
-v16.15.1
+v18.16.0

.pa11yci

@@ -0,0 +1,19 @@
+{
+  "defaults": {
+    "standard": "WCAG2AA",
+    "viewport": {
+      "width": 1280,
+      "height": 1024
+    },
+    "ignore": [
+      "notice",
+      "warning"
+    ],
+    "chromeLaunchConfig": {
+      "ignoreHTTPSErrors": true,
+      "args": [
+        "--no-sandbox"
+      ]
+    }
+  }
+}

README.MD

@@ -6,6 +6,8 @@ This a scaffolding package for Craft CMS, by [Statik.be](https://www.statik.be).
 
 We assume a couple of things
 
+- We use [Ddev](https://ddev.com/) as our local development environment.
+
 - We use [Postmark](https://postmarkapp.com/) for email delivery.
 
 - We use [TailwindCSS](https://tailwindcss.com/) for our frontend build.
@@ -14,6 +16,8 @@ We assume a couple of things
 
 ### 🛠 Usage
 
+Before beginning make sure you have [Ddev](https://ddev.com/) installed and your docker-engine is running. Otherwise the install process will fail on initialization.
+
 Use the following command to set up a new project:
 
 ```bash
@@ -59,7 +63,7 @@ Are you ready to begin the setup? (yes|no) [yes]
 - Database name
 - Database table prefix
 
-➡️ If the database is connected Craft can be installed
+➡️ Using the above defaults suggested by craft, will allow you to connect to your Ddev database and the installation will continue.
 
 - Install Craft now? [yes]
 - Email
@@ -77,7 +81,7 @@ Now we're ready to initiate the Statik set-up:
 
 cd PATH
 
-./craft statik/setup
+ddev craft statik/setup
 
 ```
 
@@ -113,15 +117,16 @@ If you continue the next sections will be removed: _confirmAccount, editPassword
 
 ### 🎨 Frontend Setup
 
-We use tailwindscss and webpack
+We use tailwindscss and vite.js
 
-- `webpack.config.js`
+- `vite.config.js`
 - `tailwind.config.js`
 
 Getting started
 
 ```bash
 
+[optional] nvm install
 yarn install
 
 ```
@@ -156,9 +161,31 @@ yarn favicon
 ```
 
 **Icons**
+Icon go in the folder `tailoff/icons`
 
 ---
 
+### 🧪 Testing
+
+There are two tests added to the frontend stack.
+An A11y tester that uses pa11y-ci under the hood.
+And a html tester that we wrote ourself, inspired by the pa11y code, that uses html-validate under the hood.
+You can call them by using these commands:
+
+```
+$ yarn test-a11y
+$ yarn test-html
+```
+
+They both use the BASE_URL variable from the .env file to get the craft sitemap. This sitemap gets parsed to get a list of all url's in the site. And the tests are then performed on these URL's.
+
+**Attention**
+To get the tester running on your local system. Run the following command in your terminal
+
+```
+export NODE_EXTRA_CA_CERTS="$(mkcert -CAROOT)/rootCA.pem"
+```
+
 ### ⚙️ Development
 
 To work on this repo you can clone it like you would a regular project: