Fix advance settings block in streamfield for Wagtail 2.13 (#431)

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

@@ -267,12 +267,10 @@ input[type='checkbox']::before, input[type='radio']::before {
 
 .button-advanced-settings {
     display:block;
-    background-color:#aaa;
     font-size:0.8em;
     font-weight:600;
-}
-.button-advanced-settings:hover {
-    background-color:#999;
+    margin-top: -20px;
+    align-self: flex-start;
 }
 
 .power-by {

coderedcms/static/coderedcms/css/codered-editor.css

@@ -204,7 +204,7 @@ License: https://github.com/coderedcorp/coderedcms/blob/dev/LICENSE
     padding:0;
 }
 
-.codered-collapsible fieldset {
+.codered-collapsible .codered-collapsible-target {
     padding: 10px 0 0;
 }
 

coderedcms/static/coderedcms/js/codered-editor.js

@@ -1,20 +1,20 @@
 /*
 CodeRed CMS (https://www.coderedcorp.com/cms/)
-Copyright 2018-2019 CodeRed LLC
+Copyright 2018-2021 CodeRed LLC
 License: https://github.com/coderedcorp/coderedcms/blob/dev/LICENSE
 @license magnet:?xt=urn:btih:c80d50af7d3db9be66a4d0a86db0286e4fd33292&dn=bsd-3-clause.txt BSD-3-Clause
 */
 
 $(document).ready(function(){
     $(document).on('click', '.codered-collapsible button', function(){
-        var $fieldset = $(this).parent().find('fieldset');
+        var $target = $(this).parent().find('.codered-collapsible-target');
 
         if (!$(this).parent().hasClass('collapsed')) {
             $(this).parent().addClass('collapsed');
-            $fieldset.hide('fast');
+            $target.hide('fast');
         } else {
             $(this).parent().removeClass('collapsed');
-            $fieldset.show('fast');
+            $target.show('fast');
         }
     });
 });

coderedcms/templates/wagtailadmin/block_forms/base_block_settings_struct.html

@@ -1,25 +1,17 @@
-<div class="tab-content">
-    <section id="content" class= " active">
-        <ul class="objects">
-            <li class="object codered-collapsible collapsed multi-field">
-                <button type="button" class="button button-small button-nostroke button-advanced-settings">
-                    <i class="icon icon-fa-cog" aria-hidden="true"></i> Advanced Settings
-                </button>
-                <fieldset style="display:none;">
-                    <legend>Advanced Settings</legend>
-                    <ul class="fields">
-                    {% for child in children.values %}
-                        <li class="char_field">
-                            {% if child.block.label %}
-                                <label{% if child.id_for_label %} for="{{ child.id_for_label }}"{% endif %}>{{ child.block.label }}</label>
-                            {% endif %}
-                            {{ child.render_form }}
-                        </li>
-                    {% endfor %}
-                    </ul>
-                </fieldset>
-            </li>
-        </ul>
-    </section>
-</div>
+{% load wagtailadmin_tags  %}
 
+<div class="{{ classname }} codered-collapsible collapsed c-sf-container">
+    <button type="button" class="button button-small button-advanced-settings">
+        <i class="icon icon-fa-cog" aria-hidden="true"></i> Advanced Settings
+    </button>
+    <div class="codered-collapsible-target" style="display:none;">
+    {% for child in children.values %}
+        <div class="field {% if child.block.required %}required{% endif %}" data-contentpath="{{ child.block.name }}">
+            {% if child.block.label %}
+                <label class="field__label" {% if child.id_for_label %}for="{{ child.id_for_label }}"{% endif %}>{{ child.block.label }}</label>
+            {% endif %}
+            {{ child.render_form }}
+        </div>
+    {% endfor %}
+    </div>
+</div>

coderedcms/templates/wagtailadmin/block_forms/struct.html

@@ -1,18 +0,0 @@
-{% load coderedcms_tags %}
-
-<div class="{{ classname }}">
-    {% if help_text %}
-        <div class="object-help help">{{ help_text }}</div>
-    {% endif %}
-
-    <ul class="fields">
-        {% for child in children.values %}
-            <li>
-                {% if not child.block|is_advanced_setting %}
-                    <label{% if child.id_for_label %} for="{{ child.id_for_label }}"{% endif %}>{{ child.block.label }}</label>
-                {% endif %}
-                {{ child.render_form }}
-            </li>
-        {% endfor %}
-    </ul>
-</div>

docs/releases/index.rst

@@ -18,6 +18,7 @@ CodeRed CMS follows the ``[major].[minor].[maintenance]`` versioning scheme.
     :maxdepth: 1
 
     v0.22.0
+    v0.21.1
     v0.21.0
     v0.20.0
     v0.19.1

docs/releases/v0.21.1.rst

@@ -0,0 +1,9 @@
+v0.21.1 release notes
+=====================
+
+
+Bug fixes
+---------
+
+* Fix advanced settings button in StreamField for better compatibility with
+  Wagtail 2.13