nik/FreedomBox
1
0
Fork 0
mirror of https://github.com/freedombox/FreedomBox.git synced 2026-08-26 12:46:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

networks: Use new accordion component from Bootstrap 5

Browse Source 
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
This commit is contained in:
Sunil Mohan Adapa 2024-11-13 15:37:57 -08:00 committed by Veiko Aasa
parent f04c1c18c1
commit c1a8607d85
No known key found for this signature in database
GPG Key ID: 478539CAE680674E
5 changed files with 77 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
plinth/modules/networks/templates/connections_fields.html
View File

@ -15,21 +15,19 @@
{% endif %} {% endif %}
<div class="accordion" id="accordion-connections-fields"> <div class="accordion" id="accordion-connections-fields">
<div class='field-group'> <div class="accordion-item">
<div class="card-header" id="header-general"> <h2 class="accordion-header" id="header-general">
<h4> <button class="accordion-button" type="button"
<button class="btn btn-block text-left dropdown-toggle" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-general"
data-toggle="collapse" data-target="#collapse-general" aria-expanded="true" aria-controls="collapse-general">
aria-expanded="true" aria-controls="collapse-general"> {% trans "General" %}
{% trans "General" %} </button>
</button> </h2>
</h4>
</div>
<div id="collapse-general" class="collapse show" <div id="collapse-general" class="accordion-collpase collapse show"
aria-labelledby="header-general" aria-labelledby="header-general"
data-parent="#accordion-connections-fields"> data-bs-parent="#accordion-connections-fields">
<div class="card-body"> <div class="accordion-body field-group">
{{ form.name|bootstrap }} {{ form.name|bootstrap }}
{{ form.interface|bootstrap }} {{ form.interface|bootstrap }}
{{ form.zone|bootstrap }} {{ form.zone|bootstrap }}
@ -50,23 +48,21 @@
{% endif %} {% endif %}
{% if form.ipv4_method %} {% if form.ipv4_method %}
<div class="field-group"> <div class="accordion-item">
<div class="card-header" id="header-ipv4"> <h2 class="accordion-header" id="header-ipv4">
<h4> <button class="accordion-button {{ form.errors|yesno:",collapsed" }}"
<button class="btn btn-block text-left dropdown-toggle {{ form.errors|yesno:",collapsed" }}" type="button" data-bs-toggle="collapse"
type="button" data-toggle="collapse" data-bs-target="#collapse-ipv4"
data-target="#collapse-ipv4" aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-expanded="{{ form.errors|yesno:"true,false" }}" aria-controls="collapse-ipv4">
aria-controls="collapse-ipv4"> {% trans "IPv4" %}
{% trans "IPv4" %} </button>
</button> </h2>
</h4>
</div>
<div id="collapse-ipv4" class="collapse {{ form.errors|yesno:"show," }}" <div id="collapse-ipv4" class="accordion-collpase collapse {{ form.errors|yesno:"show," }}"
aria-labelledby="header-ipv4" aria-labelledby="header-ipv4"
data-parent="#accordion-connections-fields"> data-bs-parent="#accordion-connections-fields">
<div class="card-body"> <div class="accordion-body field-group">
{{ form.ipv4_method|bootstrap }} {{ form.ipv4_method|bootstrap }}
{{ form.ipv4_address|bootstrap }} {{ form.ipv4_address|bootstrap }}
{{ form.ipv4_netmask|bootstrap }} {{ form.ipv4_netmask|bootstrap }}
@ -79,23 +75,21 @@
{% endif %} {% endif %}
{% if form.ipv6_method %} {% if form.ipv6_method %}
<div class="field-group"> <div class="accordion-item">
<div class="card-header" id="header-ipv6"> <h2 class="accordion-header" id="header-ipv6">
<h4> <button class="accordion-button {{ form.errors|yesno:",collapsed" }}"
<button class="btn btn-block text-left dropdown-toggle {{ form.errors|yesno:",collapsed" }}" type="button" data-bs-toggle="collapse"
type="button" data-toggle="collapse" data-bs-target="#collapse-ipv6"
data-target="#collapse-ipv6" aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-expanded="{{ form.errors|yesno:"true,false" }}" aria-controls="collapse-ipv6">
aria-controls="collapse-ipv6"> {% trans "IPv6" %}
{% trans "IPv6" %} </button>
</button> </h2>
</h4>
</div>
<div id="collapse-ipv6" class="collapse {{ form.errors|yesno:"show," }}" <div id="collapse-ipv6" class="accordion-collpase collapse {{ form.errors|yesno:"show," }}"
aria-labelledby="header-ipv6" aria-labelledby="header-ipv6"
data-parent="#accordion-connections-fields"> data-bs-parent="#accordion-connections-fields">
<div class="card-body"> <div class="accordion-body field-group">
{{ form.ipv6_method|bootstrap }} {{ form.ipv6_method|bootstrap }}
{{ form.ipv6_address|bootstrap }} {{ form.ipv6_address|bootstrap }}
{{ form.ipv6_prefix|bootstrap }} {{ form.ipv6_prefix|bootstrap }}

