sporada/nopaque
1
0
Fork 0
mirror of https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git synced 2024-11-15 01:05:42 +00:00
Code Issues Projects Releases Wiki Activity

Icon + public profile section update on edit page

Browse Source
This commit is contained in:
Inga Kirschnick 2023-03-15 12:46:17 +01:00
parent 666397046d
commit 268d00ce72
1 changed files with 25 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
app/templates/users/edit_profile.html.j2
View File

@ -66,19 +66,15 @@
<form method="POST" enctype="multipart/form-data"> <form method="POST" enctype="multipart/form-data">
{{ edit_public_profile_information_form.hidden_tag() }} {{ edit_public_profile_information_form.hidden_tag() }}
<div class="row"> <div class="row">
<div class="col s10 m4"> <div class="col s12 m2">
<img src="{{ url_for('.profile_avatar', user_id=user.id) }}" alt="user-image" class="circle responsive-img" id="avatar"> <img src="{{ url_for('.profile_avatar', user_id=user.id) }}" alt="user-image" class="circle responsive-img" id="avatar">
</div> </div>
</div> <div class="col s12 m6">
<div class="row">
<div class="col s3 m2">
<div class="center-align">
<a class="btn-floating red waves-effect waves-light modal-trigger" style="margin-top:15px;" href="#delete-avatar-modal"><i class="material-icons">delete</i></a>
</div>
</div>
<div class="col s9 m8">
{{ wtf.render_field(edit_public_profile_information_form.avatar, accept='image/jpeg, image/png, image/gif', placeholder='Choose an image file', id='avatar-upload') }} {{ wtf.render_field(edit_public_profile_information_form.avatar, accept='image/jpeg, image/png, image/gif', placeholder='Choose an image file', id='avatar-upload') }}
</div> </div>
<div class="col s12 m1">
<a class="btn-floating red waves-effect waves-light modal-trigger" style="margin-top:15px;" href="#delete-avatar-modal"><i class="material-icons">delete</i></a>
</div>
</div> </div>
<p></p> <p></p>
<br> <br>
@ -107,7 +103,7 @@
<div class="col s8" style="margin-top: 22.8px;"> <div class="col s8" style="margin-top: 22.8px;">
<ul class="collapsible"> <ul class="collapsible">
<li> <li>
<div class="collapsible-header"> <div class="collapsible-header" style="justify-content: space-between;">
<span>Notification Settings</span> <span>Notification Settings</span>
<i class="caret material-icons">keyboard_arrow_right</i> <i class="caret material-icons">keyboard_arrow_right</i>
</div> </div>
@ -122,7 +118,7 @@
</div> </div>
</li> </li>
<li> <li>
<div class="collapsible-header"> <div class="collapsible-header" style="justify-content: space-between;">
<span>Change Password</span> <span>Change Password</span>
<i class="caret material-icons right">keyboard_arrow_right</i> <i class="caret material-icons right">keyboard_arrow_right</i>
</div> </div>
@ -139,7 +135,7 @@
</div> </div>
</li> </li>
<li> <li>
<div class="collapsible-header"> <div class="collapsible-header" style="justify-content: space-between;">
<span>Delete Account</span> <span>Delete Account</span>
<i class="caret material-icons right">keyboard_arrow_right</i> <i class="caret material-icons right">keyboard_arrow_right</i>
</div> </div>
@ -227,5 +223,21 @@ document.querySelector('#delete-user-button').addEventListener('click', (event)
Requests.users.entity.delete(currentUserId) Requests.users.entity.delete(currentUserId)
.then((response) => {window.location.href = '/';}); .then((response) => {window.location.href = '/';});
}); });
document.querySelectorAll('.collapsible').forEach((collapsible) => {
M.Collapsible.init(
collapsible,
{
onOpenStart: (event) => {
let caret = event.querySelector('.caret');
caret.innerHTML = 'keyboard_arrow_down';
},
onCloseStart: (event) => {
let caret = event.querySelector('.caret');
caret.innerHTML = 'keyboard_arrow_right';
}
});
});
</script> </script>
{% endblock scripts %} {% endblock scripts %}