Browse Source

Templates improvement:
- Hide menu if user isn't authenticated
- Newcomers invitation and password reset on login page

Fabs 10 years ago
parent
commit
a5d0a1ebd2

+ 44 - 24
coin/members/templates/members/login.html

@@ -1,34 +1,54 @@
 {% extends "base.html" %}
-
-{% block sidenav %}
-     
-{% endblock %}
+{% load i18n %}
 
 {% block content %}
 
 <div class="row">
-    <h2>Connexion</h2>
-    {% if form.errors %}
-	<p>Your username and password didn't match. Please try again.</p>
-	{% endif %}
+    <div class="medium-7 columns">
+        <h2>Connexion</h2>
+
+        <form method="post" action="{% url 'members:django.contrib.auth.views.login' %}">
+            {% csrf_token %}
+            {% if form.errors %}
+        	<div class="alert-box alert">
+                {% if form.errors.items|length == 1 %}
+                    {% trans "Please correct the error below." %}{% else %}{% trans "Please correct the errors below." %}
+                {% endif %}<br/>
+                {% for error in form.non_field_errors %}{{ error|escape }}{% endfor %}
+            </div>
+        	{% endif %}
 
-	<form method="post" action="{% url 'members:django.contrib.auth.views.login' %}">
-    	{% csrf_token %}
-    	<table>
-    	<tr>
-    		<td>{{ form.username.label_tag }}</td>
-    		<td>{{ form.username }}</td>
-    	</tr>
-    	<tr>
-    		<td>{{ form.password.label_tag }}</td>
-    		<td>{{ form.password }}</td>
-    	</tr>
-    	</table>
+        	<table width="100%">
+            	<tr>
+            		<td>{{ form.username.label_tag }}</td>
+            		<td>{{ form.username }}
+                        {% if form.username.errors %}
+                            <span class="error">{% for error in form.username.errors %}{{ error|escape }}{% endfor %}</span>
+                        {% endif %}
+                    </td>
+            	</tr>
+            	<tr>
+            		<td>{{ form.password.label_tag }}
+                    <small><a href="{% url 'members:password_reset' %}">Mot de passe oublié ?</a></small></td>
+            		<td>{{ form.password }}
+                        {% if form.password.errors %}
+                            <span class="error">{% for error in form.password.errors %}{{ error|escape }}{% endfor %}</span>
+                        {% endif %}
+                    </td>
+            	</tr>
+        	</table>
+        	<input type="submit" value="Coinnexion" class="button radius"/>
+        	<input type="hidden" name="next" value="{{ next }}" />
+    	</form>
+    </div>
+    <div class="medium-5 columns">
+        <div class="panel callout" id="newcomers">
+            <h3>Nouvel adhérent ?</h3>
+            <p>Pour votre première connexion, il faut définir votre mot de passe.<br />
+            <a href="{% url 'members:password_reset' %}">▶ Initialiser mon mot de passe</a></p>
+        </div>
+    </div>
 
-    	<input type="submit" value="Connexion" class="button radius"/>
-    	<input type="hidden" name="next" value="{{ next }}" />
-	</form>
-    <a href="{% url 'members:password_reset'%}">(Ré)initialiser son mot de passe</a>
 </div>
 
 {% endblock %}

+ 31 - 43
coin/members/templates/members/registration/password_change_form.html

@@ -2,59 +2,47 @@
 {% load i18n static %}
 
 {% block content %}
-<form action="" method="post">{% csrf_token %}
 <div class="row">
     <div class="large-12 columns">
         <h2>{% trans 'Password change' %}</h2>
-        
-        {% if form.errors %}
-        <div class="alert-box alert">
-            {% if form.errors.items|length == 1 %}{% trans "Please correct the error below." %}{% else %}{% trans "Please correct the errors below." %}{% endif %}
-        </div>
-        {% endif %}
-    </div>
-</div>
-<!-- <div class="row">
-    <div class="large-12 columns">
-        <p>{% trans "Please enter your old password, for security's sake, and then enter your new password twice so we can verify you typed it in correctly." %}</p>
-    </div>
-</div> -->
 
