pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Styling

Browse Source
This commit is contained in:
Montana 2019-02-12 09:37:10 -05:00
parent 6a8d4964d4
commit be44d5f8db
2 changed files with 43 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
styles/components/_portfolio_layout.scss
View File

@ -90,9 +90,19 @@
} }
} }
.column-left {
width: 12.5rem;
float: left;
}
.column-right {
margin-left: -.4rem;
}
.cents { .cents {
font-size: 2rem; font-size: 2rem;
margin-top: .75rem; margin-top: .75rem;
margin-left: -.7rem;
font-weight: bold; font-weight: bold;
} }

59
templates/portfolios/header.html
View File

@ -15,33 +15,40 @@
{{ secondary_breadcrumb or portfolio.name }} {{ secondary_breadcrumb or portfolio.name }}
</div> </div>
<div class='portfolio-header__budget row'> <div class='portfolio-header__budget row'>
<span>Available budget</span> <div class='column-left'>
<button type="button" tabindex="0" class="icon-tooltip" v-tooltip.right="{content: 'The available budget shown includes the available budget of all active task orders', container: false}"> <span>Available budget</span>
{{ Icon('info') }} <button type="button" tabindex="0" class="icon-tooltip" v-tooltip.right="{content: 'The available budget shown includes the available budget of all active task orders', container: false}">
</button> {{ Icon('info') }}
<span class='portfolio-header__budget--dollars'> </button>
{{ portfolio.task_orders | selectattr('is_active') | sum(attribute='budget') | justDollars }} </div>
</span> <div>
<span class='cents'> <span class='portfolio-header__budget--dollars'>
{{ portfolio.task_orders | selectattr('is_active') | sum(attribute='budget') | justCents }} {{ portfolio.task_orders | selectattr('is_active') | sum(attribute='budget') | justDollars }}
</span> </span>
<span class='cents'>
{{ portfolio.task_orders | selectattr('is_active') | sum(attribute='budget') | justCents }}
</span>
</div>
</div> </div>
<div class='portfolio-funding__header--funded-through {{ "funded" if funding_end_date is not none and funded else "unfunded"}}'> <div class='row'>
{% if funding_end_date and funded %} <div class='column-left'></div>
{{ Icon('ok') }} <div class='column-right portfolio-funding__header--funded-through {{ "funded" if funding_end_date is not none and funded else "unfunded"}}'>
Funded through {% if funding_end_date and funded %}
<local-datetime {{ Icon('ok') }}
timestamp='{{ funding_end_date }}' Funded through
format="M/D/YYYY"> <local-datetime
</local-datetime> timestamp='{{ funding_end_date }}'
{% elif funding_end_date and not funded %} format="M/D/YYYY">
{{ Icon('alert') }} </local-datetime>
Funded period ends {% elif funding_end_date and not funded %}
<local-datetime {{ Icon('alert') }}
timestamp='{{ funding_end_date }}' Funded period ends
format="M/D/YYYY"> <local-datetime
</local-datetime> timestamp='{{ funding_end_date }}'
{% endif %} format="M/D/YYYY">
</local-datetime>
{% endif %}
</div>
</div> </div>
</div> </div>
<div class='row links'> <div class='row links'>