mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-12-12 01:42:32 +00:00
Updated website boxes.
This commit is contained in:
@@ -6,8 +6,90 @@
|
||||
{% set boxClasses = 'col-lg-4 col-md-4 col-sm-6 col-xs-12' %}
|
||||
{% endif %}
|
||||
|
||||
<!-- Info boxes -->
|
||||
|
||||
<div class="row hidden-sm hidden-xs">
|
||||
|
||||
{# box for in and out#}
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box bg-aqua-gradient">
|
||||
<span class="info-box-icon"><i class="fa fa-balance-scale"></i></span>
|
||||
|
||||
<div class="info-box-content">
|
||||
<span class="info-box-text">{{ 'balance'|_ }}</span>
|
||||
<span class="info-box-number" id="box-balance-total"></span>
|
||||
|
||||
<div class="progress">
|
||||
<div class="progress-bar" style="width: 0%"></div>
|
||||
</div>
|
||||
<span class="progress-description">
|
||||
<span title="{{ 'expenses'|_ }}" id="box-balance-out"></span> / <span title="{{ 'income'|_ }}" id="box-balance-in"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# box for bills #}
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box bg-teal-gradient">
|
||||
<span class="info-box-icon"><i class="fa fa-calendar-o"></i></span>
|
||||
|
||||
<div class="info-box-content">
|
||||
<span class="info-box-text">{{ 'bills_to_pay'|_ }}</span>
|
||||
<span class="info-box-number" id="box-bills-unpaid"></span>
|
||||
|
||||
<div class="progress">
|
||||
<div class="progress-bar" style="width: 0%"></div>
|
||||
</div>
|
||||
<span class="progress-description">
|
||||
{{ 'paid'|_ }}:
|
||||
<span title="{{ 'bills_paid'|_ }}" id="box-bills-paid"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# available to spend total / per day #}
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box bg-green-gradient">
|
||||
<span class="info-box-icon"><i class="fa fa-money"></i></span>
|
||||
<div class="info-box-content">
|
||||
<span class="info-box-text">{{ 'left_to_spend'|_ }}</span>
|
||||
<span class="info-box-number" id="box-left-to-spend"></span>
|
||||
|
||||
<div class="progress">
|
||||
<div class="progress-bar" style="width: 0%"></div>
|
||||
</div>
|
||||
<span class="progress-description">
|
||||
{{ 'per_day'|_ }}:
|
||||
<span title="{{ 'left_to_spend_per_day'|_ }}" id="box-left-per-day"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# net worth #}
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box bg-blue-gradient">
|
||||
<span class="info-box-icon"><i class="fa fa-line-chart"></i></span>
|
||||
|
||||
<div class="info-box-content">
|
||||
<span class="info-box-text">{{ 'net_worth'|_ }}</span>
|
||||
<span class="info-box-number" id="box-net-worth"></span>
|
||||
|
||||
<div class="progress">
|
||||
<div class="progress-bar" style="width: 0%"></div>
|
||||
</div>
|
||||
<span class="progress-description">
|
||||
<span title="{{ 'net_worth'|_ }}" id="box-clear"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
{# box that shows amount spent #}
|
||||
{#
|
||||
<div class="{{ boxClasses }}" id="box_out_holder">
|
||||
<div class="info-box">
|
||||
<span class="info-box-icon bg-red">
|
||||
@@ -19,6 +101,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
#}
|
||||
|
||||
{# box that shows amount earned #}
|
||||
{#
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box">
|
||||
<span class="info-box-icon bg-green">
|
||||
@@ -31,9 +117,43 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
#}
|
||||
|
||||
{# box for total net worth #}
|
||||
{#
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box">
|
||||
<span class="info-box-icon bg-teal">
|
||||
<a href="{{ route('transactions.index',['deposit']) }}"><i class="fa fa-download faw-fw"></i></a>
|
||||
</span>
|
||||
|
||||
<div class="info-box-content">
|
||||
<span class="info-box-text"><a href="{{ route('transactions.index',['deposit']) }}">{{ 'net_worth'|_ }}</a></span>
|
||||
<span class="info-box-number"><a href="{{ route('transactions.index',['deposit']) }}" id="box-net-worth"></a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
#}
|
||||
{# box for left to spend#}
|
||||
{#
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box">
|
||||
<span class="info-box-icon bg-green">
|
||||
<a href="{{ route('transactions.index',['deposit']) }}"><i class="fa fa-download faw-fw"></i></a>
|
||||
</span>
|
||||
|
||||
<div class="info-box-content">
|
||||
<span class="info-box-text"><a href="{{ route('transactions.index',['deposit']) }}">{{ 'amount_available'|_ }}</a></span>
|
||||
<span class="info-box-number"><a href="{{ route('transactions.index',['deposit']) }}" id="box-in"></a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
#}
|
||||
{#
|
||||
{% if billCount > 0 %}
|
||||
<div class="clearfix visible-sm-block"></div>
|
||||
|
||||
<!-- box that shows unpaid bills -->
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box">
|
||||
<span class="info-box-icon bg-blue">
|
||||
@@ -46,6 +166,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- box that shows paid bills -->
|
||||
<div class="{{ boxClasses }}">
|
||||
<div class="info-box">
|
||||
<span class="info-box-icon bg-aqua">
|
||||
@@ -59,4 +181,5 @@
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
#}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user