Merge branch 'color_front' into 'beta'

Color front

See merge request bde/nk20!94
This commit is contained in:
erdnaxe 2020-08-21 21:07:24 +02:00
commit 00b07147f6
17 changed files with 406 additions and 282 deletions

View File

@ -1,71 +1,75 @@
{% extends "base.html" %} {% extends "base.html" %}
{% comment %}
SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %}
{% load render_table from django_tables2 %} {% load render_table from django_tables2 %}
{% load crispy_forms_tags %} {% load i18n crispy_forms_tags perms %}
{% load i18n %} {% block contenttitle %}{% endblock %}
{% load perms %}
{% block content %} {% block content %}
<input id="searchbar" type="text" class="form-control" placeholder="Nom/prénom/note/section ..."> {% if "member.change_profile_registration_valid"|has_perm:user %}
<a class="btn btn-block btn-secondary mb-3" href="{% url 'registration:future_user_list' %}">
<i class="fas fa-user-plus"></i> {% trans "Registrations" %}
</a>
{% endif %}
<hr> <div class="card bg-light">
<h3 class="card-header text-center">
<div id="user_table"> {{ title }}
{% if table.data %} </h3>
<div class="card-body">
<input id="searchbar" type="text" class="form-control" placeholder="Nom/prénom/note/section...">
</div>
<div class="card-body">
<div id="user_table">
{% if table.data %}
{% render_table table %} {% render_table table %}
{% else %} {% else %}
<div class="alert alert-warning"> <div class="alert alert-warning">
{% trans "There is no user with this pattern." %} {% trans "There is no user with this pattern." %}
</div> </div>
{% endif %} {% endif %}
</div>
</div> </div>
</div>
<hr>
{% if "member.change_profile_registration_valid"|has_perm:user %}
<a class="btn btn-block btn-secondary" href="{% url 'registration:future_user_list' %}">
<i class="fas fa-user-plus"></i> {% trans "Registrations" %}
</a>
{% endif %}
{% endblock %} {% endblock %}
{% block extrajavascript %} {% block extrajavascript %}
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { let pattern = '';
let old_pattern = null;
let searchbar_obj = $("#searchbar");
var timer_on = false;
var timer;
function reloadTable() { function reloadTable() {
let pattern = searchbar_obj.val(); pattern = $("#searchbar").val();
if (pattern === old_pattern || pattern === "") if (pattern.length > 2)
return; $("#user_table").load(location.pathname + "?search=" + pattern.replace(" ", "%20") + " #user_table", init_table);
}
$("#user_table").load(location.pathname + "?search=" + pattern.replace(" ", "%20") + " #user_table", init); function init_table() {
} // On row click, go to object
$(".table-row").click(function () {
searchbar_obj.keyup(function() { window.document.location = $(this).data("href");
if (timer_on)
clearTimeout(timer);
timer_on = true;
setTimeout(reloadTable, 0);
}); });
function init() { // Highlight searched terms
$(".table-row").click(function() { $("tr").each(function () {
window.document.location = $(this).data("href"); $(this).find("td:eq(0), td:eq(1), td:eq(2), td:eq(3), td:eq(5)").each(function () {
timer_on = false; $(this).html($(this).text().replace(new RegExp(pattern, 'i'), "<mark>$&</mark>"));
}); });
});
}
$("tr").each(function() { $(document).ready(function () {
$(this).find("td:eq(0), td:eq(1), td:eq(2), td:eq(3), td:eq(5)").each(function() { // Recover last search from url
$(this).html($(this).text().replace(new RegExp(searchbar_obj.val(), 'i'), "<mark>$&</mark>")); let searchParams = new URLSearchParams(window.location.search)
}); if (searchParams.has('search'))
}); pattern = searchParams.get('search');
}
init(); // On search, refresh table
$("#searchbar").keyup(debounce(reloadTable, 300));
// First init
init_table();
}); });
</script> </script>
{% endblock %} {% endblock %}

View File

