From 3d7ab656e106f060dec9fabb76f900389ed0c760 Mon Sep 17 00:00:00 2001
From: Brice Maron <brice@bmaron.net>
Date: Tue, 20 Aug 2019 23:34:30 +0200
Subject: Rework invite people to project

---
 ihatemoney/templates/forms.html        | 13 +++---
 ihatemoney/templates/list_bills.html   | 73 +++++++++++++++++++---------------
 ihatemoney/templates/send_invites.html | 26 ++++++++----
 3 files changed, 66 insertions(+), 46 deletions(-)

(limited to 'ihatemoney/templates')

diff --git a/ihatemoney/templates/forms.html b/ihatemoney/templates/forms.html
index 57f9440..a64e205 100644
--- a/ihatemoney/templates/forms.html
+++ b/ihatemoney/templates/forms.html
@@ -1,4 +1,4 @@
-{% macro input(field, multiple=False, class='form-control', inline=False) -%}
+{% macro input(field, multiple=False, class='form-control', inline=False, placeholder='') -%}
     <div class="form-group{% if inline %} row{% endif %}">
     {% if field.type != "SubmitField" %}
         {% if inline %}
@@ -9,9 +9,9 @@
     {% endif %}
         <div class="controls{% if inline %} col-9{% endif %}">
         {% if multiple == True %}
-            {{ field(multiple=True, class=class) }}
+            {{ field(multiple=True, class=class, placeholder=placeholder) }}
         {% else %}
-            {{ field(class=class) | safe }}
+            {{ field(class=class, placeholder=placeholder) | safe }}
         {% endif %}
         {% if field.description %}
             <p class="help-inline">{{ field.description }}</p>
@@ -119,8 +119,8 @@
 {{ form.hidden_tag() }}
     {% include "display_errors.html" %}
     <div class="input-group">
-        <label class="sr-only" for="name">_("Type user name here")</label>
-        {{ form.name(placeholder=_("Type user name here"), class="form-control") }}
+        <label class="sr-only" for="name">_("Add participant")</label>
+        {{ form.name(placeholder=_("Add participant"), class="form-control") }}
         <div class="input-group-append">
             <button class="btn btn-outline-secondary input-group-addon" type="submit">{{ _("Add") }}</button>
         </div>
@@ -143,10 +143,9 @@
 
 {% macro invites(form) %}
     {{ form.hidden_tag() }}
-    {{ input(form.emails) }}
+    {{ input(form.emails, placeholder=_('john.doe@example.com, mary.moe@site.com')) }}
     <div class="actions">
         <button class="btn btn-primary">{{ _("Send the invitations") }}</button>
-        <a href="{{ url_for(".list_bills") }}">{{ _("No, thanks") }}</a>
     </div>
 {% endmacro %}
 
diff --git a/ihatemoney/templates/list_bills.html b/ihatemoney/templates/list_bills.html
index 6ccf0a0..367d2ee 100644
--- a/ihatemoney/templates/list_bills.html
+++ b/ihatemoney/templates/list_bills.html
@@ -45,43 +45,52 @@
 {% endblock %}
 
 {% block sidebar %}
-    <form id="add-member-form" action="{{ url_for(".add_member") }}" method="post" class="form-inline">
-        {{ forms.add_member(member_form) }}
-    </form>
+    <div class="sidebar_content">
+        <form id="add-member-form" action="{{ url_for(".add_member") }}" method="post">
+            {{ forms.add_member(member_form) }}
+        </form>
 
