Give headline numbers a blue, not black background

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.
This commit is contained in:
Chris Hill-Scott
2016-06-08 15:41:02 +01:00
parent e7e0b2f227
commit a0f6956eab
6 changed files with 66 additions and 43 deletions

View File

@@ -1,4 +1,7 @@
{% macro big_number(number, label, label_link=None, currency='', smaller=False, smallest=False) %}
{% 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 %}
@@ -11,13 +14,13 @@
{{ number }}
{% endif %}
</div>
{% if label_link %}
<a class="big-number-label" href="{{ label_link }}">{{ label }}</a>
<a class="big-number-overlay-link" href="{{ label_link }}" aria-hidden="true"></a>
{% elif label %}
{% if label %}
<span class="big-number-label">{{ label }}</span>
{% endif %}
</div>
{% if link %}
</a>
{% endif %}
{% endmacro %}
@@ -28,12 +31,12 @@
failure_percentage,
danger_zone=False,
failure_link=None,
label_link=None,
link=None,
show_more_link=None,
show_more_text=''
) %}
<div class="big-number-with-status">
{{ big_number(number, label, label_link) }}
{{ big_number(number, label, link=link) }}
<div class="big-number-status{% if danger_zone %}-failing{% endif %}">
{% if failures %}
{% if failure_link %}

View File

@@ -1,3 +1,4 @@
{% from "components/big-number.html" import big_number %}
{% from "components/message-count-label.html" import message_count_label %}
{% from "components/big-number.html" import big_number %}

View File

@@ -14,23 +14,23 @@
<div class="column-half">
{{ big_number_with_status(
statistics.emails_requested,
message_count_label(statistics.emails_requested, 'email'),
message_count_label(statistics.emails_requested, 'email', suffix=''),
statistics.emails_failed,
statistics.get('emails_failure_rate', 0.0),
statistics.get('emails_failure_rate', 0)|float > 3,
failure_link=url_for(".view_notifications", service_id=current_service.id, message_type='email', status='failed'),
label_link=url_for(".view_notifications", service_id=current_service.id, message_type='email', status='sending,delivered,failed')
link=url_for(".view_notifications", service_id=current_service.id, message_type='email', status='sending,delivered,failed')
) }}
</div>
<div class="column-half">
{{ big_number_with_status(
statistics.sms_requested,
message_count_label(statistics.sms_requested, 'sms'),
message_count_label(statistics.sms_requested, 'sms', suffix=''),
statistics.sms_failed,
statistics.get('sms_failure_rate', 0.0),
statistics.get('sms_failure_rate', 0)|float > 3,
failure_link=url_for(".view_notifications", service_id=current_service.id, message_type='sms', status='failed'),
label_link=url_for(".view_notifications", service_id=current_service.id, message_type='sms', status='sending,delivered,failed')
link=url_for(".view_notifications", service_id=current_service.id, message_type='sms', status='sending,delivered,failed')
) }}
</div>
<div class="column-whole">