Changement du style des formulaires. Le form de login est ajouté automatiquement au rendu.

This commit is contained in:
Dark-Storm 2019-02-03 01:11:03 +01:00
parent 52fba7be4d
commit 2f848501fe
Signed by untrusted user: Darks
GPG Key ID: F61F10FA138E797C
8 changed files with 222 additions and 148 deletions

View File

@ -1,6 +1,6 @@
from flask_login import current_user
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, BooleanField, TextAreaField, SubmitField
from wtforms import StringField, PasswordField, BooleanField, TextAreaField, SubmitField, FileField
from wtforms.fields.html5 import DateField
from wtforms.validators import ValidationError, DataRequired, Optional, Email, EqualTo
from app.models.users import Member
@ -48,6 +48,7 @@ class RegistrationForm(FlaskForm):
submit = SubmitField('S\'enregistrer')
class UpdateAccountForm(FlaskForm):
avatar = FileField('Avatar :', validators=[])
email = StringField('Adresse Email :', validators=[Optional(), Email(), validate_email])
password = PasswordField('Mot de passe :', validators=[Optional(), validate_password])
password2 = PasswordField('Répéter le mot de passe', validators=[Optional(), EqualTo('password')])

View File

@ -5,23 +5,33 @@ from app import app, db
from app.forms import LoginForm, RegistrationForm, UpdateAccountForm
from app.models.users import Member
# Ce truc c'est la vie !
def _render_template(*args, **kwargs):
# TODO: debugguer cette merde : au logout, ça foire
# if current_user.is_authenticated:
# login_form = LoginForm()
# return render_template(*args, **kwargs, login_form=login_form)
# return render_template(*args, **kwargs)
login_form = LoginForm()
return render_template(*args, **kwargs, login_form=login_form)
@app.route('/')
def index():
login_form = LoginForm()
return render_template('index.html', login_form=login_form)
return _render_template('index.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
if request.method == 'GET':
return redirect(url_for('index'))
login_form = LoginForm()
if form.validate_on_submit():
member = Member.query.filter_by(username=form.username.data).first()
if member is None or not member.check_password(form.password.data):
if login_form.validate_on_submit():
member = Member.query.filter_by(username=login_form.username.data).first()
if member is None or not member.check_password(login_form.password.data):
flash('Pseudo ou mot de passe invalide', 'error')
return redirect(request.referrer)
login_user(member, remember=form.remember_me.data)
login_user(member, remember=login_form.remember_me.data)
flash('Connexion réussie', 'info')
return redirect(request.referrer)
@ -37,43 +47,40 @@ def account():
if not current_user.is_authenticated:
flash('Veuillez vous authentifier', 'warning')
return redirect(url_for('index'))
login_form = LoginForm()
form2 = UpdateAccountForm()
form = UpdateAccountForm()
if request.method == "POST":
if form2.validate_on_submit():
if form.validate_on_submit():
current_user.update(
email = form2.email.data,
password = form2.password.data,
signature = form2.signature.data,
biography = form2.biography.data,
birthday = form2.birthday.data,
receive_newsletter = form2.newsletter.data)
email = form.email.data,
password = form.password.data,
signature = form.signature.data,
biography = form.biography.data,
birthday = form.birthday.data,
receive_newsletter = form.newsletter.data)
db.session.add(current_user)
db.session.commit()
flash('Modifications effectuées', 'ok')
else:
flash('Erreur lors de la modification', 'error')
return render_template('account.html', login_form=login_form, form2=form2)
return _render_template('account.html', form=form)
@app.route('/register', methods=['GET', 'POST'])
def register():
if current_user.is_authenticated:
return redirect(url_for('index'))
login_form = LoginForm()
form2 = RegistrationForm()
if form2.validate_on_submit():
member = Member(form2.username.data, form2.email.data, form2.password.data)
form = RegistrationForm()
if form.validate_on_submit():
member = Member(form.username.data, form.email.data, form.password.data)
member.biography = ""
member.signature = ""
db.session.add(member)
db.session.commit()
flash('Inscription réussie', 'ok')
return redirect(url_for('validation'))
return render_template('register.html', title='Register', login_form=login_form, form2=form2)
return _render_template('register.html', title='Register', form=form)
@app.route('/register/validation/')
def validation():
if current_user.is_authenticated :
return redirect(url_for('index'))
login_form = LoginForm()
return render_template('validation.html', login_form=login_form)
return _render_template('validation.html')

