eric/e-tandem_UI
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Added user image profile in Mobile sideMenu

Browse source
This commit is contained in:
ericb 2024-12-02 17:28:49 +01:00
parent 9b2e1e2665
commit 8c5c9b7eee
2 changed files with 35 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

12
static/css/main.css
View file

@ -392,7 +392,7 @@ footer a img{
width: 1em; width: 1em;
} }
.navbar-brand{ .navbar-brand{
margin: 0 auto; margin-left: 1rem;
} }
.lead{ .lead{
hyphens: none; hyphens: none;
@ -407,7 +407,7 @@ footer a img{
.partners-logo-grid{ .partners-logo-grid{
grid-template-columns: repeat(auto-fit, minmax(6em, 1fr)); grid-template-columns: repeat(auto-fit, minmax(6em, 1fr));
} }
.profile .user-avatar, .profile .user-pseudo{ .profile .user-avatar, .profile .user-pseudo, .offcanvas .user-avatar{
margin: 0 auto; margin: 0 auto;
text-align: center text-align: center
} }
@ -428,6 +428,14 @@ footer a img{
width: fit-content; width: fit-content;
margin: calc(var(--div-padding) / 1.25) auto 0; margin: calc(var(--div-padding) / 1.25) auto 0;
} }
.offcanvas .user-avatar{
margin: 0 auto;
text-align: center
}
.offcanvas .user-avatar img{
width: 5rem;
height: 5rem;
}
.offcanvas-body{ .offcanvas-body{
padding: 0; padding: 0;
background: rgb(253, 195, 20); background: rgb(253, 195, 20);

11
tandem-list.html
View file

@ -29,6 +29,10 @@
</div> --> </div> -->
<div class="offcanvas-body"> <div class="offcanvas-body">
<nav class="side-menu" id="offSideMenu"> <nav class="side-menu" id="offSideMenu">
<div class="user-avatar">
<img src="static/img/avatars/default-avatar.svg" alt="Priscilla">
<h4 class="user-pseudo display-6 fw-bold">Priscilla</h4>
</div>
<ul class="nav"> <ul class="nav">
<li class="nav-item"> <li class="nav-item">
<a href="#" role="menuitem" class="nav-link active" aria-current="page">Rechercher des TANDEMs</a> <a href="#" role="menuitem" class="nav-link active" aria-current="page">Rechercher des TANDEMs</a>
@ -52,7 +56,10 @@
<a href="#" role="menuitem" class="nav-link">Espace documentaire</a> <a href="#" role="menuitem" class="nav-link">Espace documentaire</a>
</li> </li>
</ul> </ul>
<div class="separator menu-admin">Admin</div> <div class="separator menu-admin">
<a data-bs-toggle="collapse" href="#sideMenuAdmin" role="button" aria-expanded="false" aria-controls="sideMenuAdmin"><span><img class="icon-ui" src="static/img/icons/filters.svg" alt=""></span>Administration</a>
</div>
<div id="sideMenuAdmin" class="collapse">
<ul class="nav"> <ul class="nav">
<li class="nav-item"> <li class="nav-item">
<a href="#" role="menuitem" class="nav-link">Gérer les comptes</a> <a href="#" role="menuitem" class="nav-link">Gérer les comptes</a>
@ -67,6 +74,8 @@
<a href="#" role="menuitem" class="nav-link">Dictionnaire</a> <a href="#" role="menuitem" class="nav-link">Dictionnaire</a>
</li> </li>
</ul> </ul>
</div>
</nav> </nav>
<div id="side-lang" class="ms-auto"> <div id="side-lang" class="ms-auto">
<div class="col"> <div class="col">