ynerant
/
nk20
mirror of https://gitlab.crans.org/bde/nk20
1
0
Fork 0
Code Issues Releases Wiki Activity

Fix profile picture width

This commit is contained in:
Alexandre Iooss 2020-09-09 14:03:49 +02:00
parent e5835b46a5
commit f333e6a875
4 changed files with 23 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
apps/note/templates/note/conso_form.html
View File

@ -10,22 +10,22 @@ SPDX-License-Identifier: GPL-3.0-or-later
{% block content %} {% block content %}
<div class="row mt-4"> <div class="row mt-4">
<div class="col-sm-5 col-md-4" id="infos_div"> <div class="col-sm-5 col-md-4" id="infos_div">
<div class="row"> <div class="row justify-content-center justify-content-md-end">
{# User details column #} {# User details column #}
<div class="col"> <div class="col picture-col">
<div class="card bg-light border-success mb-4 text-center"> <div class="card bg-light mb-4 text-center">
<a id="profile_pic_link" href="#"> <a id="profile_pic_link" href="#">
<img src="{% static "member/img/default_picture.png" %}" <img src="{% static "member/img/default_picture.png" %}"
id="profile_pic" alt="" class="card-img-top"> id="profile_pic" alt="" class="card-img-top d-none d-sm-block">
</a> </a>
<div class="card-body text-center text-break"> <div class="card-body text-center text-break px-1 py-2">
<span id="user_note"></span> <span id="user_note"><i>{% trans "Please select an user" %}</i></span>
</div> </div>
</div> </div>
</div> </div>
{# User selection column #} {# User selection column #}
<div class="col-xl-7" id="user_select_div"> <div class="col-xl" id="user_select_div">
<div class="card bg-light border-success 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">
@ -44,6 +44,7 @@ SPDX-License-Identifier: GPL-3.0-or-later
</div> </div>
</div> </div>
</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 bg-light border-info mb-4"> <div class="card bg-light border-info mb-4">
@ -65,7 +66,6 @@ SPDX-License-Identifier: GPL-3.0-or-later
</div> </div>
</div> </div>
{# Show last used buttons #} {# Show last used buttons #}
<div class="card bg-light mb-4"> <div class="card bg-light mb-4">
<div class="card-header"> <div class="card-header">

20
apps/note/templates/note/transaction_form.html
View File

@ -34,21 +34,21 @@ SPDX-License-Identifier: GPL-2.0-or-later
</div> </div>
</div> </div>
<hr> <hr>
<div class="row"> <div class="row justify-content-center">
{# 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 picture-col" id="note_infos_div">
<div class="card bg-light border-success shadow mb-4 pt-4 text-center"> <div class="card bg-light mb-4 text-center">
<a id="profile_pic_link" href="#"><img src="{% static "member/img/default_picture.png" %}" <a id="profile_pic_link" href="#"><img src="{% static "member/img/default_picture.png" %}"
id="profile_pic" alt="" class="img-fluid rounded mx-auto"></a> id="profile_pic" alt="" class="img-fluid rounded mx-auto"></a>
<div class="card-body text-center"> <div class="card-body text-center px-1 py-2">
<span id="user_note"></span> <span id="user_note"><i>{% trans "Please select an user" %}</i></span>
</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 bg-light border-success 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">
<label for="source_note" id="source_note_label">{% trans "Select emitters" %}</label> <label for="source_note" id="source_note_label">{% trans "Select emitters" %}</label>
@ -75,7 +75,7 @@ SPDX-License-Identifier: GPL-2.0-or-later
{# 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 bg-light border-info 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" id="dest_title"> <p class="card-text font-weight-bold" id="dest_title">
<label for="dest_note" id="dest_note_label">{% trans "Select receivers" %}</label> <label for="dest_note" id="dest_note_label">{% trans "Select receivers" %}</label>
@ -97,8 +97,8 @@ SPDX-License-Identifier: GPL-2.0-or-later
</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" id="external_div">
<div class="card bg-light border-warning 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 "Action" %} {% trans "Action" %}
@ -153,7 +153,7 @@ SPDX-License-Identifier: GPL-2.0-or-later
</div> </div>
</div> </div>
{# transaction history #} {# transaction history #}
<div class="card shadow mb-4" id="history"> <div class="card mb-4" id="history">
<div class="card-header"> <div class="card-header">
<p class="card-text font-weight-bold"> <p class="card-text font-weight-bold">
{% trans "Recent transactions history" %} {% trans "Recent transactions history" %}

5
note_kfet/static/css/custom.css
View File

@ -22,6 +22,11 @@
border-bottom-color: rgba(0, 0, 0, .250); border-bottom-color: rgba(0, 0, 0, .250);
} }
/* Fixed width picture column */
.picture-col {
max-width: 202px;
}
/* Limit fluid container to a max size */ /* Limit fluid container to a max size */
.container-fluid { .container-fluid {
max-width: 1600px; max-width: 1600px;

2
note_kfet/static/js/consos.js
View File

@ -29,7 +29,6 @@ $(document).ready(function () {
// Switching in double consumptions mode should update the layout // Switching in double consumptions mode should update the layout
$('#double_conso').change(function () { $('#double_conso').change(function () {
$('#consos_list_div').removeClass('d-none') $('#consos_list_div').removeClass('d-none')
$('#user_select_div').attr('class', 'col-xl-4')
$('#infos_div').attr('class', 'col-sm-5 col-xl-6') $('#infos_div').attr('class', 'col-sm-5 col-xl-6')
const note_list_obj = $('#note_list') const note_list_obj = $('#note_list')
@ -48,7 +47,6 @@ $(document).ready(function () {
$('#single_conso').change(function () { $('#single_conso').change(function () {
$('#consos_list_div').addClass('d-none') $('#consos_list_div').addClass('d-none')
$('#user_select_div').attr('class', 'col-xl-7')
$('#infos_div').attr('class', 'col-sm-5 col-md-4') $('#infos_div').attr('class', 'col-sm-5 col-md-4')
const consos_list_obj = $('#consos_list') const consos_list_obj = $('#consos_list')