src/servala/frontend/forms/renderers.py

@@ -20,6 +20,8 @@ class VerticalFormRenderer(TemplatesSetting):
     def get_class_names(self, field):
         input_type = self.get_field_input_type(field)
         errors = "is-invalid " if field.errors else ""
+        if input_type == "radio":
+            return f"{errors}form-check-input"
         if input_type == "checkbox":
             return f"{errors}form-check-input"
         return f"{errors}form-control"

src/servala/frontend/templates/django/forms/widgets/input_option.html

@@ -0,0 +1,6 @@
+{% include "django/forms/widgets/input.html" %}
+{% if widget.wrap_label %}
+    <label {% if widget.attrs.id %}for="{{ widget.attrs.id }}"{% endif %}>
+        {% if not widget.attrs.hide_label %}{{ widget.label }}{% endif %}
+    </label>
+{% endif %}

src/servala/frontend/templates/django/forms/widgets/radio.html

@@ -0,0 +1,15 @@
+{# Change compared to Django: only render widget.attrs.class in actual option widget, not in wrapper #}
+{% with id=widget.attrs.id %}
+    <div {% if id %}id="{{ id }}"{% endif %}>
+        {% for group, options, index in widget.optgroups %}
+            {% if group %}
+                <div>
+                    <label>{{ group }}</label>
+                {% endif %}
+                {% for option in options %}
+                    <div>{% include option.template_name with widget=option %}</div>
+                {% endfor %}
+                {% if group %}</div>{% endif %}
+        {% endfor %}
+    </div>
+{% endwith %}

src/servala/settings.py

@@ -145,11 +145,11 @@ INSTALLED_APPS = [
     "django.contrib.sessions",
     "django.contrib.messages",
     "django.contrib.staticfiles",
+    # The frontend app is loaded early in order to supersede some allauth views/behaviour
+    "servala.frontend",
     "django.forms",
     "template_partials",
     "rules.apps.AutodiscoverRulesConfig",
-    # The frontend app is loaded early in order to supersede some allauth views/behaviour
-    "servala.frontend",
     "allauth",
     "allauth.account",
     "allauth.socialaccount",

src/servala/static/css/servala.css

@@ -54,6 +54,12 @@ html[data-bs-theme="dark"] .btn-outline-primary, .btn-outline-primary {
     margin-bottom: 0;
 }
 
+fieldset .form-check-input + label {
+    font-weight: normal;
+    min-height: 1.5rem;
+    margin: .125rem;
+}
+
 .search-form .form-body>.row {
     display: flex;
     &>.col-12 {