Use bootstrap 5 checkboxes.

This commit is contained in:
Jan Böhmer 2022-07-24 18:44:05 +02:00
parent 017170e2d6
commit 43b4c78553
21 changed files with 59 additions and 134 deletions

View file

@ -64,7 +64,7 @@
{% set is_parent_custom = parent_label_class is defined and ('checkbox-custom' in parent_label_class or 'radio-custom' in parent_label_class) %}
{% set is_custom = label_attr.class is defined and ('checkbox-custom' in label_attr.class or 'radio-custom' in label_attr.class) %}
{%- if is_parent_custom or is_custom -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' custom-control-label')|trim}) -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' form-check-label')|trim}) -%}
{%- else %}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' form-check-label')|trim}) -%}
{%- endif %}
@ -103,7 +103,7 @@
{% block tristate_widget -%}
{%- set parent_label_class = parent_label_class|default(label_attr.class|default('')) -%}
{%- if 'checkbox-custom' in parent_label_class -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' custom-control-input')|trim}) -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' form-check-input')|trim}) -%}
<div class="custom-control custom-checkbox{{ 'checkbox-inline' in parent_label_class ? ' custom-control-inline' }}">
{{- form_label(form, null, { widget: block('tr_parent') }) -}}
</div>

View file

@ -3,9 +3,9 @@
<td>
{% if multi_checkbox %}
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input tristate permission_multicheckbox" id="mulit_check_{{ form.vars.label }}">
<label class="custom-control-label" for="mulit_check_{{ form.vars.label }}">
<div class="form-check">
<input type="checkbox" class="form-check-input tristate permission_multicheckbox" id="mulit_check_{{ form.vars.label }}">
<label class="form-check-label" for="mulit_check_{{ form.vars.label }}">
<b>{{ form.vars.label | trans }}</b>
</label>
</div>
@ -53,16 +53,16 @@
<label><b>{% trans %}permission.legend.title{% endtrans %}:</b></label>
<div>
<div class="custom-control custom-control-inline custom-checkbox">
<input type="checkbox" hidden class="custom-control-input">
<label class="custom-control-label">{% trans %}permission.legend.disallow{% endtrans %}</label>
<input type="checkbox" hidden class="form-check-input">
<label class="form-check-label">{% trans %}permission.legend.disallow{% endtrans %}</label>
</div>
<div class="custom-control custom-control-inline custom-checkbox">
<input class="custom-control-input" type="checkbox" hidden checked>
<label class="custom-control-label">{% trans %}permission.legend.allow{% endtrans %}</label>
<input class="form-check-input" type="checkbox" hidden checked>
<label class="form-check-label">{% trans %}permission.legend.allow{% endtrans %}</label>
</div>
<div class="custom-control custom-control-inline custom-checkbox">
<input type="checkbox" class="tristate custom-control-input" hidden indeterminate="indeterminate">
<label class="custom-control-label">{% trans %}permission.legend.inherit{% endtrans %}</label>
<input type="checkbox" class="tristate form-check-input" hidden indeterminate="indeterminate">
<label class="form-check-label">{% trans %}permission.legend.inherit{% endtrans %}</label>
</div>
</div>
</div>