@ -14,7 +14,7 @@
<div class="row"> <div class="row">
{# User details column #} {# User details column #}
<div class="col"> <div class="col">
<div class="card border-success shadow mb-4 text-center"> <div class="card bg-light border-success mb-4 text-center">
<a id="profile_pic_link" href="#"> <a id="profile_pic_link" href="#">
<img src="/media/pic/default.png" <img src="/media/pic/default.png"
id="profile_pic" alt="" class="card-img-top"> id="profile_pic" alt="" class="card-img-top">
@ -27,7 +27,7 @@
{# User selection column #} {# User selection column #}
<div class="col-xl-7" id="user_select_div"> <div class="col-xl-7" id="user_select_div">
<div class="card border-success shadow mb-4"> <div class="card bg-light border-success mb-4">
<div class="card-header"> <div class="card-header">
<p class="card-text font-weight-bold"> <p class="card-text font-weight-bold">
{% trans "Consum" %} {% trans "Consum" %}
@ -47,7 +47,7 @@
</div> </div>
{# Summary of consumption and consume button #} {# Summary of consumption and consume button #}
<div class="col-xl-5 d-none" id="consos_list_div"> <div class="col-xl-5 d-none" id="consos_list_div">
<div class="card border-info shadow mb-4"> <div class="card bg-light border-info mb-4">
<div class="card-header"> <div class="card-header">
<p class="card-text font-weight-bold"> <p class="card-text font-weight-bold">
{% trans "Select consumptions" %} {% trans "Select consumptions" %}
@ -70,7 +70,7 @@
{# Buttons column #} {# Buttons column #}
<div class="col"> <div class="col">
{# Show last used buttons #} {# Show last used buttons #}
<div class="card shadow mb-4"> <div class="card bg-light mb-4">
<div class="card-header"> <div class="card-header">
<p class="card-text font-weight-bold"> <p class="card-text font-weight-bold">
{% trans "Highlighted buttons" %} {% trans "Highlighted buttons" %}
@ -92,7 +92,7 @@
{# Regroup buttons under categories #} {# Regroup buttons under categories #}
<div class="card border-primary text-center shadow mb-4"> <div class="card bg-light border-primary text-center mb-4">
{# Tabs for button categories #} {# Tabs for button categories #}
<div class="card-header"> <div class="card-header">
<ul class="nav nav-tabs nav-fill card-header-tabs"> <ul class="nav nav-tabs nav-fill card-header-tabs">

View File

@ -35,9 +35,9 @@ SPDX-License-Identifier: GPL-2.0-or-later
</div> </div>
</div> </div>
<div class="row"> <div class="row">
{# Preview note profile (picture, username and balance) #} {# Preview note profile (picture, username and balance) #}
<div class="col-md-3" id="note_infos_div"> <div class="col-md-3" id="note_infos_div">
<div class="card border-success shadow mb-4"> <div class="card bg-light border-success shadow mb-4">
<a id="profile_pic_link" href="#"><img src="/media/pic/default.png" <a id="profile_pic_link" href="#"><img src="/media/pic/default.png"
id="profile_pic" alt="" class="img-fluid rounded mx-auto d-block"></a> id="profile_pic" alt="" class="img-fluid rounded mx-auto d-block"></a>
<div class="card-body text-center"> <div class="card-body text-center">
@ -45,9 +45,10 @@ SPDX-License-Identifier: GPL-2.0-or-later
</div> </div>
</div> </div>
</div> </div>
{# list of emitters #}
{# list of emitters #}
<div class="col-md-3" id="emitters_div"> <div class="col-md-3" id="emitters_div">
<div class="card border-success shadow mb-4"> <div class="card bg-light border-success shadow mb-4">
<div class="card-header"> <div class="card-header">
<p class="card-text font-weight-bold"> <p class="card-text font-weight-bold">
{% trans "Select emitters" %} {% trans "Select emitters" %}
@ -66,9 +67,10 @@ SPDX-License-Identifier: GPL-2.0-or-later
</div> </div>
</div> </div>
</div> </div>
{# list of receiver #}
{# list of receiver #}
<div class="col-md-3" id="dests_div"> <div class="col-md-3" id="dests_div">
<div class="card border-info shadow mb-4"> <div class="card bg-light border-info shadow mb-4">
<div class="card-header"> <div class="card-header">
<p class="card-text font-weight-bold" id="dest_title"> <p class="card-text font-weight-bold" id="dest_title">
{% trans "Select receivers" %} {% trans "Select receivers" %}
@ -83,9 +85,10 @@ SPDX-License-Identifier: GPL-2.0-or-later
</div> </div>
</div> </div>
</div> </div>
{# Information on transaction (amount, reason, name,...) #}
{# Information on transaction (amount, reason, name,...) #}
<div class="col-md-3" id="external_div"> <div class="col-md-3" id="external_div">
<div class="card border-warning shadow mb-4"> <div class="card bg-light border-warning shadow mb-4">
<div class="card-header"> <div class="card-header">
<p class="card-text font-weight-bold"> <p class="card-text font-weight-bold">
{% trans "Action" %} {% trans "Action" %}

View File

@ -4,11 +4,15 @@ Font-Awesome attribution is already done inside SVG files
*/ */
#login-form input[type="text"] { #login-form input[type="text"] {
background: right 1rem top 50% / 5% no-repeat url('fa-user.svg'); background: #fff right 1rem top 50% / 5% no-repeat url('fa-user.svg');
padding-right: 3rem; padding-right: 3rem;
} }
#login-form input[type="password"] { #login-form input[type="password"] {
background: right 1rem top 50% / 5% no-repeat url('fa-lock.svg'); background: #fff right 1rem top 50% / 5% no-repeat url('fa-lock.svg');
padding-right: 3rem; padding-right: 3rem;
} }
#login-form select {
-moz-appearance: none;
}

View File

@ -0,0 +1,56 @@
.validate:hover {
cursor: pointer;
text-decoration: underline;
}
/* Opaque tooltip with white background */
.tooltip.show {
opacity: 1;
}
.tooltip-inner {
background-color: #fff;
box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
border: 1px solid rgba(0,0,0,.250);
color: #000;
margin: 0 .5rem .25rem .5rem;
padding: 0;
}
.bs-tooltip-bottom .arrow::before {
border-bottom-color: rgba(0,0,0,.250);
}
/* Limit fluid container to a max size */
.container-fluid {
max-width: 1600px;
}
/* Apply Bootstrap table-responsive to all Django tables */
.table-container {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
/* Smaller language selector */
select.language {
padding: 0;
background: transparent;
border: none;
height: calc(1.5em + .5rem);
color: #6c757d;
-moz-appearance: none;
width: auto;
}
/* Last BDE colors */
.bg-primary {
background-color: rgb(0, 119, 139) !important;
}
html {
scrollbar-color: rgba(121, 121, 123, 1) rgba(35, 35, 39, 1);
}
body {
background-color: rgba(64, 64, 64, 1);
background-image: url(../img/background-texture.png);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -7,7 +7,7 @@
* @param value the balance, in cents * @param value the balance, in cents
* @returns {string} * @returns {string}
*/ */
function pretty_money(value) { function pretty_money (value) {
if (value % 100 === 0) if (value % 100 === 0)
return (value < 0 ? "- " : "") + Math.floor(Math.abs(value) / 100) + " €"; return (value < 0 ? "- " : "") + Math.floor(Math.abs(value) / 100) + " €";
else else
@ -21,7 +21,7 @@ function pretty_money(value) {
* @param alert_type The type of the alert. Choices: info, success, warning, danger * @param alert_type The type of the alert. Choices: info, success, warning, danger
* @param timeout The delay (in millis) after that the message is auto-closed. If negative, then it is ignored. * @param timeout The delay (in millis) after that the message is auto-closed. If negative, then it is ignored.
*/ */
function addMsg(msg, alert_type, timeout = -1) { function addMsg (msg, alert_type, timeout = -1) {
let msgDiv = $("#messages"); let msgDiv = $("#messages");
let html = msgDiv.html(); let html = msgDiv.html();
let id = Math.floor(10000 * Math.random() + 1); let id = Math.floor(10000 * Math.random() + 1);
@ -42,7 +42,7 @@ function addMsg(msg, alert_type, timeout = -1) {
* @param errs_obj [{error_code:erro_message}] * @param errs_obj [{error_code:erro_message}]
* @param timeout The delay (in millis) after that the message is auto-closed. If negative, then it is ignored. * @param timeout The delay (in millis) after that the message is auto-closed. If negative, then it is ignored.
*/ */
function errMsg(errs_obj, timeout = -1) { function errMsg (errs_obj, timeout = -1) {
for (const err_msg of Object.values(errs_obj)) { for (const err_msg of Object.values(errs_obj)) {
addMsg(err_msg, 'danger', timeout); addMsg(err_msg, 'danger', timeout);
} }
@ -51,9 +51,9 @@ function errMsg(errs_obj, timeout = -1) {
var reloadWithTurbolinks = (function () { var reloadWithTurbolinks = (function () {
var scrollPosition; var scrollPosition;
function reload() { function reload () {
scrollPosition = [window.scrollX, window.scrollY]; scrollPosition = [window.scrollX, window.scrollY];
Turbolinks.visit(window.location.toString(), {action: 'replace'}) Turbolinks.visit(window.location.toString(), { action: 'replace' })
} }
document.addEventListener('turbolinks:load', function () { document.addEventListener('turbolinks:load', function () {
@ -69,7 +69,7 @@ var reloadWithTurbolinks = (function () {
/** /**
* Reload the balance of the user on the right top corner * Reload the balance of the user on the right top corner
*/ */
function refreshBalance() { function refreshBalance () {
$("#user_balance").load("/ #user_balance"); $("#user_balance").load("/ #user_balance");
} }
@ -78,14 +78,14 @@ function refreshBalance() {
* @param pattern The pattern that is queried * @param pattern The pattern that is queried
* @param fun For each found note with the matched alias `alias`, fun(note, alias) is called. * @param fun For each found note with the matched alias `alias`, fun(note, alias) is called.
*/ */
function getMatchedNotes(pattern, fun) { function getMatchedNotes (pattern, fun) {
$.getJSON("/api/note/alias/?format=json&alias=" + pattern + "&search=user|club&ordering=normalized_name", fun); $.getJSON("/api/note/alias/?format=json&alias=" + pattern + "&search=user|club&ordering=normalized_name", fun);
} }
/** /**
* Generate a <li> entry with a given id and text * Generate a <li> entry with a given id and text
*/ */
function li(id, text, extra_css) { function li (id, text, extra_css) {
return "<li class=\"list-group-item py-1 px-2 d-flex justify-content-between align-items-center text-truncate " return "<li class=\"list-group-item py-1 px-2 d-flex justify-content-between align-items-center text-truncate "
+ (extra_css ? extra_css : "") + "\"" + " id=\"" + id + "\">" + text + "</li>\n"; + (extra_css ? extra_css : "") + "\"" + " id=\"" + id + "\">" + text + "</li>\n";
} }
@ -94,7 +94,7 @@ function li(id, text, extra_css) {
* Return style to apply according to the balance of the note and the validation status of the email address * Return style to apply according to the balance of the note and the validation status of the email address
* @param note The concerned note. * @param note The concerned note.
*/ */
function displayStyle(note) { function displayStyle (note) {
if (!note) if (!note)
return ""; return "";
let balance = note.balance; let balance = note.balance;
@ -120,7 +120,7 @@ function displayStyle(note) {
* @param user_note_field * @param user_note_field
* @param profile_pic_field * @param profile_pic_field
*/ */
function displayNote(note, alias, user_note_field = null, profile_pic_field = null) { function displayNote (note, alias, user_note_field = null, profile_pic_field = null) {
if (!note.display_image) { if (!note.display_image) {
note.display_image = '/media/pic/default.png'; note.display_image = '/media/pic/default.png';
} }
@ -152,7 +152,7 @@ function displayNote(note, alias, user_note_field = null, profile_pic_field = nu
* (useful in consumptions, put null if not used) * (useful in consumptions, put null if not used)
* @returns an anonymous function to be compatible with jQuery events * @returns an anonymous function to be compatible with jQuery events
*/ */
function removeNote(d, note_prefix = "note", notes_display, note_list_id, user_note_field = null, profile_pic_field = null) { function removeNote (d, note_prefix = "note", notes_display, note_list_id, user_note_field = null, profile_pic_field = null) {
return (function () { return (function () {
let new_notes_display = []; let new_notes_display = [];
let html = ""; let html = "";
@ -199,8 +199,8 @@ function removeNote(d, note_prefix = "note", notes_display, note_list_id, user_n
* the associated note is not displayed. * the associated note is not displayed.
* Useful for a consumption if the item is selected before. * Useful for a consumption if the item is selected before.
*/ */
function autoCompleteNote(field_id, note_list_id, notes, notes_display, alias_prefix = "alias", function autoCompleteNote (field_id, note_list_id, notes, notes_display, alias_prefix = "alias",
note_prefix = "note", user_note_field = null, profile_pic_field = null, alias_click = null) { note_prefix = "note", user_note_field = null, profile_pic_field = null, alias_click = null) {
let field = $("#" + field_id); let field = $("#" + field_id);
// Configure tooltip // Configure tooltip
@ -348,7 +348,7 @@ function autoCompleteNote(field_id, note_list_id, notes, notes_display, alias_pr
// When a validate button is clicked, we switch the validation status // When a validate button is clicked, we switch the validation status
function de_validate(id, validated, resourcetype) { function de_validate (id, validated, resourcetype) {
let validate_obj = $("#validate_" + id); let validate_obj = $("#validate_" + id);
if (validate_obj.data("pending")) if (validate_obj.data("pending"))
@ -392,3 +392,17 @@ function de_validate(id, validated, resourcetype) {
} }
}); });
} }
/**
* Simple debouncer
* @param callback Function to call
* @param wait Debounced milliseconds
*/
function debounce (callback, wait) {
let timeout;
return (...args) => {
const context = this;
clearTimeout(timeout);
timeout = setTimeout(() => callback.apply(context, args), wait);
};
}

View File

@ -22,13 +22,15 @@ SPDX-License-Identifier: GPL-3.0-or-later
<meta name="msapplication-TileColor" content="#da532c"> <meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="{% static "favicon/browserconfig.xml" %}"> <meta name="msapplication-config" content="{% static "favicon/browserconfig.xml" %}">
<meta name="theme-color" content="#ffffff"> <meta name="theme-color" content="#ffffff">
{# Bootstrap CSS #}
{# Bootstrap, Font Awesome and custom CSS #}
<link rel="stylesheet" <link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
crossorigin="anonymous"> crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/v4-shims.css"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/v4-shims.css">
<link rel="stylesheet" href="{% static "css/custom.css" %}">
{# JQuery, Bootstrap and Turbolinks JavaScript #} {# JQuery, Bootstrap and Turbolinks JavaScript #}
<script src="https://code.jquery.com/jquery-3.4.1.min.js" <script src="https://code.jquery.com/jquery-3.4.1.min.js"
@ -42,137 +44,109 @@ SPDX-License-Identifier: GPL-3.0-or-later
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/turbolinks/5.2.0/turbolinks.js" <script src="https://cdnjs.cloudflare.com/ajax/libs/turbolinks/5.2.0/turbolinks.js"
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script src="/static/js/base.js"></script> <script src="{% static "js/base.js" %}"></script>
{# Si un formulaire requiert des données supplémentaires (notamment JS), les données sont chargées #} {# Si un formulaire requiert des données supplémentaires (notamment JS), les données sont chargées #}
{% if form.media %} {% if form.media %}
{{ form.media }} {{ form.media }}
{% endif %} {% endif %}
<style>
.validate:hover {
cursor: pointer;
text-decoration: underline;
}
.tooltip.show {
opacity: 1; /* opaque tooltip */
}
.tooltip-inner {
background-color: #fff;
box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
border: 1px solid rgba(0,0,0,.250);
color: #000;
margin: 0 .5rem .25rem .5rem;
padding: 0;
}
.bs-tooltip-bottom .arrow::before {
border-bottom-color: rgba(0,0,0,.250);
}
/* Limit fluid container to a max size */
.container-fluid {
max-width: 1600px;
}
/* Apply Bootstrap table-responsive to all Django tables */
.table-container {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
</style>
{% block extracss %}{% endblock %} {% block extracss %}{% endblock %}
</head> </head>
<body class="d-flex w-100 h-100 flex-column"> <body class="d-flex w-100 h-100 flex-column">
<main class="mb-auto"> <main class="mb-auto">
<nav class="navbar navbar-expand-md navbar-light bg-light fixed-navbar shadow-sm"> <nav class="navbar navbar-expand-md navbar-dark bg-primary fixed-navbar shadow-sm">
<a class="navbar-brand" href="/">{{ request.site.name }}</a> <div class="container-fluid">
<button class="navbar-toggler" type="button" data-toggle="collapse" <a class="navbar-brand" href="/">{{ request.site.name }}</a>
data-target="#navbarNavDropdown" <button class="navbar-toggler" type="button" data-toggle="collapse"
aria-controls="navbarNavDropdown" aria-expanded="false" data-target="#navbarNavDropdown"
aria-label="Toggle navigation"> aria-controls="navbarNavDropdown" aria-expanded="false"
<span class="navbar-toggler-icon"></span> aria-label="Toggle navigation">
</button> <span class="navbar-toggler-icon"></span>
<div class="collapse navbar-collapse" id="navbarNavDropdown"> </button>
<ul class="navbar-nav"> <div class="collapse navbar-collapse" id="navbarNavDropdown">
{% if "note.transactiontemplate"|not_empty_model_list %} <ul class="navbar-nav">
<li class="nav-item active"> {% if "note.transactiontemplate"|not_empty_model_list %}
<a class="nav-link" href="{% url 'note:consos' %}"><i class="fas fa-coffee"></i> {% trans 'Consumptions' %}</a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'note:consos' %}"><i class="fas fa-coffee"></i> {% trans 'Consumptions' %}</a>
{% endif %} </li>
{% if "note.transaction"|not_empty_model_list %} {% endif %}
<li class="nav-item active"> {% if "note.transaction"|not_empty_model_list %}
<a class="nav-link" href="{% url 'note:transfer' %}"><i class="fas fa-exchange-alt"></i> {% trans 'Transfer' %} </a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'note:transfer' %}"><i class="fas fa-exchange-alt"></i> {% trans 'Transfer' %} </a>
{% endif %} </li>
{% if "auth.user"|model_list_length >= 2 %} {% endif %}
<li class="nav-item active"> {% if "auth.user"|model_list_length >= 2 %}
<a class="nav-link" href="{% url 'member:user_list' %}"><i class="fas fa-user"></i> {% trans 'Users' %}</a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'member:user_list' %}"><i class="fas fa-user"></i> {% trans 'Users' %}</a>
{% endif %} </li>
{% if "member.club"|not_empty_model_list %} {% endif %}
<li class="nav-item active"> {% if "member.club"|not_empty_model_list %}
<a class="nav-link" href="{% url 'member:club_list' %}"><i class="fas fa-users"></i> {% trans 'Clubs' %}</a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'member:club_list' %}"><i class="fas fa-users"></i> {% trans 'Clubs' %}</a>
{% endif %} </li>
{% if "activity.activity"|not_empty_model_list %} {% endif %}
<li class="nav-item active"> {% if "activity.activity"|not_empty_model_list %}
<a class="nav-link" href="{% url 'activity:activity_list' %}"><i class="fas fa-calendar"></i> {% trans 'Activities' %}</a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'activity:activity_list' %}"><i class="fas fa-calendar"></i> {% trans 'Activities' %}</a>
{% endif %} </li>
{% if "treasury.invoice"|not_empty_model_list %} {% endif %}
<li class="nav-item active"> {% if "treasury.invoice"|not_empty_model_list %}
<a class="nav-link" href="{% url 'treasury:invoice_list' %}"><i class="fas fa-credit-card"></i> {% trans 'Treasury' %}</a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'treasury:invoice_list' %}"><i class="fas fa-credit-card"></i> {% trans 'Treasury' %}</a>
{% endif %} </li>
{% if "wei.weiclub"|not_empty_model_list %} {% endif %}
<li class="nav-item active"> {% if "wei.weiclub"|not_empty_model_list %}
<a class="nav-link" href="{% url 'wei:current_wei_detail' %}"><i class="fas fa-bus"></i> {% trans 'WEI' %}</a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'wei:current_wei_detail' %}"><i class="fas fa-bus"></i> {% trans 'WEI' %}</a>
{% endif %} </li>
{% if request.user.is_authenticated %} {% endif %}
<li class="nav-item active"> {% if request.user.is_authenticated %}
<a class="nav-link" href="{% url 'permission:rights' %}"><i class="fas fa-balance-scale"></i> {% trans 'Rights' %}</a> <li class="nav-item">
</li> <a class="nav-link" href="{% url 'permission:rights' %}"><i class="fas fa-balance-scale"></i> {% trans 'Rights' %}</a>
{% endif %} </li>
{% if request.user.is_staff and ""|has_perm:user %} {% endif %}
<li class="nav-item active"> {% if request.user.is_staff and ""|has_perm:user %}
<a data-turbolinks="false" class="nav-link" href="{% url 'admin:index' %}"><i class="fas fa-user-cog"></i> {% trans 'Admin' %}</a> <li class="nav-item">
</li> <a data-turbolinks="false" class="nav-link" href="{% url 'admin:index' %}"><i class="fas fa-user-cog"></i> {% trans 'Admin' %}</a>
{% endif %} </li>
</ul> {% endif %}
<ul class="navbar-nav ml-auto"> </ul>
{% if request.user.is_authenticated %} <ul class="navbar-nav ml-auto">
<li class="dropdown"> {% if request.user.is_authenticated %}
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <li class="dropdown">
<i class="fas fa-user"></i> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span id="user_balance">{{ request.user.username }} ({{ request.user.note.balance | pretty_money }})</span> <i class="fas fa-user"></i>
</a> <span id="user_balance">{{ request.user.username }} ({{ request.user.note.balance | pretty_money }})</span>
<div class="dropdown-menu dropdown-menu-right"
aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="{% url 'member:user_detail' pk=request.user.pk %}">
<i class="fas fa-user"></i> Mon compte
</a> </a>
<a class="dropdown-item" href="{% url 'logout' %}"> <div class="dropdown-menu dropdown-menu-right"
<i class="fas fa-sign-out-alt"></i> Se déconnecter aria-labelledby="navbarDropdownMenuLink">
</a> <a class="dropdown-item" href="{% url 'member:user_detail' pk=request.user.pk %}">
</div> <i class="fas fa-user"></i> Mon compte
</li> </a>
{% else %} <a class="dropdown-item" href="{% url 'logout' %}">
<li class="nav-item active"> <i class="fas fa-sign-out-alt"></i> Se déconnecter
<a class="nav-link" href="{% url 'registration:signup' %}"> </a>
<i class="fas fa-user-plus"></i> S'inscrire </div>
</a> </li>
</li> {% else %}
<li class="nav-item active"> {% if request.path != "/registration/signup/" %}
<a class="nav-link" href="{% url 'login' %}"> <li class="nav-item">
<i class="fas fa-sign-in-alt"></i> Se connecter <a class="nav-link" href="{% url 'registration:signup' %}">
</a> <i class="fas fa-user-plus"></i> S'inscrire
</li> </a>
{% endif %} </li>
</ul> {% endif %}
{% if request.path != "/accounts/login/" %}
<li class="nav-item">
<a class="nav-link" href="{% url 'login' %}">
<i class="fas fa-sign-in-alt"></i> Se connecter
</a>
</li>
{% endif %}
{% endif %}
</ul>
</div>
</div> </div>
</nav> </nav>
<div class="{% block containertype %}container{% endblock %} my-3"> <div class="{% block containertype %}container{% endblock %} my-3">
@ -181,7 +155,7 @@ SPDX-License-Identifier: GPL-3.0-or-later
{% trans "Your e-mail address is not validated. Please check your mail inbox and click on the validation link." %} {% trans "Your e-mail address is not validated. Please check your mail inbox and click on the validation link." %}
</div> </div>
{% endif %} {% endif %}
{% block contenttitle %}<h1>{{ title }}</h1>{% endblock %} {% block contenttitle %}<h1 class="text-white">{{ title }}</h1>{% endblock %}
<div class="alert alert-warning alert-dismissible"> <div class="alert alert-warning alert-dismissible">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&#215;</button> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&#215;</button>
Attention : la Note Kfet 2020 est en phase de beta. Des fonctionnalités pourront être rajoutées d'ici à la version Attention : la Note Kfet 2020 est en phase de beta. Des fonctionnalités pourront être rajoutées d'ici à la version
@ -196,23 +170,22 @@ SPDX-License-Identifier: GPL-3.0-or-later
<div id="messages"></div> <div id="messages"></div>
{% block content %} {% block content %}
<p>Default content...</p> <p>Default content...</p>
{% endblock content %} {% endblock %}
</div> </div>
</main> </main>
<footer class="bg-light mt-auto py-2"> <footer class="bg-dark text-white mt-auto py-2">
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-sm"> <div class="col-10">
<form action="{% url 'set_language' %}" method="post" <form action="{% url 'set_language' %}" method="post"
class="form-inline"> class="form-inline">
<span class="text-muted mr-1"> <span class="text-muted mr-1">
NoteKfet2020 &mdash;
<a href="mailto:{{ "CONTACT_EMAIL" | getenv }}" <a href="mailto:{{ "CONTACT_EMAIL" | getenv }}"
class="text-muted">Nous contacter</a> &mdash; class="text-muted">Nous contacter</a> &mdash;
</span> </span>
{% csrf_token %} {% csrf_token %}
<select title="language" name="language" <select title="language" name="language"
class="custom-select custom-select-sm" class="form-control form-control-sm language"
onchange="this.form.submit()"> onchange="this.form.submit()">
{% get_current_language as LANGUAGE_CODE %} {% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %} {% get_available_languages as LANGUAGES %}
@ -230,8 +203,10 @@ SPDX-License-Identifier: GPL-3.0-or-later
</noscript> </noscript>
</form> </form>
</div> </div>
<div class="col-sm text-right"> <div class="col text-right">
<a href="#" class="text-muted">Retour en haut</a> <a href="#" data-turbolinks="false" class="text-muted">
<i class="fa fa-arrow-up" aria-hidden="true"></i>
</a>
</div> </div>
</div> </div>
</div> </div>
@ -242,7 +217,6 @@ SPDX-License-Identifier: GPL-3.0-or-later
$(".invalid-feedback").addClass("d-block"); $(".invalid-feedback").addClass("d-block");
</script> </script>
{% block extrajavascript %} {% block extrajavascript %}{% endblock %}
{% endblock extrajavascript %}
</body> </body>
</html> </html>

View File

@ -3,8 +3,16 @@
SPDX-License-Identifier: GPL-3.0-or-later SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n %} {% load i18n %}
{% block contenttitle %}{% endblock %}
{% block content %} {% block content %}
<p>{% trans "Thanks for spending some quality time with the Web site today." %}</p> <div class="card bg-light">
<p><a href="{% url 'index' %}">{% trans 'Log in again' %}</a></p> <h3 class="card-header text-center">
{{ title }}
</h3>
<div class="card-body">
<p>{% trans "Thanks for spending some quality time with the Web site today." %}</p>
<p><a href="{% url 'index' %}">{% trans 'Log in again' %}</a></p>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -3,8 +3,6 @@
SPDX-License-Identifier: GPL-2.0-or-later SPDX-License-Identifier: GPL-2.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n crispy_forms_tags static %} {% load i18n crispy_forms_tags static %}
{# Change page title without displaying it in header #}
{% block title %}{% trans "Log in" %}{% endblock %} {% block title %}{% trans "Log in" %}{% endblock %}
{% block contenttitle %}{% endblock %} {% block contenttitle %}{% endblock %}
@ -13,34 +11,35 @@ SPDX-License-Identifier: GPL-2.0-or-later
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<main class="card border-dark mx-auto" style="max-width: 30rem;"> <div class="card bg-light mx-auto" style="max-width: 30rem;">
<h3 class="card-header text-center"> <h3 class="card-header text-center">
{% trans "Log in" %} {% trans "Log in" %}
</h3> </h3>
<div class="card-body"> <div class="card-body">
{% if user.is_authenticated %} {% if user.is_authenticated %}
<div class="alert alert-warning"> <div class="alert alert-warning">
{% blocktrans trimmed with username=request.user.username %} {% blocktrans trimmed with username=request.user.username %}
You are authenticated as {{ username }}, but are not authorized to You are authenticated as {{ username }}, but are not authorized to
access this page. Would you like to login to a different account, access this page. Would you like to login to a different account,
or with a higher permission mask? or with a higher permission mask?
{% endblocktrans %} {% endblocktrans %}
</div>
{% endif %}
{% if request.resolver_match.view_name == 'admin:login' %}
<div class="alert alert-info">
{% blocktrans trimmed %}
You must be logged with a staff account with the higher mask to access Django Admin.
{% endblocktrans %}
</div>
{% endif %}
<form action="{{ app_path }}" method="post" id="login-form">{% csrf_token %}
{{ form | crispy }}
<input type="submit" value="{% trans 'Log in' %}" class="btn btn-primary btn-block btn-lg">
<a href="{% url 'password_reset' %}" class="badge badge-light">{% trans 'Forgotten your password or username?' %}</a>
</form>
</div> </div>
</main> {% endif %}
{% if request.resolver_match.view_name == 'admin:login' %}
<div class="alert alert-info">
{% blocktrans trimmed %}
You must be logged with a staff account with the higher mask to access Django Admin.
{% endblocktrans %}
</div>
{% endif %}
<form action="{{ app_path }}" method="post" id="login-form">{% csrf_token %}
{{ form | crispy }}
<input type="submit" value="{% trans 'Log in' %}" class="btn btn-primary btn-block btn-lg">
<a href="{% url 'password_reset' %}"
class="badge badge-light">{% trans 'Forgotten your password or username?' %}</a>
</form>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -3,7 +3,15 @@
SPDX-License-Identifier: GPL-3.0-or-later SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n %} {% load i18n %}
{% block contenttitle %}{% endblock %}
{% block content %} {% block content %}
<p>{% trans 'Your password was changed.' %}</p> <div class="card bg-light">
<h3 class="card-header text-center">
{{ title }}
</h3>
<div class="card-body">
<p>{% trans 'Your password was changed.' %}</p>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -3,11 +3,19 @@
SPDX-License-Identifier: GPL-3.0-or-later SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n crispy_forms_tags %} {% load i18n crispy_forms_tags %}
{% block contenttitle %}{% endblock %}
{% block content %} {% block content %}
<form method="post">{% csrf_token %} <div class="card bg-light">
<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> <h3 class="card-header text-center">
{{ form | crispy }} {{ title }}
<input class="btn btn-primary" type="submit" value="{% trans 'Change my password' %}"> </h3>
</form> <div class="card-body">
<form method="post">{% csrf_token %}
<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>
{{ form | crispy }}
<input class="btn btn-primary" type="submit" value="{% trans 'Change my password' %}">
</form>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -3,10 +3,18 @@
SPDX-License-Identifier: GPL-3.0-or-later SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n %} {% load i18n %}
{% block contenttitle %}{% endblock %}
{% block content %} {% block content %}
<p>{% trans "Your password has been set. You may go ahead and log in now." %}</p> <div class="card bg-light">
<p> <h3 class="card-header text-center">
<a href="{{ login_url }}" class="btn btn-success">{% trans 'Log in' %}</a> {{ title }}
</p> </h3>
<div class="card-body">
<p>{% trans "Your password has been set. You may go ahead and log in now." %}</p>
<p>
<a href="{{ login_url }}" class="btn btn-success">{% trans 'Log in' %}</a>
</p>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -3,15 +3,25 @@
SPDX-License-Identifier: GPL-3.0-or-later SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n crispy_forms_tags %} {% load i18n crispy_forms_tags %}
{% block contenttitle %}{% endblock %}
{% block content %} {% block content %}
{% if validlink %} <div class="card bg-light">
<h3 class="card-header text-center">
{{ title }}
</h3>
<div class="card-body">
{% if validlink %}
<p>{% trans "Please enter your new password twice so we can verify you typed it in correctly." %}</p> <p>{% trans "Please enter your new password twice so we can verify you typed it in correctly." %}</p>
<form method="post">{% csrf_token %} <form method="post">{% csrf_token %}
{{ form | crispy }} {{ form | crispy }}
<input class="btn btn-primary" type="submit" value="{% trans 'Change my password' %}"> <input class="btn btn-primary" type="submit" value="{% trans 'Change my password' %}">
</form> </form>
{% else %} {% else %}
<p>{% trans "The password reset link was invalid, possibly because it has already been used. Please request a new password reset." %}</p> <p>
{% endif %} {% trans "The password reset link was invalid, possibly because it has already been used. Please request a new password reset." %}
</p>
{% endif %}
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -3,8 +3,16 @@
SPDX-License-Identifier: GPL-3.0-or-later SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n %} {% load i18n %}
{% block contenttitle %}{% endblock %}
{% block content %} {% block content %}
<p>{% trans "We've emailed you instructions for setting your password, if an account exists with the email you entered. You should receive them shortly." %}</p> <div class="card bg-light">
<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> <h3 class="card-header text-center">
{{ title }}
</h3>
<div class="card-body">
<p>{% trans "We've emailed you instructions for setting your password, if an account exists with the email you entered. You should receive 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>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -3,11 +3,21 @@
SPDX-License-Identifier: GPL-3.0-or-later SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %} {% endcomment %}
{% load i18n crispy_forms_tags %} {% load i18n crispy_forms_tags %}
{% block contenttitle %}{% endblock %}
{% block content %} {% block content %}
<p>{% trans "Forgotten your password? Enter your email address below, and we'll email instructions for setting a new one." %}</p> <div class="card bg-light">
<form method="post">{% csrf_token %} <h3 class="card-header text-center">
{{ form | crispy }} {{ title }}
<input class="btn btn-primary" type="submit" value="{% trans 'Reset my password' %}"> </h3>
</form> <div class="card-body">
<p>{% trans "Forgotten your password? Enter your email address below, and we'll email instructions for setting a new one." %}</p>
<form method="post">
{% csrf_token %}
{{ form | crispy }}
<input class="btn btn-primary" type="submit" value="{% trans 'Reset my password' %}">
</form>
</div>
</div>
{% endblock %} {% endblock %}

View File

@ -1,23 +1,33 @@
<!-- templates/signup.html -->
{% extends 'base.html' %} {% extends 'base.html' %}
{% load crispy_forms_tags %} {% comment %}
{% load i18n %} SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %}
{% load i18n crispy_forms_tags %}
{% block title %}{% trans "Sign up" %}{% endblock %} {% block title %}{% trans "Sign up" %}{% endblock %}
{% block contenttitle %}{% endblock %}
{# Use a fixed-width container #}
{% block containertype %}container{% endblock %}
{% block content %} {% block content %}
<div class="alert alert-warning"> <div class="card bg-light">
{% blocktrans %}If you already signed up, your registration is taken into account. The BDE must validate your account before your can log in. You have to go to the Kfet and pay the registration fee. You must also validate your email address by following the link you received.{% endblocktrans %} <h3 class="card-header text-center">
</div> {% trans "Sign up" %}
</h3>
<div class="card-body">
<div class="alert alert-warning">
{% blocktrans trimmed %}
If you already signed up, your registration is taken into account. The BDE must validate
your account before your can log in. You have to go to the Kfet and pay the registration fee. You must also
validate your email address by following the link you received.
{% endblocktrans %}
</div>
<form method="post"> <form method="post">
{% csrf_token %} {% csrf_token %}
{{ form|crispy }} {{ form|crispy }}
{{ profile_form|crispy }} {{ profile_form|crispy }}
<button class="btn btn-success" type="submit"> <button class="btn btn-success" type="submit">
{% trans "Sign up" %} {% trans "Sign up" %}
</button> </button>
</form> </form>
</div>
</div>
{% endblock %} {% endblock %}