-<div class="row">
-    <div class="large-12 columns">
-        <fieldset class="module aligned wide">
-
-            <label {% if form.old_password.errors %}class="error"{% endif %}>{% trans 'Old password' %}
-                {{ form.old_password }}
-            </label>
-            {% if form.old_password.errors %}
-                <span class="error">{% for error in form.old_password.errors %}{{ error|escape }}{% endfor %}</span>
+        <form action="" method="post">{% csrf_token %}
+            {% if form.errors %}
+            <div class="alert-box alert">
+                {% if form.errors.items|length == 1 %}{% trans "Please correct the error below." %}{% else %}{% trans "Please correct the errors below." %}{% endif %}
+            </div>
             {% endif %}
 
-            <label {% if form.new_password1.errors %}class="error"{% endif %}>{% trans 'New password' %}
-                {{ form.new_password1 }}
-            </label>
-            {% if form.new_password1.errors %}
-                <span class="error">{% for error in form.new_password1.errors %}{{ error|escape }}{% endfor %}</span>
-            {% endif %}
-            
-            <label {% if form.new_password2.errors %}class="error"{% endif %}>{% trans 'Password (again)' %}
-                {{ form.new_password2 }}
-            </label>
-            {% if form.new_password2.errors %}
-                <span class="error">{% for error in form.new_password2.errors %}{{ error|escape }}{% endfor %}</span>
-            {% endif %}
+            <fieldset class="module aligned wide">
 
-        </fieldset>
-    </div>
-</div>
+                <label {% if form.old_password.errors %}class="error"{% endif %}>{% trans 'Old password' %}
+                    {{ form.old_password }}
+                </label>
+                {% if form.old_password.errors %}
+                    <span class="error">{% for error in form.old_password.errors %}{{ error|escape }}{% endfor %}</span>
+                {% endif %}
 
-<div class="row">
-    <div class="large-12 columns">
-        <input type="submit" value="{% trans 'Change my password' %}" class="button radius" />
+                <label {% if form.new_password1.errors %}class="error"{% endif %}>{% trans 'New password' %}
+                    {{ form.new_password1 }}
+                </label>
+                {% if form.new_password1.errors %}
+                    <span class="error">{% for error in form.new_password1.errors %}{{ error|escape }}{% endfor %}</span>
+                {% endif %}
+                
+                <label {% if form.new_password2.errors %}class="error"{% endif %}>{% trans 'Password (again)' %}
+                    {{ form.new_password2 }}
+                </label>
+                {% if form.new_password2.errors %}
+                    <span class="error">{% for error in form.new_password2.errors %}{{ error|escape }}{% endfor %}</span>
+                {% endif %}
+
+            </fieldset>
+
+            <input type="submit" value="{% trans 'Change my password' %}" class="button radius" />
+        </form>
     </div>
 </div>
 
 <script type="text/javascript">document.getElementById("id_old_password").focus();</script>
-</form>
+
 {% endblock %}

+ 1 - 1
coin/members/templates/members/registration/password_reset_complete.html

@@ -10,7 +10,7 @@
 
     <p>{% trans "Your password has been set.  You may go ahead and log in now." %}</p>
 
-    <p><a href="{{ login_url }}">{% trans 'Log in' %}</a></p>
+    <p><a href="{{ login_url }}" class="button radius">{% trans 'Log in' %}</a></p>
 
     </div>
 </div>

+ 7 - 4
coin/members/templates/members/registration/password_reset_done.html

@@ -3,11 +3,14 @@
 
 {% block content %}
 
+<div class="row">
+    <div class="large-12 columns">
+        <h2>Vérifiez votre boîte email</h2>
 
-<h2>Vérifiez votre email</h2>
+        <p>{% trans "We've emailed you instructions for setting your password. You should be receiving them shortly." %}</p>
 
