Fix form rendering for bs5

Radiofields are not used, hence implementation has been deleted.
agdsn · Oct 11, 2023 · 3407fb1 · 3407fb1
1 parent 8154443
commit 3407fb1
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 25 deletions.
diff --git a/sipa/initialization.py b/sipa/initialization.py
@@ -76,8 +76,8 @@ def init_app(app, **kwargs):
     app.register_blueprint(bp_register)
 
     logger.debug('Registering Jinja globals')
-    form_label_width = 3
-    form_input_width = 7
+    form_label_width = 4
+    form_input_width = 8
     app.jinja_env.globals.update(
         cf_pages=cf_pages,
         get_locale=get_locale,
@@ -89,7 +89,7 @@ def init_app(app, **kwargs):
         current_datasource=lambda: backends.datasource,
         form_label_width_class=f"col-sm-{form_label_width}",
         form_input_width_class=f"col-sm-{form_input_width}",
-        form_input_offset_class=f"col-sm-offset-{form_label_width}",
+        form_input_offset_class=f"offset-sm-{form_label_width}",
         url_self=url_self,
         now=datetime.utcnow()
     )

diff --git a/sipa/templates/macros/forms.html b/sipa/templates/macros/forms.html
@@ -9,31 +9,21 @@
             {{ form.csrf_token }}
             {% for field in form -%}{% if field and field.id != 'csrf_token' %}
                 {% if loop.index0 == 0 %}{% set focus = true %}{% endif %}
-                <div class="form-group {% if field.errors %}has-error{% endif %}">
+                <div class="row mb-3 {% if field.errors %}has-error{% endif %}">
                     {% if field.type == "BooleanField" %}
                         <div class="{{ form_input_offset_class }} {{ form_input_width_class }}">
-                            <div class="checkbox">
-                            <label>
-                                <input id="{{ field.name }}" type="checkbox" name="{{ field.name }}"
-                                        {{ 'checked' if field.data | default(field.default) }}>
-                                {% if links %}{{ field.label | string | render_links(links) | safe }}
-                                {% else %}{{ field.label }}{% endif %}
-                            </label></div>
-                        </div>
-                    {% elif field.type == "RadioField" %}
-                        <div class="{{ form_label_width_class }} control-label">
-                            {{ field.label() }}
-                        </div>
-                        <div class="{{ form_input_width_class }}">
-                            {% for subfield in field %}
-                                <div class="radio"><label>
-                                        {{ subfield }}
-                                        {{ subfield.label.text }}
-                                </label></div>
-                            {% endfor %}
+                            {% set label=field.label(class_="form-check-label") %}
+                            <div class="form-check">
+                                <!-- `for="{field.id}"` included in `form.label()` rendering -->
+                                <!--suppress HtmlFormInputWithoutLabel -->
+                                <input id="{{ field.name }}" type="checkbox" class="form-check-input" name="{{ field.name }}"
+                                    {{ 'checked' if field.data | default(field.default) }}>
+                                {% if links %}{{ label | render_links(links) | safe }}
+                                {% else %}{{ label }}{% endif %}
+                            </div>
                         </div>
                     {% elif field.type != "HiddenField" %}
-                        <div class="{{ form_label_width_class }} control-label">
+                        <div class="{{ form_label_width_class }} col-form-label">
                             {{ field.label() }}
                         </div>
                         <div class="{{ form_input_width_class }}">

diff --git a/sipa/templates/usersuite/hosting.html b/sipa/templates/usersuite/hosting.html
@@ -43,7 +43,7 @@
                         {{ _("Hier kannst Du Deine Datenbank löschen:") }}
                 </div>
                 <div class="form-group">
-                    <div class="col-sm-offset-2 col-sm-10">
+                    <div class="offset-sm-2 col-sm-10">
                         <a href="{{ url_for('usersuite.hosting', action='delete') }}"
                            class="btn btn-danger">
                            <span class="bi-dash-square-fill" aria-hidden="true"></span>