From 2a2cac217f38383d4459d73e49e1bf69e9264a5c Mon Sep 17 00:00:00 2001
From: Timur Tripp <timur@timurtripp.com>
Date: Wed, 26 Jun 2024 11:48:24 -0600
Subject: [PATCH 1/3] CuBoulder/express_admin#17 Fixes node edit sidebar in
 10.3

---
 css/layout/node-form.css           |  8 ++----
 express_admin.info.yml             |  2 +-
 js/node-form.js                    | 13 +++++-----
 templates/node-edit-form.html.twig | 41 +++++++-----------------------
 4 files changed, 18 insertions(+), 46 deletions(-)

diff --git a/css/layout/node-form.css b/css/layout/node-form.css
index 5aa9c47..f2d7b66 100644
--- a/css/layout/node-form.css
+++ b/css/layout/node-form.css
@@ -1,13 +1,9 @@
 /* Enables hiding the node edit form sidebar.  */
 
-#ucb-edit-container.sidebar-closed {
+.ucb-sidebar-closed .layout-form {
   grid-template-columns: calc(100% - 2em) 2em;
 }
 
-#ucb-edit-container.sidebar-closed>#ucb-edit-main {
-  width: auto;
-}
-
-#ucb-edit-container.sidebar-closed>#ucb-edit-sidebar>#ucb-edit-sidebar-content {
+.ucb-sidebar-closed #edit-advanced {
   display: none;
 }
diff --git a/express_admin.info.yml b/express_admin.info.yml
index d3ee6bd..ec55d00 100644
--- a/express_admin.info.yml
+++ b/express_admin.info.yml
@@ -8,5 +8,5 @@ libraries:
   - express_admin/global-styling
 
 libraries-extend:
-  claro/node-form:
+  node/form:
     - express_admin/node-form
diff --git a/js/node-form.js b/js/node-form.js
index eae4d62..65fb184 100644
--- a/js/node-form.js
+++ b/js/node-form.js
@@ -1,19 +1,18 @@
 (function() {
   const button = document.querySelector('#ucb-sidebar-toggle-button');
-  const mainDiv = document.querySelector('#ucb-edit-container');
+  const main = document.querySelector('main');
+
+  button.addEventListener('click', event => {
+    event.preventDefault();
 
-  button.addEventListener('click', () => {
     // check the toggle state of the button 
     const status = button.dataset.status;
 
     // if the toggle status is 'open'
     if (status == 'open') {
-      mainDiv.classList.add("sidebar-closed");
-      mainDiv.classList.remove("sidebar-open");
-
+      main.classList.add('ucb-sidebar-closed');
     } else {
-      mainDiv.classList.add("sidebar-open");
-      mainDiv.classList.remove("sidebar-closed");
+      main.classList.remove('ucb-sidebar-closed');
     }
 
     // and toggle the icon/data attribute 
diff --git a/templates/node-edit-form.html.twig b/templates/node-edit-form.html.twig
index c1107d6..8c628ca 100644
--- a/templates/node-edit-form.html.twig
+++ b/templates/node-edit-form.html.twig
@@ -1,41 +1,18 @@
 {#
 /**
  * @file
- * Theme override for a node edit form.
- *
- * Two column template for the node add/edit form.
- *
- * This template will be used when a node edit form specifies 'node_edit_form'
- * as its #theme callback.  Otherwise, by default, node add/edit forms will be
- * themed by form.html.twig.
+ * Contains the template for the node edit form.
  *
  * Available variables:
  * - form: The node add/edit form.
- *
- * @see claro_form_node_form_alter()
  */
 #}
-<div id="ucb-edit-container" class="layout-node-form clearfix sidebar-open">
-  <div id="ucb-edit-main" class="layout-region layout-region--node-main">
-    <div class="layout-region__content">
-      {{ form|without('advanced', 'footer', 'actions') }}
-    </div>
-  </div>
-  <div id="ucb-edit-sidebar" class="layout-region layout-region--node-secondary">
-    <div class="ucb-sidebar-toggle-container">
-      <a id="ucb-sidebar-toggle-button" href="#" data-status="open">
-        <i class="fa-solid fa-2x fa-toggle-on"></i>
-      </a>
-    </div>
-    <div id="ucb-edit-sidebar-content" class="layout-region__content">
-      {{ form.advanced }}
-    </div>
-  </div>
-  <div class="layout-region layout-region--node-footer">
-    <div class="layout-region__content">
-      <div class="divider"></div>
-      {{ form.footer }}
-      {{ form.actions }}
-    </div>
+{% extends '@claro/node-edit-form.html.twig' %}
+{% block secondary %}
+  <div class="ucb-sidebar-toggle-container">
+    <a id="ucb-sidebar-toggle-button" href="#" data-status="open">
+      <i class="fa-solid fa-2x fa-toggle-on"></i>
+    </a>
   </div>
-</div>
+  {{ parent() }}
+{% endblock %}

From 98ab9ecc1dc4ddd465943a57e0ab3636299fb0b0 Mon Sep 17 00:00:00 2001
From: Timur Tripp <timur@timurtripp.com>
Date: Wed, 26 Jun 2024 12:03:16 -0600
Subject: [PATCH 2/3] Adds `role="button"` to sidebar toggle

---
 templates/node-edit-form.html.twig | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/node-edit-form.html.twig b/templates/node-edit-form.html.twig
index 8c628ca..4d2f492 100644
--- a/templates/node-edit-form.html.twig
+++ b/templates/node-edit-form.html.twig
@@ -10,7 +10,7 @@
 {% extends '@claro/node-edit-form.html.twig' %}
 {% block secondary %}
   <div class="ucb-sidebar-toggle-container">
-    <a id="ucb-sidebar-toggle-button" href="#" data-status="open">
+    <a role="button" id="ucb-sidebar-toggle-button" href="#" data-status="open">
       <i class="fa-solid fa-2x fa-toggle-on"></i>
     </a>
   </div>

From c4c45e642858eb344cbcf9bdf56c4511add8dbfa Mon Sep 17 00:00:00 2001
From: Timur Tripp <timur@timurtripp.com>
Date: Wed, 26 Jun 2024 12:13:15 -0600
Subject: [PATCH 3/3] Adds `aria-label` to sidebar toggle

---
 templates/node-edit-form.html.twig | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/node-edit-form.html.twig b/templates/node-edit-form.html.twig
index 4d2f492..34fd9cf 100644
--- a/templates/node-edit-form.html.twig
+++ b/templates/node-edit-form.html.twig
@@ -10,7 +10,7 @@
 {% extends '@claro/node-edit-form.html.twig' %}
 {% block secondary %}
   <div class="ucb-sidebar-toggle-container">
-    <a role="button" id="ucb-sidebar-toggle-button" href="#" data-status="open">
+    <a role="button" aria-label="Hide or show the advanced settings" id="ucb-sidebar-toggle-button" href="#" data-status="open">
       <i class="fa-solid fa-2x fa-toggle-on"></i>
     </a>
   </div>