Use consistent heading styles on top-level fields in the page editor (#9659)

Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>

CHANGELOG.txt

@@ -26,6 +26,7 @@ Changelog
  * Fix: Avoid issues where trailing whitespace could be accidentally removed in translations for new page & snippet headers (Florian Vogt)
  * Fix: Make sure minimap error indicators follow the minimap scrolling (Thibaud Colas)
  * Fix: Remove the ability to view or add comments to `InlinePanel` inner fields to avoid lost or incorrectly linked comments (Jacob Topp-Mugglestone)
+ * Fix: Use consistent heading styles on top-level fields in the page editor (Sage Abdullah)
  * Docs: Add custom permissions section to permissions documentation page (Dan Hayden)
  * Docs: Add documentation for how to get started with contributing translations for the Wagtail admin (Ogunbanjo Oluwadamilare)
  * Docs: Officially recommend `fnm` over `nvm` in development documentation (LB (Ben) Johnston)
@@ -53,6 +54,7 @@ Changelog
 
  * Fix: Make "Cancel scheduled publish" button correctly redirect back to the edit view (Sage Abdullah)
  * Fix: Prevent crash when reverting revisions on a snippet with `PreviewableMixin` applied (Sage Abdullah)
+ * Fix: Use consistent heading styles on top-level fields in the page editor (Sage Abdullah)
 
 
 4.1.1 (11.11.2022)

client/scss/components/_panel.scss

@@ -32,6 +32,10 @@ $header-gap: theme('spacing.1');
   cursor: pointer;
   padding-inline-end: theme('spacing.2');
 
+  label {
+    cursor: pointer;
+  }
+
   @include media-breakpoint-up(md) {
     padding-inline-end: theme('spacing.5');
   }

client/scss/components/forms/_nested-panel.scss

@@ -36,11 +36,6 @@ $panel-x-offset: calc($header-button-size-sm / 2 + $header-gap);
     // Mask the overlap with the parent panel’s guide line.
     background-color: $color-white;
   }
-
-  .w-panel__heading--label {
-    // Use smaller labels within nested panels in InlinePanel.
-    @apply w-label-2;
-  }
 }
 
 // Styles for nested panels excluding the top level.
@@ -61,6 +56,11 @@ $panel-x-offset: calc($header-button-size-sm / 2 + $header-gap);
     }
   }
 
+  .w-panel__heading--label {
+    // Use smaller labels within nested panels in InlinePanel.
+    @apply w-label-2;
+  }
+
   // For nested panels, there is always enough space for the prefix anchor.
   .w-panel__anchor--prefix {
     display: inline-grid;

docs/releases/4.1.2.md

@@ -15,3 +15,4 @@ depth: 1
 
  * Make "Cancel scheduled publish" button correctly redirect back to the edit view (Sage Abdullah)
  * Prevent crash when reverting revisions on a snippet with `PreviewableMixin` applied (Sage Abdullah)
+ * Use consistent heading styles on top-level fields in the page editor (Sage Abdullah)

docs/releases/4.2.md

@@ -38,6 +38,7 @@ depth: 1
  * Avoid issues where trailing whitespace could be accidentally removed in translations for new page & snippet headers (Florian Vogt)
  * Make sure minimap error indicators follow the minimap scrolling (Thibaud Colas)
  * Remove the ability to view or add comments to `InlinePanel` inner fields to avoid lost or incorrectly linked comments (Jacob Topp-Mugglestone)
+ * Use consistent heading styles on top-level fields in the page editor (Sage Abdullah)
 
 ### Documentation