Add label macro

This commit is contained in:
leigh-mil 2019-10-21 14:48:44 -04:00
parent b1a18f83f3
commit 750ea6568b
5 changed files with 14 additions and 3 deletions

View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M464 64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm0 48v40.805c-22.422 18.259-58.168 46.651-134.587 106.49-16.841 13.247-50.201 45.072-73.413 44.701-23.208.375-56.579-31.459-73.413-44.701C106.18 199.465 70.425 171.067 48 152.805V112h416zM48 400V214.398c22.914 18.251 55.409 43.862 104.938 82.646 21.857 17.205 60.134 55.186 103.062 54.955 42.717.231 80.509-37.199 103.053-54.947 49.528-38.783 82.032-64.401 104.947-82.653V400H48z"/></svg>
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="envelope" class="svg-inline--fa fa-envelope fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z"></path></svg>

Before

Width:  |  Height:  |  Size: 574 B

After

Width:  |  Height:  |  Size: 700 B

View File

@ -18,6 +18,7 @@
padding: 0 $gap;
border-radius: $gap / 3;
white-space: nowrap;
text-transform: uppercase;
&--info {
background-color: $color-primary;

View File

@ -1,4 +1,5 @@
{% from "components/icon.html" import Icon %}
{% from "components/label.html" import Label %}
{% from 'components/save_button.html' import SaveButton %}
{% from "components/text_input.html" import TextInput %}
{% from "components/toggle_list.html" import ToggleButton, ToggleSection %}
@ -51,7 +52,7 @@
}}
<br>
{% if env['pending'] -%}
<span class='usa-label label--below'>{{Icon('exchange')}} CHANGES PENDING</span>
{{ Label('exchange', 'Changes Pending', classes='label--below')}}
{% else %}
<a href='{{ url_for("applications.access_environment", environment_id=env.id)}}' target='_blank' rel='noopener noreferrer' class='application-list-item__environment__csp_link'>
<span>{{ "portfolios.applications.csp_link" | translate }} {{ Icon('link', classes="icon--tiny") }}</span>

View File

@ -1,5 +1,6 @@
{% from "components/alert.html" import Alert %}
{% from "components/icon.html" import Icon %}
{% from "components/label.html" import Label %}
{% import "applications/fragments/new_member_modal_content.html" as member_steps %}
{% import "applications/fragments/member_form_fields.html" as member_fields %}
{% from "components/modal.html" import Modal %}
@ -131,7 +132,7 @@
</a>
<br>
{% if member.role_status == 'pending' %}
<span class='label label--purple'>INVITE PENDING</span>
{{ Label('envelope', 'invite pending', 'success', classes='label--below') }}
{% endif %}
</td>

View File

@ -0,0 +1,8 @@
{% from "components/icon.html" import Icon %}
{% macro Label(icon_name, text, type=None, classes="") -%}
<span class='label {% if type %}label--{{ type }}{% endif %} {{ classes }}'>
{{ Icon(icon_name) }} {{ text }}
</span>
{%- endmacro %}