Merge pull request #1622 from akvo/1615-interface-fixes

[#1615] Small user interface enhancements
akvo · Jun 19, 2015 · fbb3064 · fbb3064
2 parents 5528119 + 24b254f
commit fbb3064
Show file tree

Hide file tree

Showing 11 changed files with 161 additions and 37 deletions.
diff --git a/akvo/rsr/static/styles-src/main.css b/akvo/rsr/static/styles-src/main.css
@@ -533,6 +533,14 @@ nav.navbar-fixed-top {
   background: rgba(32, 32, 36, 0.1) !important; }
   .myProjectList tbody tr.isPublished {
     background: white !important; }
+@media only screen and (min-width: 1200px) {
+  .myProjectList div.twoColumns.clearfix {
+    min-width: 170px; } }
+.myProjectList div.twoColumns.clearfix > a {
+  min-width: 70px; }
+
+div.paginationWrap {
+  clear: both; }
 
 #profile .usrAvatar {
   background-color: rgba(32, 32, 36, 0);
@@ -1489,6 +1497,10 @@ div.textBlock {
       margin-bottom: 1em; } }
 
 /* Financial details page */
+section.projectFinancial .currentFunders dl > dd {
+  text-align: right; }
+section.projectFinancial .donationBreak {
+  display: none; }
 @media only screen and (max-width: 768px) {
   section.projectFinancial {
     width: 95%;
@@ -1500,7 +1512,14 @@ div.textBlock {
 @media only screen and (max-width: 992px) {
   @media only screen and (min-width: 768px) {
     section.projectFinancial .dl-horizontal dt {
-      width: initial; } } }
+      width: initial; }
+    section.projectFinancial .donationBreak {
+      display: initial;
+      clear: both; }
+    section.projectFinancial .currentFunders dd.donation {
+      float: right; }
+    section.projectFinancial .currentFunders dt.donation {
+      clear: both; } } }
 
 /* Project Partners details page */
 section.projectPartners .title {
@@ -1556,6 +1575,28 @@ section.projectPartners .row {
 dd.currencyAmount {
   margin-left: auto; }
 
+/* Project report page */
+@media only screen and (max-width: 768px) {
+  .projectReport {
+    max-width: 95%;
+    margin-left: auto;
+    margin-right: auto; } }
+@media only screen and (min-width: 992px) {
+  .projectReport table {
+    table-layout: fixed; }
+    .projectReport table th {
+      word-break: break-word; }
+      @media only screen and (max-width: 1200px) {
+        .projectReport table th {
+          width: 90px; } }
+      @media only screen and (min-width: 1200px) {
+        .projectReport table th {
+          width: 120px; } } }
+
+/* Project update page */
+.updateText {
+  white-space: pre-line; }
+
 /* Cookie */
 #cookie-law {
   position: fixed;

diff --git a/akvo/rsr/static/styles-src/main.scss b/akvo/rsr/static/styles-src/main.scss
@@ -480,7 +480,7 @@ nav.navbar-fixed-top {
         .navbar-collapse {
             &.in {
                 /*  Allow language dropdown menu to extend the height of the nav container.
-                    Otherwise, we get a scrollbar in the nav area on small screens */                
+                    Otherwise, we get a scrollbar in the nav area on small screens */
                 @include responsive(small-max-screens) {
                     overflow-y: initial;
                 }
@@ -596,6 +596,18 @@ nav.navbar-fixed-top {
             }
         }
     }
+    div.twoColumns.clearfix {
+        @media only screen and (min-width: $width-large) {
+            min-width: 170px;
+        }
+        > a {
+            min-width: 70px;
+        }
+    }
+}
+
+div.paginationWrap {
+    clear: both;
 }
 
 #profile {
@@ -1848,6 +1860,16 @@ div.textBlock {
 /* Financial details page */
 
 section.projectFinancial {
+    .currentFunders {
+        dl {
+            > dd {
+                text-align: right;
+            }
+        }
+    }
+    .donationBreak {
+        display: none;
+    }
     @include responsive(small-max-screens) {
         width: 95%;
         max-width: 450px;
@@ -1867,6 +1889,22 @@ section.projectFinancial {
                     width: initial;
                 }
             }
+            .donationBreak {
+                display: initial;
+                clear: both;
+            }
+            .currentFunders {
+                dd {
+                    &.donation {
+                        float: right;
+                    }
+                }
+                dt {
+                    &.donation {
+                        clear: both;
+                    }
+                }
+            }
         }
     }
 }
@@ -1948,6 +1986,37 @@ dd {
     }
 }
 
