xevion/v1.xevion.dev
1
0
Fork 0
mirror of https://github.com/Xevion/v1.xevion.dev.git synced 2025-12-10 10:09:11 -06:00
Code Issues Packages Projects Releases Wiki Activity

added sign-up, tweaked jinja macro flashes and message display

Browse Source
This commit is contained in:
Xevion
2019-07-02 14:10:11 -05:00
parent 60c499d471
commit 3cc7e46aaf
8 changed files with 177 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
app/templates/base.html
View File

@@ -1,3 +1,21 @@
{#
Title = Title of the Message Box
Text = Text inside the Message Box
Color = Bulma Color Type of the Message Box
#}
{% macro flash(title, text, color) -%}
<article class="message is-small {{ color }}">
<div class="message-header">
<span class="fas fa-exclamation-triangle"></span>
{{ title }}
<button id="message-box-delete" class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
{{ text }}
</div>
</article>
{%- endmacro %}
<!DOCTYPE html>
<html lang="en">
@@ -12,7 +30,8 @@
{% block head %}
<link href="https://fonts.googleapis.com/css?family=Raleway&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.5/css/bulma.min.css">
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
<style type="text/css">
/* Single line word breaking for content */
@@ -24,6 +43,11 @@
font-family: 'Raleway', sans-serif;
font-size: 1.75rem;
}
.is-vertical-center {
vertical-align: middle;
padding: 1rem;
}
</style>
{% endblock head %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma-divider@2.0.1/dist/css/bulma-divider.min.css">
@@ -53,25 +77,43 @@
</div>
<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
{% block navbarend %}
{% if current_user.is_anonymous %}
{% if not hideSignup %}
<a href="{{ url_for('signup') }}" class="button is-outlined is-info">Signup</a>
{% endif %}
{% if not hideLogin %}
<a href="{{ url_for('login') }}" class="button is-outlined is-info">Login</a>
{% endif %}
{% block navbarend %}
<div id="navbar-dropdown" class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link is-mobile">
<figure style="padding: 0.5rem;" class="image is-48x48">
{% set default = 'https://via.placeholder.com/256' %}
<img class=""
src="{{ current_user.profile_picture or default if current_user.is_authenticated else default }}">
</figure>
<strong>
Hello, {{ current_user.username if current_user.is_authenticated else 'Anonymous' }}
</strong>
</a>
<div class="navbar-dropdown">
{% if current_user.is_authenticated %}
{# <a class="navbar-item" href="{{ url_for('profile') }}">
Profile
</a> #}
<a class="navbar-item" href="{{ get_hidden() }}">
Hidden
</a>
<hr class="navbar-divider">
<a class="navbar-item" href="{{ url_for('logout') }}">
Logout
</a>
{% else %}
<a href="{{ url_for('logout') }}" class="button is-outlined is-info">Logout</a>
<a class="navbar-item" href="{{ url_for('login') }}">
Login
</a>
<a class="navbar-item" href="{{ url_for('register') }}">
Register
</a>
{% endif %}
{% endblock navbarend %}
</div>
</div>
{% endblock navbarend %}
</div>
</div>
</nav>

2
app/templates/hidden.html
View File

@@ -99,7 +99,7 @@
<div class="card">
<div class="card-header">
<div class="card-header-title">
Image #{{ image.index }} <a href="{{ image.view }}"><sup class="sup">source</sup></a>
Image #{{ image.index }}<a href="{{ image.view }}"><sup class="sup">(source)</sup></a>
</div>
</div>
<div class="card-image">

23
app/templates/login.html
View File

@@ -1,17 +1,5 @@
{% extends 'base.html' %}
{% macro error(text, title='Error') -%}
<article class="message is-small is-danger">
<div class="message-header">
<p>{{ title }}</p>
<button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
{{ text }}
</div>
</article>
{%- endmacro %}
{% block body %}
<!-- Login Section -->
<section class="section section-padding">
@@ -26,14 +14,19 @@
<div class="card-content">
{% with messages = get_flashed_messages() %}
{% for message in messages %}
{{ error(message, title='Error - Login Error') }}
{% if category == 'error' %}
{{ flash(title='Error - Login Error', text=message, color='is-danger') }}
{% else %}
{# Will work fine for most other flashed messages #}
{{ flash(title='Info', text=message, color='is-info' )}}
{% endif %}
{% endfor %}
{% endwith %}
{% for formerror in form.username.errors %}
{{ error(formerror, title='Error - Username') }}
{{ flash(title='Error - Username', text=formerror, color='is-danger') }}
{% endfor %}
{% for formerror in form.password.errors %}
{{ error(formerror, title='Error - Password') }}
{{ flash(title='Error - Password', text=formerror, color='is-danger') }}
{% endfor %}
<!-- Sign-in Form-->
<form action="" method="post" novalidate>

50
app/templates/signup.html → app/templates/register.html
View File

@@ -14,14 +14,23 @@
<div class="card-content">
{% with messages = get_flashed_messages() %}
{% for message in messages %}
{{ error(message, title='Error - Login Error') }}
{{ flash(title='Error - Registration Error', text=formerror, color='is-danger') }}
{% endfor %}
{% endwith %}
{% for formerror in form.username.errors %}
{{ error(formerror, title='Error - Username') }}
{{ flash(title='Error - Username', text=formerror, color='is-danger') }}
{% endfor %}
{% for formerror in form.email.errors %}
{{ flash(title='Error - Email', text=formerror, color='is-danger') }}
{% endfor %}
{% for formerror in form.password.errors %}
{{ error(formerror, title='Error - Password') }}
{{ flash(title='Error - Password', text=formerror, color='is-danger') }}
{% endfor %}
{% for formerror in form.password2.errors %}
{{ flash(title='Error - Repeat Password', text=formerror, color='is-danger') }}
{% endfor %}
<!-- Sign-in Form-->
<form action="" method="post" novalidate>
@@ -32,28 +41,42 @@
<p class="control has-icons-left">
{{ form.username(size=32, class_="input", placeholder="Username") }}
<span class="icon is-small is-left">
<i class="fas fa-lock"></i>
<i class="fas fa-user"></i>
</span>
</p>
<!-- Password Field -->
</div>
<!-- Email Field -->
<div class="field">
{{ form.password.label }}
{{ form.email.label }}
<p class="control has-icons-left">
{{ form.password(size=32, class_="input", placeholder="Password") }}
{{ form.email(size=64, class_="input", placeholder="Email Address") }}
<span class="icon is-small is-left">
<i class="fas fa-envelope"></i>
</span>
</p>
</div>
<!-- Password Field -->
<div class="field">
{{ form.password.label }}
<p class="control has-icons-left">
{{ form.password(size=32, class_="input", placeholder="Password") }}
<span class="icon is-small is-left">
<i class="fas fa-lock"></i>
</span>
</p>
</div>
<!-- Password2 Field -->
<div class="field">
{{ form.password2.label }}
<p class="control has-icons-left">
{{ form.password2(size=32, class_="input", placeholder="Repeat Password") }}
<span class="icon is-small is-left">
<i class="fas fa-lock"></i>
</span>
</p>
</div>
<!-- Checkbox/Button Field -->
<div class="columns is-mobile is-vcentered is-centered">
<!-- Remember Me Checkbox Field -->
<div class="column is-6">
<label class="checkbox">
{{ form.remember_me(class_="checkbox") }} {{ form.remember_me.label }}</p>
<label>
</div>
<div class="column is-2"></div>
<!-- Submit Button Field -->
<div class="column is-4">
@@ -71,5 +94,4 @@
</div>
</section>
<!-- End Login Section -->
{% endblock body %}