Merge branch 'main' into section-loader

.eslintrc.js

@@ -11,11 +11,8 @@ module.exports = {
     requireConfigFile: false,
   },
   rules: {
-    // allow reassigning param
-    'no-param-reassign': [2, { props: false }],
-    'linebreak-style': ['error', 'unix'],
-    'import/extensions': ['error', {
-      js: 'always',
-    }],
+    'import/extensions': ['error', { js: 'always' }], // require js file extensions in imports
+    'linebreak-style': ['error', 'unix'], // enforce unix linebreaks
+    'no-param-reassign': [2, { props: false }], // allow modifying properties of param
   },
 };

.github/workflows/cleanup-on-create.yaml

@@ -6,30 +6,26 @@ on:
   create:
     branches:
       - main
+  workflow_dispatch:
 jobs:
   cleanup:
     runs-on: ubuntu-latest
     permissions:
       contents: write
       actions: write
     # only run if commit message is "Initial commit" on main branch
-    if: ${{ github.ref == 'refs/heads/main' && github.event.head_commit.message == 'Initial commit' }}
+    if: ${{ github.event_name == 'workflow_dispatch' || ( github.ref == 'refs/heads/main' && !(contains(github.event, 'head_commit') || github.event.head_commit.message == 'Initial commit' )) }}
     steps:
       - name: Checkout
         uses: actions/checkout@v4
-      - name: Use Node.js 18
+      - name: Use Node.js 20
         uses: actions/setup-node@v4
         with:
-          node-version: 18
-      - name: Uninstall dependencies
-        run: |
-          npm uninstall --save-dev semantic-release @semantic-release/git @semantic-release/changelog @semantic-release/exec
+          node-version: 20
       - name: Remove Helper Files
         run: | 
           rm -rf \
             .github/workflows/cleanup-on-create.yaml \
-            .github/workflows/semantic-release.yaml \
-            .releaserc.cjs \
             CHANGELOG.md
 
       - name: Initialize README
@@ -47,7 +43,7 @@ jobs:
       - name: Commit changes
         run: |
           git config --local user.email "helix@adobe.com"
-          git config --local user.name "Helix Bot"
+          git config --local user.name "AEM Bot"
           git add .
           git commit -m "chore: cleanup repository template"
           git push

.github/workflows/main.yaml

@@ -0,0 +1,14 @@
+name: Build
+on: [push]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - name: Use Node.js 20
+      uses: actions/setup-node@v4
+      with:
+        node-version: 20
+    - run: npm ci
+    - run: npm run lint

.stylelintrc.json

@@ -1,3 +1,3 @@
 {
   "extends": ["stylelint-config-standard"]
-}
+}

404.html

@@ -11,8 +11,6 @@
   <meta property="og:title" content="Page not found">
   <script src="/scripts/scripts.js" type="module" crossorigin="use-credentials"></script>
   <script type="module">
-    import { sampleRUM } from '/scripts/aem.js';
-
     window.addEventListener('load', () => {
       if (document.referrer) {
         const { origin, pathname } = new URL(document.referrer);
@@ -26,9 +24,12 @@
           btnContainer.append(backBtn);
         }
       }
-      sampleRUM('404', { source: document.referrer, target: window.location.href });
     });
   </script>
+  <script type="module">
+    import { sampleRUM } from '/scripts/aem.js';
+    sampleRUM('404', { source: document.referrer });
+  </script>
   <link rel="stylesheet" href="/styles/styles.css">
   <style>
     main.error {

CONTRIBUTING.md

@@ -71,4 +71,3 @@ One of the maintainers will look at the pull request within one week. Feedback o
 The project's committers will release to the [Adobe organization on npmjs.org](https://www.npmjs.com/org/adobe).
 Please contact the [Adobe Open Source Advisory Board](https://git.corp.adobe.com/OpenSourceAdvisoryBoard/discuss/issues) to get access to the npmjs organization.
 
-The release process is fully automated using `semantic-release`, increasing the version numbers, etc. based on the contents of the commit messages found.

README.md

@@ -21,6 +21,6 @@ npm run lint
 
 1. Create a new repository based on the `aem-boilerplate` template and add a mountpoint in the `fstab.yaml`
 1. Add the [AEM Code Sync GitHub App](https://github.com/apps/aem-code-sync) to the repository
-1. Install the [AEM CLI](https://github.com/adobe/aem-cli): `npm install -g @adobe/aem-cli`
+1. Install the [AEM CLI](https://github.com/adobe/helix-cli): `npm install -g @adobe/aem-cli`
 1. Start AEM Proxy: `aem up` (opens your browser at `http://localhost:3000`)
 1. Open the `{repo}` directory in your favorite IDE and start coding :)

blocks/cards/cards.css

@@ -3,13 +3,13 @@
   margin: 0;
   padding: 0;
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  grid-template-columns: repeat(auto-fill, minmax(278px, 1fr));
   grid-gap: 16px;
 }
 
 .cards > ul > li {
-  border: 1px solid var(--highlight-background-color);
-  background-color: var(--background-color)
+  border: 1px solid var(--dark-color);
+  background-color: var(--background-color);
 }
 
 .cards .cards-card-body {

blocks/footer/footer.css

@@ -1,6 +1,6 @@
 footer {
   padding: 2rem;
-  background-color: var(--overlay-background-color);
+  background-color: var(--light-color);
   font-size: var(--body-font-size-s);
 }
 
@@ -11,4 +11,4 @@ footer .footer {
 
 footer .footer p {
   margin: 0;
-}
+}

blocks/footer/footer.js

@@ -6,14 +6,13 @@ import { loadFragment } from '../fragment/fragment.js';
  * @param {Element} block The footer block element
  */
 export default async function decorate(block) {
+  // load footer as fragment
   const footerMeta = getMetadata('footer');
-  block.textContent = '';
-
-  // load footer fragment
-  const footerPath = footerMeta.footer || '/footer';
+  const footerPath = footerMeta ? new URL(footerMeta, window.location).pathname : '/footer';
   const fragment = await loadFragment(footerPath);
 
   // decorate footer DOM
+  block.textContent = '';
   const footer = document.createElement('div');
   while (fragment.firstElementChild) footer.append(fragment.firstElementChild);
 

blocks/fragment/fragment.css

@@ -1,14 +1,13 @@
 /* suppress nested section padding */
-
 .fragment-wrapper > .section {
-    padding-left: 0;
-    padding-right: 0;
+  padding-left: 0;
+  padding-right: 0;
 }
 
 .fragment-wrapper > .section:first-of-type {
-    padding-top: 0;
+  padding-top: 0;
 }
 
 .fragment-wrapper > .section:last-of-type {
-    padding-bottom: 0;
-}
+  padding-bottom: 0;
+}