nik/FreedomBox
1
0
Fork 0
mirror of https://github.com/freedombox/FreedomBox.git synced 2026-06-10 11:00:22 +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 %}
<div class="accordion" id="accordion-connections-fields">
<div class='field-group'>
<div class="card-header" id="header-general">
<h4>
<button class="btn btn-block text-left dropdown-toggle" type="button"
data-toggle="collapse" data-target="#collapse-general"
aria-expanded="true" aria-controls="collapse-general">
{% trans "General" %}
</button>
</h4>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="header-general">
<button class="accordion-button" type="button"
data-bs-toggle="collapse" data-bs-target="#collapse-general"
aria-expanded="true" aria-controls="collapse-general">
{% trans "General" %}
</button>
</h2>
<div id="collapse-general" class="collapse show"
<div id="collapse-general" class="accordion-collpase collapse show"
aria-labelledby="header-general"
data-parent="#accordion-connections-fields">
<div class="card-body">
data-bs-parent="#accordion-connections-fields">
<div class="accordion-body field-group">
{{ form.name|bootstrap }}
{{ form.interface|bootstrap }}
{{ form.zone|bootstrap }}
@ -50,23 +48,21 @@
{% endif %}
{% if form.ipv4_method %}
<div class="field-group">
<div class="card-header" id="header-ipv4">
<h4>
<button class="btn btn-block text-left dropdown-toggle {{ form.errors|yesno:",collapsed" }}"
type="button" data-toggle="collapse"
data-target="#collapse-ipv4"
aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-controls="collapse-ipv4">
{% trans "IPv4" %}
</button>
</h4>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="header-ipv4">
<button class="accordion-button {{ form.errors|yesno:",collapsed" }}"
type="button" data-bs-toggle="collapse"
data-bs-target="#collapse-ipv4"
aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-controls="collapse-ipv4">
{% trans "IPv4" %}
</button>
</h2>
<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"
data-parent="#accordion-connections-fields">
<div class="card-body">
data-bs-parent="#accordion-connections-fields">
<div class="accordion-body field-group">
{{ form.ipv4_method|bootstrap }}
{{ form.ipv4_address|bootstrap }}
{{ form.ipv4_netmask|bootstrap }}
@ -79,23 +75,21 @@
{% endif %}
{% if form.ipv6_method %}
<div class="field-group">
<div class="card-header" id="header-ipv6">
<h4>
<button class="btn btn-block text-left dropdown-toggle {{ form.errors|yesno:",collapsed" }}"
type="button" data-toggle="collapse"
data-target="#collapse-ipv6"
aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-controls="collapse-ipv6">
{% trans "IPv6" %}
</button>
</h4>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="header-ipv6">
<button class="accordion-button {{ form.errors|yesno:",collapsed" }}"
type="button" data-bs-toggle="collapse"
data-bs-target="#collapse-ipv6"
aria-expanded="{{ form.errors|yesno:"true,false" }}"
aria-controls="collapse-ipv6">
{% trans "IPv6" %}
</button>
</h2>
<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"
data-parent="#accordion-connections-fields">
<div class="card-body">
data-bs-parent="#accordion-connections-fields">
<div class="accordion-body field-group">
{{ form.ipv6_method|bootstrap }}
{{ form.ipv6_address|bootstrap }}
{{ form.ipv6_prefix|bootstrap }}

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

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

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

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

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

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

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

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