-<p>{% trans "We've emailed you instructions for setting your password. You should be receiving them shortly." %}</p>
-
-<p>{% trans "If you don't receive an email, please make sure you've entered the address you registered with, and check your spam folder." %}</p>
+        <p>{% trans "If you don't receive an email, please make sure you've entered the address you registered with, and check your spam folder." %}</p>
+    </div>
+</div>
 
 {% endblock %}

+ 2 - 6
coin/members/templates/members/registration/password_reset_form.html

@@ -5,13 +5,9 @@
 
 <div class="row">
     <div class="large-12 columns">
-        <h2>{% trans "Password reset" %}</h2>
-        <p>{% trans "Forgotten your password? Enter your email address below, and we'll email instructions for setting a new one." %}</p>
-    </div>
-</div>
+        <h2>Réinitialiser son mot de passe</h2>
+        <p>Nouvel adhérent ? Mot de passe perdu ?<br/>Saisissez l'adresse email de votre compte afin de reçevoir les instruction pour en définir un nouveau.</p>
 
-<div class="row">
-    <div class="large-12 columns">
         {% if form.errors %}
         <div class="alert-box alert">
             {% if form.errors.items|length == 1 %}{% trans "Please correct the error below." %}{% else %}{% trans "Please correct the errors below." %}{% endif %}

+ 32 - 33
coin/templates/base.html

@@ -1,7 +1,7 @@
 <!doctype html>
 {% load staticfiles %}
 <html class="no-js" lang="en">
-  <head>
+<head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>{% block title %}COIN - Illyse SI{% endblock %}</title>
@@ -12,44 +12,43 @@
     <script src="{% static "js/illyse.js" %}"></script>
     <link rel="icon" type="image/png" href="{% static "img/coinitem.png" %}"/>
     <link rel="icon" type="image/x-icon" href="{% static "img/favicon.ico" %}" />
-  </head>
-  <body class="off-canvas-wrap">
-
-  <div class="large-12 columns inner-wrap">
-   <header class="row">
+</head>
+<body class="off-canvas-wrap">
+<div class="row">
+    <div class="large-12 columns inner-wrap">
+    <header>
        <h1><a href="{% url 'home' %}">COIN est un Outil pour un Internet Neutre</a></h1>
-   </header>
-    <p class="show-for-small">
+    </header>
+    
+    {% if user.is_authenticated %}
+    <div class="show-for-small">
         <a class="left-off-canvas-toggle button">Menu</a>
-    </p>
+        <aside class="left-off-canvas-menu">
+            <ul class="off-canvas-list">
+                <li><label>Navigation</label></li>
+                {% include "menu_items.html" %}
+            </ul>
+        </aside>
+    </div>
+    {% endif %}
 
-   <div class="row">
-       <div class="large-3 columns">
-        {% block sidenav %}
+    <div class="row">
         {% if user.is_authenticated %}
-        <nav id="sidebox" class="hide-for-small">
-         <ul class="side-nav">
-             {% include "menu_items.html" %}
-         </ul>
-         </nav>
-         {% endif %}
-         {% endblock %}
-         &nbsp;
-       </div>
-
-        <div class="large-9 columns">
-        {% block content %}{% endblock %}
+        <div class="large-3 columns">
+            {% block sidenav %}
+            <nav id="sidebox" class="hide-for-small">
+            <ul class="side-nav">
+                {% include "menu_items.html" %}
+            </ul>
+            </nav>
+            {% endblock %}
+        </div>
+        {% endif %}
+        
+        <div class="large-{% if user.is_authenticated %}9{% else %}12{% endif %} columns">
+            {% block content %}{% endblock %}
         </div>
     </div>
-    {% if user.is_authenticated %}
-    <aside class="left-off-canvas-menu">
-        <ul class="off-canvas-list">
-            <li><label>Navigation</label></li>
-            {% include "menu_items.html" %}
-        </ul>
-    </aside>
-    {% endif %}
-
 
     <div id="footer">
         {% block footer %}