mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-30 11:19:44 -04:00
a0f6956eab
These numbers don’t look very clickable white-on-black. Blue is the colour of links, so lets see if they are more clickable in blue. The same clicking-a-big-number thing is also happening on the activity page, so this commit also changes the activity page to look the same.
58 lines
1.6 KiB
HTML
58 lines
1.6 KiB
HTML
{% macro big_number(number, label, link=None, currency='', smaller=False, smallest=False) %}
|
||
{% if link %}
|
||
<a class="big-number-link" href="{{ link }}">
|
||
{% endif %}
|
||
<div class="big-number{% if smaller %}-smaller{% endif %}{% if smallest %}-smallest{% endif %}">
|
||
<div class="big-number-number">
|
||
{% if number is number %}
|
||
{% if currency %}
|
||
{{ "{}{:,.2f}".format(currency, number) }}
|
||
{% else %}
|
||
{{ "{:,}".format(number) }}
|
||
{% endif %}
|
||
{% else %}
|
||
{{ number }}
|
||
{% endif %}
|
||
</div>
|
||
{% if label %}
|
||
<span class="big-number-label">{{ label }}</span>
|
||
{% endif %}
|
||
</div>
|
||
{% if link %}
|
||
</a>
|
||
{% endif %}
|
||
{% endmacro %}
|
||
|
||
|
||
{% macro big_number_with_status(
|
||
number,
|
||
label,
|
||
failures,
|
||
failure_percentage,
|
||
danger_zone=False,
|
||
failure_link=None,
|
||
link=None,
|
||
show_more_link=None,
|
||
show_more_text=''
|
||
) %}
|
||
<div class="big-number-with-status">
|
||
{{ big_number(number, label, link=link) }}
|
||
<div class="big-number-status{% if danger_zone %}-failing{% endif %}">
|
||
{% if failures %}
|
||
{% if failure_link %}
|
||
<a href="{{ failure_link }}">
|
||
{{ "{:,}".format(failures) }} failed – {{ failure_percentage }}%
|
||
</a>
|
||
{% else %}
|
||
{{ "{:,}".format(failures) }} failed – {{ failure_percentage }}%
|
||
{% endif %}
|
||
{% else %}
|
||
No failures
|
||
{% endif %}
|
||
</div>
|
||
</div>
|
||
{% if show_more_link and show_more_text %}
|
||
<a href="{{ show_more_link }}" class="big-number-with-status-show-more-link">{{ show_more_text }}</a>
|
||
{% endif %}
|
||
{% endmacro %}
|