+/* Project report page */
+
+.projectReport {
+    @include responsive(small-max-screens) {
+        max-width: 95%;
+        margin-left: auto;
+        margin-right: auto;
+    }
+
+    @media only screen and (min-width: $width-medium) {
+        table {
+            table-layout: fixed;
+            th {
+                @media only screen and (max-width: $width-large) {
+                    width: 90px;
+                }
+                @media only screen and (min-width: $width-large) {
+                    width: 120px;
+                }
+                word-break: break-word;
+            }
+        }
+    }
+}
+
+/* Project update page */
+
+.updateText {
+    white-space: pre-line;
+}
+
 /* Cookie */
 
 #cookie-law {

diff --git a/akvo/rsr/views/project.py b/akvo/rsr/views/project.py
@@ -469,8 +469,10 @@ def partners(request, project_id):
 def finance(request, project_id):
     """."""
     project = get_object_or_404(Project, pk=project_id)
+    pledged = project.get_pledged()
     context = {
-        'project': project
+        'project': project,
+        'pledged': pledged,
     }
     return render(request, 'project_finance.html', context)
 

diff --git a/akvo/templates/myrsr/my_iati.html b/akvo/templates/myrsr/my_iati.html
@@ -25,7 +25,7 @@ <h3>{% trans "My IATI" %}{% if selected_org %} {% trans "for" %} {{selected_org.
                 {% trans 'When the IATI file is generated, it will be shown in the overview on the right.' %}
             </div>
         {% endif %}
-        {% trans 'On this page it is possible to export an IATI file of the projects of your organisation or view previously exported files. ' %}
+        {% trans 'IATI stands for International Aid Transparency Initiative, which is a global reporting standard that makes it possible to compare and compile data sets from different projects and organisations. On this page it is possible to export an IATI file of the projects of your organisation or view previously exported files.' %}
         {% if not selected_org %}
         {% trans 'Since your account is connected to multiple organisations, please select an organisation first.' %}
         <p>

diff --git a/akvo/templates/organisation_directory.html b/akvo/templates/organisation_directory.html
@@ -17,7 +17,7 @@
             <div class="input-group">
               {% bootstrap_field filter.form.name field_class='search-query' show_label=False %}
               <span class="input-group-btn">
-                <button class="btn btn-primary" type="submit">{% trans "Update list" %} &#8250;</button>
+                <button class="btn btn-primary" type="submit">{% trans "Search" %} &#8250;</button>
               </span>
             </div>
             <a class="btn showFilters menu-toggle"><i class="fa fa-toggle-off"></i> {% trans 'Advanced filters' %}</a>

diff --git a/akvo/templates/project_directory.html b/akvo/templates/project_directory.html
@@ -15,7 +15,7 @@
               <div class="input-group">
                 {% bootstrap_field filter.form.title field_class='search-query' show_label=False %}
                 <span class="input-group-btn">
-                   <button class="btn btn-primary" type="submit">{% trans "Update list" %} &#8250;</button>
+                   <button class="btn btn-primary" type="submit">{% trans "Search" %} &#8250;</button>
                 </span>
               </div>
               <a class="btn showFilters menu-toggle"><i class="fa fa-toggle-off"></i> {% trans 'Advanced filters' %}</a>

diff --git a/akvo/templates/project_finance.html b/akvo/templates/project_finance.html
@@ -11,58 +11,64 @@
 	    <div class="container">
 	    	<div class="row verticalPadding">
                 <div class="col-sm-4">
-                    <h4 class="">{% trans "Project financial details" %}:</h4>
+                    <h4 class="">{% trans "Project budget" %}:</h4>
                     <dl class="dl-horizontal">
                         {% for budget_item in project.budget_items.all %}
                         {% if 'other' in budget_item.label.label and budget_item.other_extra %}
-                        <dt>{{budget_item.other_extra}}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{budget_item.amount|floatformat:2|intcomma}}</dd>
+                        <dt>{{budget_item.other_extra}}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{budget_item.amount|floatformat:0|intcomma}}</dd>
                         {% else %}
-                        <dt>{{budget_item.label.label}}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{budget_item.amount|floatformat:2|intcomma}}</dd>
+                        <dt>{{budget_item.label.label}}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{budget_item.amount|floatformat:0|intcomma}}</dd>
                         {% endif %}
                         {% endfor %}
-                        <dt class="totalFinance">{% trans "Total" %}:</dt><dd class="totalFinance currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.budget|floatformat:2|intcomma}}</dd>
+                        <dt class="totalFinance">{% trans "Total" %}:</dt><dd class="totalFinance currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.budget|floatformat:0|intcomma}}</dd>
                     </dl>
                 </div>
