#16009 Added btn-float-group style class and added to form templates for floating button groups

This commit is contained in:
atownson 2024-09-17 13:36:05 -05:00
parent 7167f20ca5
commit 8715f6fe87
6 changed files with 13 additions and 5 deletions

Binary file not shown.

View File

@ -33,3 +33,11 @@ span.color-label {
.netbox-edition { .netbox-edition {
letter-spacing: .15rem; letter-spacing: .15rem;
} }
// A floating div for form buttons
.btn-float-group {
position: sticky;
bottom: 0px;
z-index: 1;
padding: 2px 0px 10px 0px;
}

View File

@ -52,7 +52,7 @@ pre {
} }
// Altering background colors // Altering background colors
.page, .page-tabs .nav-tabs .nav-link.active { .page, .page-tabs .nav-tabs .nav-link.active, .btn-float-group {
background-color: var(--#{$prefix}bg-surface-tertiary) !important; background-color: var(--#{$prefix}bg-surface-tertiary) !important;
} }
.page-body .card .card-header { .page-body .card .card-header {
@ -105,7 +105,7 @@ body[data-bs-theme=dark] {
.navbar, .page-header { .navbar, .page-header {
background-color: $rich-black; background-color: $rich-black;
} }
.page, .page-tabs .nav-tabs .nav-link.active { .page, .page-tabs .nav-tabs .nav-link.active, .btn-float-group {
background-color: $rich-black-light !important; background-color: $rich-black-light !important;
} }

View File

@ -102,7 +102,7 @@ Context:
{% endif %} {% endif %}
<div class="text-end"> <div class="text-end btn-float-group">
<a href="{{ return_url }}" class="btn btn-outline-secondary">{% trans "Cancel" %}</a> <a href="{{ return_url }}" class="btn btn-outline-secondary">{% 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="text-end my-3"> <div class="text-end my-3 btn-float-group">
{% block buttons %} {% block buttons %}
<a href="{{ return_url }}" class="btn btn-outline-secondary">{% trans "Cancel" %}</a> <a href="{{ return_url }}" class="btn btn-outline-secondary">{% trans "Cancel" %}</a>
{% if object.pk %} {% if object.pk %}

View File

@ -37,7 +37,7 @@
</div> </div>
{% endif %} {% endif %}
</div> </div>
<div class="card-footer text-end d-print-none border-0"> <div class="card-footer text-end btn-float-group d-print-none border-0">
<button type="button" class="btn btn-outline-danger m-1" data-reset-select> <button type="button" class="btn btn-outline-danger m-1" data-reset-select>
<i class="mdi mdi-backspace"></i> {% trans "Reset" %} <i class="mdi mdi-backspace"></i> {% trans "Reset" %}
</button> </button>