Top pagination and new bill button are sticky

When there are a lot of bills, this is much easier to access.
This commit is contained in:
Glandos 2021-12-02 23:43:41 +01:00
parent b9fee9e886
commit e383de2bf7
2 changed files with 10 additions and 11 deletions

View file

@ -283,14 +283,6 @@ footer .footer-left {
}
}
#new-bill {
margin-top: 30px;
}
#pagination-top {
margin-top: 30px;
}
/* Avoid text color flickering when it loose focus as the modal appears */
.btn-primary[data-toggle="modal"] {
color: #fff;
@ -334,6 +326,13 @@ footer .footer-left {
flex-basis: auto;
}
#bill-toolbar {
position: sticky;
top: 4em;
z-index: 1;
background-color: rgba(255, 255, 255, 0.75);
}
@media (min-width: 768px) {
.split_bills,
#table_overflow.statistics {

View file

@ -76,9 +76,9 @@
</div>
</div>
</div>
<div class="d-flex flex-wrap-reverse w-100">
<div class="d-flex flex-wrap w-100 pt-2 mt-2" id="bill-toolbar">
{% if bills.pages > 1 %}
<ul class="pagination mr-2" id="pagination-top">
<ul class="pagination mr-2 mb-0 pb-2 flex-wrap" id="pagination-top">
<li class="page-item {% if bills.page == 1 %}disabled{% endif %}"><a class="page-link" href="{{ url_for('main.list_bills', page=bills.prev_num) }}">&laquo; {{ _("Newer bills") }}</a></li>
{%- for page in bills.iter_pages() %}
{% if page %}
@ -90,7 +90,7 @@
<li class="page-item {% if bills.page == bills.pages %}disabled{% endif %}"><a class="page-link" href="{{ url_for('main.list_bills', page=bills.next_num) }}">{{ _("Older bills") }} &raquo;</a></li>
</ul>
{% endif %}
<span id="new-bill" class="ml-auto" {% if not g.project.members %} data-toggle="tooltip" title="{{_('You should start by adding participants')}}" {% endif %}>
<span id="new-bill" class="ml-auto pb-2" {% if not g.project.members %} data-toggle="tooltip" title="{{_('You should start by adding participants')}}" {% endif %}>
<a href="{{ url_for('.add_bill') }}" class="btn btn-primary {% if not g.project.members %} disabled {% endif %}" data-toggle="modal" data-keyboard="false" data-target="#bill-form">
<i class="icon icon-white before-text">{{ static_include("images/plus.svg") | safe }}</i>
{{ _("Add a new bill") }}