View File

@ -7,6 +7,7 @@ section {
}
section h1 {
margin-top: 0;
border-bottom: 1px solid #a0a0a0;
font-family: Raleway; font-size: 32px;
font-weight: 200; color: #242424;
@ -23,5 +24,3 @@ section h1 {
font-family: Raleway; font-size: 20px;
font-weight: 200; color: #242424;
} */

61
app/static/css/form.css Normal file
View File

@ -0,0 +1,61 @@
.form {
min-width: 350px;
margin: 20px auto 0; padding: 20px;
background: #ffffff;
border: 1px solid #dddddd; border-radius: 5px;
}
.form .avatar {
display: inline-block; vertical-align: middle;
border-radius: 100%;
width: 150px; height: 150px;
}
.form input[type="file"] {
display: inline-block; margin-left: 20px;
vertical-align: middle;
}
.form form > div:not(:last-child) {
margin-bottom: 15px;
}
.form form label {
display: inline-block;
margin-bottom: 5px;
}
.form input[type='text'],
.form input[type='email'],
.form input[type='date'],
.form input[type='password'],
.form textarea {
display: block;
width: 100%; padding: 6px 2.5%;
border: 1px solid #abcdef;
}
.form input[type='text']:focus,
.form input[type='email']:focus,
.form input[type='date']:focus,
.form input[type='password']:focus,
.form textarea:focus {
box-shadow: 0 0 4px rgba(0, 102, 255, .9);
}
.form input[type="submit"] {
width: 100%;
background-color: #149641;
border-color: #0e692d;
color: #ffffff;
}
.form input[type="submit"]:hover,
.form input[type="submit"]:focus,
.form input[type="submit"]:active {
background-color: #0f7331;
border-color: #073617;
}
.form form .msgerror {
color: red;
font-weight: 400;
margin-top: 5px;
}

View File

@ -1,71 +1,77 @@
{% extends "base/container.html" %}
{% block content %}
<section class="home-pinned-content flex">
<div id="register">
<h1>Gestion du compte :</h1>
<section class="form" style="width:80%;">
<h1>Gestion du compte :</h1>
<form action="" method="post">
{{ form2.hidden_tag() }}
<form action="" method="post">
{{ form.hidden_tag() }}
<div>
{{ form.avatar.label }}
<div>
{{ form2.email.label }}
{{ form2.email(placeholder=current_user.email) }}
{% for error in form2.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
<img class="avatar" src="{{ url_for('static', filename= 'images/3864.png') }}" />
{{ form.avatar }}
</div>
<div>
{{ form2.password.label }}
{{ form2.password(placeholder='************') }}
{% for error in form2.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.password2.label }}
{{ form2.password2(placeholder='************') }}
{% for error in form2.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.birthday.label }}
{{ form2.birthday(value=current_user.birthday) }}
{% for error in form2.birthday.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.signature.label }}
<textarea id="{{ form2.signature.name }}" name="{{ form2.signature.name }}">{{ current_user.signature }}</textarea>
{% for error in form2.signature.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.biography.label }}
<textarea id="{{ form2.biography.name }}" name="{{ form2.biography.name }}">{{ current_user.biography }}</textarea>
{% for error in form2.biography.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.newsletter.label }}
{{ form2.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form2.newsletter.description }}</div>
{% for error in form2.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.old_password.label }}
{{ form2.old_password(placeholder='************') }}
{% for error in form2.old_password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form2.submit(class_="bg-green") }}</div>
</form>
</div>
</div>
<div>
{{ form.email.label }}
{{ form.email(placeholder=current_user.email) }}
{% for error in form.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password.label }}
{{ form.password(placeholder='************') }}
{% for error in form.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password2.label }}
{{ form.password2(placeholder='************') }}
{% for error in form.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.birthday.label }}
{{ form.birthday(value=current_user.birthday) }}
{% for error in form.birthday.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.signature.label }}
<textarea id="{{ form.signature.name }}" name="{{ form.signature.name }}">{{ current_user.signature }}</textarea>
{% for error in form.signature.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.biography.label }}
<textarea id="{{ form.biography.name }}" name="{{ form.biography.name }}">{{ current_user.biography }}</textarea>
{% for error in form.biography.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.newsletter.label }}
{{ form.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form.newsletter.description }}</div>
{% for error in form.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.old_password.label }}
{{ form.old_password(placeholder='************') }}
{% for error in form.old_password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form.submit(class_="bg-green") }}</div>
</form>
</section>
{% endblock %}

