Added style classes to represent left and right justified floating button groups

This commit is contained in:
atownson 2024-09-23 13:04:44 -05:00
parent 30e67047d3
commit 3b8a3dc66a
5 changed files with 15 additions and 7 deletions

View File

@ -37,10 +37,18 @@ span.color-label {
// A floating div for form buttons // A floating div for form buttons
.btn-float-group { .btn-float-group {
position: sticky; position: sticky;
bottom: 0px; bottom: 10px;
z-index: 1; z-index: 2;
}
.btn-float-group-left {
@extend .btn-float-group;
float: left;
}
.btn-float-group-right {
@extend .btn-float-group;
float: right; float: right;
padding: 0 0 10px;
} }
// Override a transparent background // Override a transparent background

View File

@ -102,7 +102,7 @@ Context:
{% endif %} {% endif %}
<div class="btn-float-group"> <div class="btn-float-group-right">
<a href="{{ return_url }}" class="btn btn-outline-secondary btn-float">{% trans "Cancel" %}</a> <a href="{{ return_url }}" class="btn btn-outline-secondary btn-float">{% trans "Cancel" %}</a>
<button type="submit" name="_apply" class="btn btn-primary">{% trans "Apply" %}</button> <button type="submit" name="_apply" class="btn btn-primary">{% trans "Apply" %}</button>
</div> </div>

View File

@ -67,7 +67,7 @@ Context:
{% endblock form %} {% endblock form %}
</div> </div>
<div class="btn-float-group"> <div class="btn-float-group-right">
{% block buttons %} {% block buttons %}
<a href="{{ return_url }}" class="btn btn-outline-secondary btn-float">{% trans "Cancel" %}</a> <a href="{{ return_url }}" class="btn btn-outline-secondary btn-float">{% trans "Cancel" %}</a>
{% if object.pk %} {% if object.pk %}

View File

@ -121,7 +121,7 @@ Context:
{# /Objects table #} {# /Objects table #}
{# Form buttons #} {# Form buttons #}
<div class="btn-list d-print-none mt-2"> <div class="btn-list d-print-none">
{% block bulk_buttons %} {% block bulk_buttons %}
<div class="bulk-action-buttons"> <div class="bulk-action-buttons">
{% if 'bulk_edit' in actions %} {% if 'bulk_edit' in actions %}

View File

@ -38,7 +38,7 @@
{% endif %} {% endif %}
</div> </div>
</div> </div>
<div class="btn-float-group me-1"> <div class="btn-float-group-right me-1">
<button type="button" class="btn btn-outline-danger btn-float" data-reset-select> <button type="button" class="btn btn-outline-danger btn-float" data-reset-select>
<i class="mdi mdi-backspace"></i> {% trans "Reset" %} <i class="mdi mdi-backspace"></i> {% trans "Reset" %}
</button> </button>