Styling tweaks

This commit is contained in:
richard-dds 2018-11-14 15:29:51 -05:00
parent d0c923bf9b
commit 50b57507ed
2 changed files with 26 additions and 12 deletions

View File

@ -22,13 +22,14 @@
} }
.pagination { .pagination {
width: 800px; width: 80%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-content: space-between;
margin: auto; margin: auto;
} }
.page { .page {
margin: auto; margin: auto;
flex-grow: 1;
max-width: 8%;
} }

View File

@ -1,11 +1,17 @@
{% macro Page(pagination, route, i, label=None) -%} {% macro Page(pagination, route, i, label=None, disabled=False) -%}
{% set label = label or i %} {% set label = label or i %}
{% if i == pagination.page %} {% set button_class = "page usa-button " %}
<button class="usa-button usa-button-primary">{{ label }}</button>
{% if disabled %}
{% set button_class = button_class + "usa-button-disabled" %}
{% elif i == pagination.page %}
{% set button_class = button_class + "usa-button-primary" %}
{% else %} {% else %}
<a class="usa-button usa-button-secondary page" href="{{ url_for(route, page=i, perPage=pagination.per_page) }}">{{ label }}</a> {% set button_class = button_class + "usa-button-secondary" %}
{% endif%} {% endif %}
<a class="{{ button_class }}" href="{{ url_for(route, page=i, perPage=pagination.per_page) }}">{{ label }}</a>
{%- endmacro %} {%- endmacro %}
{% macro Pagination(pagination, route) -%} {% macro Pagination(pagination, route) -%}
@ -23,23 +29,30 @@
{% if pagination.page == 1 %} {% if pagination.page == 1 %}
{% set max_page = [pagination.pages, 5] | min %} {% set max_page = [pagination.pages, 5] | min %}
{{ Page(pagination, route, 1, label="first", disabled=True) }}
{{ Page(pagination, route, pagination.page - 1, label="prev", disabled=True) }}
{% for i in range(1, max_page + 1) %} {% for i in range(1, max_page + 1) %}
{{ Page(pagination, route, i) }} {{ Page(pagination, route, i) }}
{% endfor %} {% endfor %}
{{ last }} {{ Page(pagination, route, pagination.page + 1, label="next") }}
{{ Page(pagination, route, pagination.pages, label="last") }}
{% elif pagination.page == pagination.pages %} {% elif pagination.page == pagination.pages %}
{{ first }} {{ Page(pagination, route, 1, label="first") }}
{{ Page(pagination, route, pagination.page - 1, label="prev") }}
{% for i in range(pagination.pages - 4, pagination.pages + 1) %} {% for i in range(pagination.pages - 4, pagination.pages + 1) %}
{{ Page(pagination, route, i) }} {{ Page(pagination, route, i) }}
{% endfor %} {% endfor %}
{{ Page(pagination, route, pagination.page + 1, label="next", disabled=True) }}
{{ Page(pagination, route, pagination.pages, label="last", disabled=True) }}
{% else %} {% else %}
{% set window = pagination | pageWindow %} {% set window = pagination | pageWindow %}
{{ first }} {{ Page(pagination, route, 1, label="first", disabled=True) }}
{{ Page(pagination, route, pagination.page - 1, label="prev", disabled=True) }}
{% for i in range(window.0, window.1 + 1) %} {% for i in range(window.0, window.1 + 1) %}
{{ Page(pagination, route, i) }} {{ Page(pagination, route, i) }}
{% endfor %} {% endfor %}
{{ last }} {{ Page(pagination, route, pagination.page + 1, label="next") }}
{{ Page(pagination, route, pagination.pages, label="last") }}
{% endif %} {% endif %}
</div> </div>
{%- endmacro %} {%- endmacro %}