3.0.0 Release

.github/workflows/localgov_microsites.yml

@@ -4,9 +4,11 @@ on:
   push:
     branches:
       - '2.x'
+      - '3.x'
   pull_request:
     branches:
       - '2.x'
+      - '3.x'
   workflow_dispatch:
 
 jobs:

README.md

@@ -2,6 +2,32 @@
 
 A  sub-theme of LocalGov Base. Please read the README there also.
 
+## Supported releases
+
+We now have a 3.x and a 2.x branch.
+
+- All new feature development work will be against the 3.x branch
+- The 2.x branch will continue to have bug fixes until the end of December 2025.
+
+Everyone is encouraged to upgrade to the 3.x branch and localgov_base 2.x, but please see release notes regarding changes to the grid system layouts, moving from flex to css grids.
+
+https://github.com/localgovdrupal/localgov_base/releases/tag/2.0.0
+
+## Notes on upgrading from 2.x to 3.x
+
+The 3.x branch of localgov_microsites_base requires localgov_base 2.x
+
+In the 2.x branch of localgov_base, we have re-written our grid system to use CSS Grid instead of Flexbox.
+
+This makes the CSS for the grid simpler. It should also fix lots of minor spacing issues (negative left/right margin on grid containers).
+
+Important: We recommend testing your layouts before deploying.
+
+In some cases, if you have made customisations to the layout in a child theme, removing these changes might be advisable.
+
+In some cases, the changes needed in child themes are to change the width specification on grid child items from
+"width: calc(...) " to "grid-column: span 3" for example.
+
 ## Customising the appearance through the UI
 
 A _Microsite Admin_ has the permission to set a number of css variables through the UI. These override the default variables set in /css/variables.css

composer.json

@@ -6,7 +6,7 @@
     "license": "GPL-2.0-or-later",
     "require": {
         "drupal/twig_tweak": "^3.2",
-        "localgovdrupal/localgov_base": "^1.7.0",
+        "localgovdrupal/localgov_base": "^2.0.0",
         "localgovdrupal/localgov_microsites_group": "^4.0.0-alpha3"
     }
 }

css/components/footer.css

@@ -53,18 +53,20 @@
   color: var(--footer-text-color);
 }
 
-@media screen and (min-width: 768px) {
-  .microsite-footer .lgd-row__one-quarter,
-  .microsite-footer .lgd-row--quarters > * {
-    width: calc(25% - var(--footer-grid-column-spacing));
-  }
+.region-microsites-footer .lgd-region__inner > .lgd-row:first-of-type {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: var(--footer-grid-column-justification);
 }
 
-.microsite-footer .lgd-row > * {
-  margin-right: calc(var(--footer-grid-column-spacing) / 2);
-  margin-left: calc(var(--footer-grid-column-spacing) / 2);
+@media (min-width: 48rem) {
+  .region-microsites-footer .lgd-region__inner > .lgd-row:first-of-type > * {
+    flex: 0 0 calc(50% - var(--grid-column-spacing));
+  }
 }
+@media (min-width: 60rem) {
+  .region-microsites-footer .lgd-region__inner > .lgd-row:first-of-type > * {
+    flex: 0 0 calc(25% - var(--grid-column-spacing));
 
-.region-microsites-footer .lgd-region__inner > .lgd-row:first-of-type {
-  justify-content: var(--footer-grid-column-justification);
+  }
 }

js/header.js

@@ -63,7 +63,8 @@
             if (
               offCanvasToggle &&
               !offCanvasToggle.contains(e.target) &&
-              !offCanvas.contains(e.target)
+              !offCanvas.contains(e.target) &&
+              offCanvas.getAttribute("data-expanded") === "true"
             ) {
               handleCloseOffCanvas();
             }