-                <div class="col-sm-4">
-                    <h4 class="">{% trans "Project funding" %}:</h4>
-                    <dl class="dl-horizontal">
-                        <dt>{% trans "Budget" %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.budget|floatformat:2|intcomma}}</dd>
-                        <dt>{% trans "Funded" %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.funds|floatformat:2|intcomma}}</dd>
-                        <dt class="totalFinance">{% trans "Funds needed" %}:</dt><dd class="totalFinance currencyAmount"><span class="currency"> {{project.get_currency_display}}</span>{{project.funds_needed|floatformat:2|intcomma}}</dd>
-                    </dl>
-                </div>
-                <div class="col-sm-4">
+                <div class="col-sm-4 currentFunders">
                     <h4 class="">{% trans "Current funders" %}:</h4>
                     {% for partnership in project.funding_partnerships %}
                     <dl class="dl-horizontal">
                         <dt><a href="{% url 'organisation-main' partnership.organisation.pk %}">{% img partnership.organisation 80 60 partnership.organisation.name %}</a></dt>
                         <dd>
-                            <a href="{% url 'organisation-main' partnership.organisation.pk %}">{{partnership.organisation}}</a>
-                            {% if partnership.funding_amount %}
-                            <br><span class="currency">{{project.get_currency_display}}</span>{{partnership.funding_amount|floatformat:2|intcomma}}
-                            {% endif %}
+                            <a href="{% url 'organisation-main' partnership.organisation.pk %}">{{partnership.organisation}}</a>{% if partnership.funding_amount %}<br><span class="currency">{{project.get_currency_display}}</span>{{partnership.funding_amount|floatformat:0|intcomma}}{% endif %}
                         </dd>
+                        {% if pledged %}
+                        <dt class="totalFinance">{% trans "Total" %}:</dt><dd class="totalFinance currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{pledged|floatformat:0|intcomma}}</dd>
+                        {% endif %}
                     </dl>
                     {% endfor %}
                     <h4>{% trans "Donations" %}:</h4>
                     <dl class="dl-horizontal">
                         {% for donation in project.all_donations %}
-                        <dt>{% if donation.is_anonymous %}{% trans "Anonymous" %}{% else %}{{donation.name}}{% endif %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{donation.amount_received|floatformat:2|intcomma}}</dd>
+                        <dt class="donation">{% if donation.is_anonymous %}{% trans "Anonymous" %}{% else %}{{donation.name}}{% endif %}:</dt><br class="donationBreak"><dd class="currencyAmount donation"><span class="currency"> ({% trans "excl. fee" %}: {{project.get_currency_display}}</span>{{donation.donation_fee|floatformat:0|intcomma}}) <span class="currency">{{project.get_currency_display}}</span>{{donation.amount_received|floatformat:0|intcomma}}</dd>
                         {% empty %}
                         <dt>{% trans "No donations" %}</dt><dd></dd>
                         {% endfor %}
                         {% if project.all_donations %}
-                        <dt class="totalFinance">{% trans "Total" %}:</dt><dd class="totalFinance currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.all_donations_amount_received|floatformat:2|intcomma}}</dd>
+                        <dt class="totalFinance">{% trans "Total" %}:</dt><dd class="totalFinance currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.all_donations_amount_received|floatformat:0|intcomma}}</dd>
                         {% endif %}
                     </dl>
                 </div>
