Fix rendering of some streamfields (#446)

In some situations, streamfields may appear center-aligned instead of left-aligned. This seems to have broken due to some kind of rendering change in recent versions of Wagtail.

Tested Wagtail admin manually on problematic sites in Firefox and Chrome.

coderedcms/static/coderedcms/css/codered-admin.css

@@ -126,21 +126,33 @@ input[type='checkbox']::before, input[type='radio']::before {
         margin: 0;
         width: auto;
     }
-    /* Labels for page editor forms (except labels for nested streamfields) */
-    body:not(.login) ul.fields > li:not(.label-above):not(.stream-field) .field > label {
+    /* Labels for page editor forms */
+    body:not(.login) ul.fields > li:not(.label-above) .field > label {
         width:20%;
         max-width:15em;
     }
-    /* Fields for page editor forms (except nested streamfields) */
+    /* (undo previous rule for nested streamfields) */
+    body:not(.login) ul.fields > li.stream-field > .field > label {
+        width: 100%;
+        max-width: unset;
+    }
+
+    /* Fields for page editor forms */
     li.codered-collapsible label+.field,
-    body:not(.login) ul.fields > li:not(.label-above):not(.stream-field) label+.field-content,
-    body:not(.login) ul.fields > li:not(.label-above):not(.stream-field) label+.field {
+    body:not(.login) ul.fields > li:not(.label-above) label+.field-content,
+    body:not(.login) ul.fields > li:not(.label-above) label+.field {
         display:block;
         flex-grow: 1;
         float:none;
         margin: 0 auto;
         width: 80%;
     }
+    /* (undo previous rule in nested streamfields) */
+    body:not(.login) ul.fields > li.stream-field > .field > label+.field-content,
+    body:not(.login) ul.fields > li.stream-field > .field > label+.field {
+        width: 100%;
+    }
+
     /* Labels for streamfield forms (except labels for nested streamfields) */
     body:not(.login) ul.fields > li:not(.label-above) ul.fields > li > label,
     body:not(.login) ul.fields > li:not(.label-above) ul.fields > li > .label,
@@ -150,10 +162,10 @@ input[type='checkbox']::before, input[type='radio']::before {
         max-width:15em;
     }
     /* Fields for streamfield forms (except nested streamfields) */
-    body:not(.login) ul.fields > li:not(.label-above):not(.stream-field) ul.fields > li > .field,
-    body:not(.login) ul.fields > li:not(.label-above):not(.stream-field) ul.fields > li > .field
-    body:not(.login) .struct-block ul.fields > li:not(.label-above):not(.stream-field) .field > .field,
-    body:not(.login) .multiple     ul.fields > li:not(.label-above):not(.stream-field) .field > .field {
+    body:not(.login) ul.fields > li:not(.label-above) ul.fields > li > .field,
+    body:not(.login) ul.fields > li:not(.label-above) ul.fields > li > .field
+    body:not(.login) .struct-block ul.fields > li:not(.label-above) .field > .field,
+    body:not(.login) .multiple     ul.fields > li:not(.label-above) .field > .field {
         width: 80%;
     }
     .object.full .field-content {

docs/releases/v0.22.2.rst

@@ -10,3 +10,6 @@ Bug fixes
 
 * Field labels in form submission emails now show the exact label as entered
   on the Wagtail page, instead of a "humanized" version of the field ID.
+
+* Fix layout of fields in the Wagtail admin, which may appear centered instead
+  of left-aligned under certain StreamField conditions.