-    <div id="table_overflow">
-    <table class="balance table">
-    {% set balance = g.project.balance %}
-    {% for member in g.project.members | sort(attribute='name') if member.activated or balance[member.id]|round(2) != 0 %}
-    <tr id="bal-member-{{ member.id }}" action={% if member.activated %}delete{% else %}reactivate{% endif %}>
-        <td class="balance-name">{{ member.name }}
-            <span class="light{% if not g.project.uses_weights %} extra-info{% endif %}">(x{{ member.weight|minimal_round(1) }})</span>
-        </td>
-        {% if member.activated %}
-        <td>
-            <form class="action delete" action="{{ url_for(".remove_member", member_id=member.id) }}" method="POST">
-                <button type="submit">{{ _("deactivate") }}</button></form>
-            <form class="action edit" action="{{ url_for(".edit_member", member_id=member.id) }}" method="GET">
-                <button type="submit">{{ _("edit") }}</button></form>
-        </td>
-        {% else %}
-        <td>
-            <form class="action reactivate" action="{{ url_for(".reactivate", member_id=member.id) }}" method="POST">
-                <button type="submit">{{ _("reactivate") }}</button></form></td>
-        {% endif %}
-        <td class="balance-value {% if balance[member.id]|round(2) > 0 %}positive{% elif balance[member.id]|round(2) < 0 %}negative{% endif %}">
-            {% if balance[member.id]|round(2) > 0 %}+{% endif %}{{ "%.2f" | format(balance[member.id]) }}
-        </td>
-    </tr>
-    {% endfor %}
-    </table>
+        <div id="table_overflow">
+        <table class="balance table">
+        {% set balance = g.project.balance %}
+        {% for member in g.project.members | sort(attribute='name') if member.activated or balance[member.id]|round(2) != 0 %}
+        <tr id="bal-member-{{ member.id }}" action={% if member.activated %}delete{% else %}reactivate{% endif %}>
+            <td class="balance-name">{{ member.name }}
+                <span class="light{% if not g.project.uses_weights %} extra-info{% endif %}">(x{{ member.weight|minimal_round(1) }})</span>
+            </td>
+            {% if member.activated %}
+            <td>
+                <form class="action delete" action="{{ url_for(".remove_member", member_id=member.id) }}" method="POST">
+                    <button type="submit">{{ _("deactivate") }}</button></form>
+                <form class="action edit" action="{{ url_for(".edit_member", member_id=member.id) }}" method="GET">
+                    <button type="submit">{{ _("edit") }}</button></form>
+            </td>
+            {% else %}
+            <td>
+                <form class="action reactivate" action="{{ url_for(".reactivate", member_id=member.id) }}" method="POST">
+                    <button type="submit">{{ _("reactivate") }}</button></form></td>
+            {% endif %}
+            <td class="balance-value {% if balance[member.id]|round(2) > 0 %}positive{% elif balance[member.id]|round(2) < 0 %}negative{% endif %}">
+                {% if balance[member.id]|round(2) > 0 %}+{% endif %}{{ "%.2f" | format(balance[member.id]) }}
+            </td>
+        </tr>
+        {% endfor %}
+        </table>
+        </div>
+    </div>
+    <div class="identifier">
+        <a class="btn btn-secondary btn-block" href="{{ url_for('.invite') }}">
+            <i class="icon icon-white paper-plane">{{ static_include("images/paper-plane.svg") | safe }}</i>
+            {{ _("Invite people") }}
+        </a>
     </div>
 {% endblock %}
 
 {% block content %}
-<div class="identifier"><a class="btn btn-link" href="{{ url_for(".invite") }}">{{ _("Invite people to join this project!") }}</a></div>
-<a id="new-bill" href="{{ url_for(".add_bill") }}" class="btn btn-primary" data-toggle="modal" data-target="#bill-form">{{ _("Add a new bill") }}</a>
-
+    <a id="new-bill" href="{{ url_for('.add_bill') }}" class="btn btn-primary float-right" data-toggle="modal" data-target="#bill-form">
+        <i class="icon icon-white plus">{{ static_include("images/plus.svg") | safe }}</i>
+        {{ _("Add a new bill") }}
+    </a>
     <div id="bill-form" class="modal fade show" role="dialog">
         <div class="modal-dialog" role="document">
             <div class="modal-content">
diff --git a/ihatemoney/templates/send_invites.html b/ihatemoney/templates/send_invites.html
index cd96380..d64021b 100644
--- a/ihatemoney/templates/send_invites.html
+++ b/ihatemoney/templates/send_invites.html
@@ -1,15 +1,27 @@
 {% extends "layout.html" %}
 
 {% block content %}
-<h2>{{ _("Invite people to join this project") }}</h2>
+<h1>{{ _("Invite people to join this project") }}</h1>
+
+<h3>{{ _('Share Identifier & code') }}</h3>
+<p>
+    {{ _("You can share the project identifier and the private code by any communication means.") }}
+    <br />
+    <strong>{{ _('Identifier:') }}</strong> <a href="{{ url_for("main.list_bills", project_id=g.project.id) }}">{{ g.project.id }}</a>
+</p>
+
+<h3>{{ _('Share the Link') }}</h3>
+<p>{{ _("You can directly share the following link via your prefered medium") }}</br>
+    <a href="{{ url_for(".authenticate", _external=True, token=g.project.generate_token()) }}">
+        {{ url_for(".authenticate", _external=True, token=g.project.generate_token()) }}
+    </a>
+</p>
+
+<h3>{{ _('Send via Emails') }}</h3>
 <p>{{ _("Specify a (comma separated) list of email adresses you want to notify about the
 creation of this budget management project and we will send them an email for you.") }}</p>
-<p>{{ _("If you prefer, you can share the project identifier and the shared
-password by other communication means. Or even directly share the following link:") }}</br>
-<a href="{{ url_for(".authenticate", _external=True, token=g.project.generate_token()) }}">
-    {{ url_for(".authenticate", _external=True, token=g.project.generate_token()) }}
-</a>
-</p>
+
+
 
 {% include "display_errors.html" %}
 <form class="invites form-horizontal" method="post" accept-charset="utf-8">
-- 
cgit v1.1