+                <div class="col-sm-4">
+                    <h4 class="">{% trans "Project funding" %}:</h4>
+                    <dl class="dl-horizontal">
+                        <dt>{% trans "Current funders" %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{% if pledged %}{{pledged|floatformat:0|intcomma}}{% else %}0{% endif %}</dd>
+                        <dt>{% trans "Donations" %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{% if project.all_donations_amount_received %}{{project.all_donations_amount_received|floatformat:0|intcomma}}{% else %}0{% endif %}</dd>
+                        <hr>
+                        <dt>{% trans "Total funded" %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.funds|floatformat:0|intcomma}}</dd>
+                        <dt>{% trans "Project budget" %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{project.budget|floatformat:0|intcomma}}</dd>                        
+                        <dt class="totalFinance">{% trans "Funds needed" %}:</dt>
+                        <dd class="totalFinance currencyAmount">
+                            <span class="currency"> {{project.get_currency_display}}</span>{% if project.funds_needed >= 0 %}{{project.funds_needed|floatformat:0|intcomma}}{% else %}0{% endif %}
+                        </dd>
+                    </dl>
+                </div>                
 			</div>
 			<div class="row verticalPadding">
 	    		<h4 class="">{% trans "Project transactions" %}:</h4>
                 {% if project.transactions.all %}
                 <dl class="dl-horizontal">
                     {% for transaction in project.transactions.all %}
-                    <dt>{% if transaction.description %}{{transaction.description}}{% else %}{{transaction.iati_transaction_type}}{% endif %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{transaction.value|floatformat:2|intcomma}}</dd>
+                    <dt>{% if transaction.description %}{{transaction.description}}{% else %}{{transaction.iati_transaction_type}}{% endif %}:</dt><dd class="currencyAmount"><span class="currency">{{project.get_currency_display}}</span>{{transaction.value|floatformat:0|intcomma}}</dd>
                     {% endfor %}
                 </dl>
                 {% else %}

diff --git a/akvo/templates/project_main.html b/akvo/templates/project_main.html
@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 {% load compressed i18n rsr_utils %}
-{% load rsr_filters %}
+{% load rsr_filters humanize %}
 {% block title %}{{project.title}}{% endblock title%}
 {% block head_js %}
 <link rel="stylesheet" type="text/css" href="http://cdn.knightlab.com/libs/timeline/latest/css/timeline.css">
@@ -71,7 +71,8 @@
               {% if project.accepts_donations %}
                 <li class="donateSection text-center topMargin">
                   <dl class="dl-horizontal">
-                    <dt class="totalBudgetLabel">{% trans 'Budget Needed' %}:</dt><dd class="currencyAmount">{{project.get_currency_display}}{{project.funds_needed}}</dd>
+                    <dt class="totalBudgetLabel">{% trans 'Total Budget' %}:</dt><dd class="currencyAmount">{{project.get_currency_display}}{{project.budget|floatformat|intcomma}}</dd>                 
+                    <dt class="totalBudgetLabel">{% trans 'Funds Needed' %}:</dt><dd class="currencyAmount">{{project.get_currency_display}}{{project.funds_needed|floatformat|intcomma}}</dd>
                   </dl>
                   <a href="{% url 'project-donate' project.id %}" class="btn btn-primary donateButton">{% trans "Donate" %}</a>
                 </li>
@@ -137,12 +138,12 @@ <h4 class="detailedInfo">{% trans 'Latest project updates' %}</h4>
             "actual_text": "{% trans 'actual' %}",
             "target_text": "{% trans 'target' %}",
             "background_text": "{% trans 'Background' %}",
-            "current_situation_text": "{% trans 'Current situation' %}",
+            "current_situation_text": "{% trans 'Situation at start of project' %}",
             "goals_overview_text": "{% trans 'Goals overview' %}",
             "project_plan_text": "{% trans 'Project plan' %}",
             "sustainability_text": "{% trans 'Sustainability' %}",
             "target_group_text": "{% trans 'Target group' %}",
-            "results_text": "{% trans 'Results' %}"
+            "results_text": "{% trans 'Results and indicators' %}"
         }
     </script>
 

diff --git a/akvo/templates/project_report.html b/akvo/templates/project_report.html
@@ -5,7 +5,7 @@
 {% block title %}{{project.title}} - {% trans "Report" %}{% endblock %}
 
 {% block maincontent %}
-<article class="touch-navbar project-container">
+<article class="touch-navbar project-container projectReport">
     {% include "partials/project_header.html" %}
     <div class="container">
             <div class="row">
@@ -118,7 +118,7 @@ <h4>{% trans "Descriptions" %}</h4>
                         <td>{{project.background}}</td>
                     </tr>
                     <tr>
-                        <th scope="row">{% trans "Current Situation" %}</th>
+                        <th scope="row">{% trans "Situation at start of project" %}</th>
                         <td>{{project.current_status}}</td>
                     </tr>
                     <tr>
@@ -291,7 +291,11 @@ <h4>{% trans "Product Budget Items" %}</h4>
                     <tbody>
                         {% for budget_item in project.budget_items.all %}
                         <tr>
-                            <td>{{budget_item.label}}</td>
+                            {% if 'other' in budget_item.label.label and budget_item.other_extra %}
+                                <td>{{budget_item.other_extra}}</td>
+                            {% else %}
+                                <td>{{budget_item.label}}</td>
+                            {% endif %}
                             <td>{{budget_item.iati_type}}</td>
                             <td>{{budget_item.amount}}</td>
                             <td>{{budget_item.iati_currency}}</td>
@@ -491,7 +495,7 @@ <h4>{% trans "Indicators" %}</h4>
 
             <h4>{% trans "Reporting Organisation" %}</h4>
             {% with reporting_org=project.reporting_org %}
-            <table class="table table-striped table-bordered table-responsive">
+            <table class="table table-striped table-bordered table-responsive reportingOrganisation">
                 <tbody>
                     <tr>
                         <th scope="row">{% trans "Name" %}</th>
@@ -515,7 +519,7 @@ <h4>{% trans "Reporting Organisation" %}</h4>
 
             <h4>{% trans "Participating Organisations" %}</h4>
             {% for partner, info in project.partners_info.items %}
-            <table class="table table-striped table-bordered table-responsive">
+            <table class="table table-striped table-bordered table-responsive participatingOrganisations">
                 <tbody>
                     <tr>
                         <th scope="row">{% trans "Name" %}</th>
@@ -623,5 +627,6 @@ <h4>{% trans "Additional Details" %}</h4>
 
         </div>
 </div>
+{% include "partials/project_footer.html" %}
 </article>
 {% endblock %}