28
plinth/modules/networks/templates/connections_fields_pppoe.html
View File

@ -5,23 +5,21 @@
{% load bootstrap %} {% load bootstrap %}
{% load i18n %} {% load i18n %}
<div class="field-group"> <div class="accordion-item">
<div class="card-header" id="header-pppoe"> <h2 class="accordion-header" id="header-pppoe">
<h4> <button class="accordion-button {{ form.errors|yesno:",collapsed" }}"
<button class="btn btn-block text-left dropdown-toggle {{ form.errors|yesno:",collapsed" }}" type="button" data-bs-toggle="collapse"
type="button" data-toggle="collapse" data-bs-target="#collapse-pppoe"
data-target="#collapse-pppoe" aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-expanded="{{ form.errors|yesno:"true,false" }}" aria-controls="collapse-pppoe">
aria-controls="collapse-pppoe"> {% trans "PPPoE" %}
{% trans "PPPoE" %} </button>
</button> </h2>
</h4>
</div>
<div id="collapse-pppoe" class="collapse {{ form.errors|yesno:"show," }}" <div id="collapse-pppoe" class="accordion-collapse collapse {{ form.errors|yesno:"show," }}"
aria-labelledby="header-pppoe" aria-labelledby="header-pppoe"
data-parent="#accordion-connections-fields"> data-bs-parent="#accordion-connections-fields">
<div class="card-body"> <div class="accordion-body field-group">
{{ form.username|bootstrap }} {{ form.username|bootstrap }}
{{ form.password|bootstrap }} {{ form.password|bootstrap }}
{{ form.show_password|bootstrap }} {{ form.show_password|bootstrap }}

28
plinth/modules/networks/templates/connections_fields_privacy.html
View File

@ -5,23 +5,21 @@
{% load bootstrap %} {% load bootstrap %}
{% load i18n %} {% load i18n %}
<div class='field-group'> <div class="accordion-item">
<div class="card-header" id="header-privacy"> <h2 class="accordion-header" id="header-privacy">
<h4> <button class="accordion-button {{ form.errors|yesno:",collapsed" }}"
<button class="btn btn-block text-left dropdown-toggle {{ form.errors|yesno:",collapsed" }}" type="button" data-bs-toggle="collapse"
type="button" data-toggle="collapse" data-bs-target="#collapse-privacy"
data-target="#collapse-privacy" aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-expanded="{{ form.errors|yesno:"true,false" }}" aria-controls="collapse-privacy">
aria-controls="collapse-privacy"> {% trans "Privacy" %}
{% trans "Privacy" %} </button>
</button> </h2>
</h4>
</div>
<div id="collapse-privacy" class="collapse {{ form.errors|yesno:"show," }}" <div id="collapse-privacy" class="accordion-collapse collapse {{ form.errors|yesno:"show," }}"
aria-labelledby="header-privacy" aria-labelledby="header-privacy"
data-parent="#accordion-connections-fields"> data-bs-parent="#accordion-connections-fields">
<div class="card-body"> <div class="accordion-body field-group">
{{ form.dns_over_tls|bootstrap }} {{ form.dns_over_tls|bootstrap }}
</div> </div>
</div> </div>

28
plinth/modules/networks/templates/connections_fields_wifi.html
View File

@ -5,23 +5,21 @@
{% load bootstrap %} {% load bootstrap %}
{% load i18n %} {% load i18n %}
<div class="field-group"> <div class="accordion-item">
<div class="card-header" id="header-wifi"> <h2 class="accordion-header" id="header-wifi">
<h4> <button class="accordion-button {{ form.errors|yesno:",collapsed" }}"
<button class="btn btn-block text-left dropdown-toggle {{ form.errors|yesno:",collapsed" }}" type="button" data-bs-toggle="collapse"
type="button" data-toggle="collapse" data-bs-target="#collapse-wifi"
data-target="#collapse-wifi" aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-expanded="{{ form.errors|yesno:"true,false" }}" aria-controls="collapse-wifi">
aria-controls="collapse-wifi"> {% trans "Wi-Fi" %}
{% trans "Wi-Fi" %} </button>
</button> </h2>
</h4>
</div>
<div id="collapse-wifi" class="collapse {{ form.errors|yesno:"show," }}" <div id="collapse-wifi" class="accordion-collapse collapse {{ form.errors|yesno:"show," }}"
aria-labelledby="header-wifi" aria-labelledby="header-wifi"
data-parent="#accordion-connections-fields"> data-bs-parent="#accordion-connections-fields">
<div class="card-body"> <div class="accordion-body field-group">
{{ form.ssid|bootstrap }} {{ form.ssid|bootstrap }}
{{ form.mode|bootstrap }} {{ form.mode|bootstrap }}
{{ form.band|bootstrap }} {{ form.band|bootstrap }}

2
static/themes/default/css/main.css
View File

@ -975,6 +975,6 @@ img.notification-icon {
margin-bottom: 1.25rem; margin-bottom: 1.25rem;
} }
.accordion .card-header h4 { .accordion-header {
margin: 0; margin: 0;
} }