View File

@ -8,6 +8,7 @@
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/navbar.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/header.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/container.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/form.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/footer.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/flash.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/responsive.css')}}>

View File

@ -3,23 +3,23 @@
{% block content %}
<h1>Sign In</h1>
<form action="" method="post">
{{ form.hidden_tag() }}
{{ login_form.hidden_tag() }}
<p>
{{ form.username.label }}<br>
{{ form.username(size=32) }}<br>
{% for error in form.username.errors %}
{{ login_form.username.label }}<br>
{{ login_form.username(size=32) }}<br>
{% for error in login_form.username.errors %}
<span style="color: red;">[{{ error }}]</span>
{% endfor %}
</p>
<p>
{{ form.password.label }}<br>
{{ form.password(size=32) }}<br>
{% for error in form.password.errors %}
{{ login_form.password.label }}<br>
{{ login_form.password(size=32) }}<br>
{% for error in login_form.password.errors %}
<span style="color: red;">[{{ error }}]</span>
{% endfor %}
</p>
<p>{{ form.remember_me() }} {{ form.remember_me.label }}</p>
<p>{{ form.submit() }}</p>
<p>{{ login_form.remember_me() }} {{ login_form.remember_me.label }}</p>
<p>{{ login_form.submit() }}</p>
</form>
<p>New User? <a href="{{ url_for('register') }}">Click to Register!</a></p>
{% endblock %}

View File

@ -1,57 +1,56 @@
{% extends "base/container.html" %}
{% block content %}
<section class="home-pinned-content flex">
<div id="register">
<h1>Inscription :</h1>
<section class="form" style="width:40%;">
<h1>Inscription :</h1>
<form action="" method="post">
{{ form2.hidden_tag() }}
<div>
{{ form2.username.label }}
{{ form2.username() }}
{% for error in form2.username.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.email.label }}
{{ form2.email() }}
{% for error in form2.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.password.label }}
{{ form2.password() }}
{% for error in form2.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.password2.label }}
{{ form2.password2() }}
{% for error in form2.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.guidelines.label }}
{{ form2.guidelines() }}
{% for error in form2.guidelines.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.newsletter.label }}
{{ form2.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form2.newsletter.description }}</div>
{% for error in form2.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form2.submit(class_="bg-green") }}</div>
</form>
</div>
<form action="" method="post">
{{ form.hidden_tag() }}
<div>
{{ form.username.label }}
{{ form.username() }}
{% for error in form.username.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.email.label }}
{{ form.email() }}
{% for error in form.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password.label }}
{{ form.password() }}
{% for error in form.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password2.label }}
{{ form.password2() }}
{% for error in form.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.guidelines.label }}
{{ form.guidelines() }}
{% for error in form.guidelines.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.newsletter.label }}
{{ form.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form.newsletter.description }}</div>
{% for error in form.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form.submit(class_="bg-green") }}</div>
</form>
</div>
</section>
{% endblock %}