Compare commits
2 commits
7d85ae44d8
...
450912aae3
| Author | SHA1 | Date | |
|---|---|---|---|
| 450912aae3 | |||
| 2dd492cc33 |
5 changed files with 394 additions and 26 deletions
|
|
@ -19,19 +19,20 @@
|
|||
<h1 class="mb-4">Forum du bilinguisme HTML/CSS maquettes</h1>
|
||||
<h2>Ecrans à valider/intégrer</h2>
|
||||
<ul>
|
||||
<li><a href="signalements.html" target="_blank" rel="noopener">Gestion des signalements</a><span class="badge bg-success rounded-pill ms-2">new: 13.01.25</span></li>
|
||||
<li><a href="mail-template.html" target="_blank" rel="noopener">Email template</a><span class="badge bg-success rounded-pill ms-2">new: 14.01.25</span></li>
|
||||
<li><a href="signalements.html" target="_blank" rel="noopener">Gestion des signalements</a><span class="badge bg-success rounded-pill ms-2">new: 13.01.25</span><span class="badge bg-secondary rounded-pill ms-2">GO Dev</span></li>
|
||||
<li><a href="my-tandems.html" target="_blank" rel="noopener">Mes TANDEMs</a><span class="badge bg-success rounded-pill ms-2">new: 15.01.25</span></li>
|
||||
<li><a href="profile.html" target="_blank" rel="noopener">Profil utilisateur</a><span class="badge bg-warning rounded-pill ms-2">last update: 14.01.25</span><span class="badge bg-secondary rounded-pill ms-2">UPDATED!!! OK Dev</span></li>
|
||||
<li><a href="documents.html" target="_blank" rel="noopener">Espace documentaire</a><span class="badge bg-warning rounded-pill ms-2">last update: 05.01.25</span><span class="badge bg-secondary rounded-pill ms-2">Go Dev</span></li>
|
||||
</ul>
|
||||
<h2>Ecrans intégrés</h2>
|
||||
<ul>
|
||||
<li><a href="home.html" target="_blank" rel="noopener">Page d'accueil</a><span class="badge bg-warning rounded-pill ms-2">last update: 10.12.24</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="connect.html" target="_blank" rel="noopener">Page de connexion</a><span class="badge bg-warning rounded-pill ms-2">last update: 10.12.24</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="create-account.html" target="_blank" rel="noopener">Création de compte</a><span class="badge bg-warning rounded-pill ms-2">last update: 10.12.24</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="profile.html" target="_blank" rel="noopener">Profil utilisateur</a><span class="badge bg-warning rounded-pill ms-2">last update: 16.12.24</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="tandem-list.html" target="_blank" rel="noopener">Recherche TANDEM</a><span class="badge bg-warning rounded-pill ms-2">last update: 16.12.24</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="invitations.html" target="_blank" rel="noopener">Gestion des demandes</a><span class="badge bg-warning rounded-pill ms-2">last update: 17.12.24</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="documents.html" target="_blank" rel="noopener">Espace documentaire</a><span class="badge bg-warning rounded-pill ms-2">last update: 05.01.25</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="404.html" target="_blank" rel="noopener">Error 404</a><span class="badge bg-warning rounded-pill ms-2">last update: 11.12.24</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
<li><a href="mail-template.html" target="_blank" rel="noopener">Email template</a><span class="badge bg-success rounded-pill ms-2">new: 14.01.25</span><span class="badge bg-secondary rounded-pill ms-2">OK Dev</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -220,7 +220,7 @@
|
|||
<li class="invitation">
|
||||
<div class="user-avatar"><img src="static/img/avatars/55238.jpg" alt="Priscilla"></div>
|
||||
<div>
|
||||
<h2 class="h6 user-pseudo">Priscilla</h2>
|
||||
<h2 class="h5 user-pseudo">Priscilla</h2>
|
||||
<p class="date">Envoyée le 12.12.2024</p>
|
||||
</div>
|
||||
<div class="invitation-options ms-auto">
|
||||
|
|
@ -235,7 +235,7 @@
|
|||
<li class="invitation">
|
||||
<div class="user-avatar"><img src="static/img/avatars/default-avatar.svg" alt="Eric B."></div>
|
||||
<div>
|
||||
<h2 class="h6 user-pseudo">Eric B.</h2>
|
||||
<h2 class="h5 user-pseudo">Eric B.</h2>
|
||||
<p class="date">Envoyée le 16.12.2024</p>
|
||||
</div>
|
||||
<div class="invitation-options ms-auto">
|
||||
|
|
@ -253,7 +253,7 @@
|
|||
<li class="invitation">
|
||||
<div class="user-avatar"><img src="static/img/avatars/t800.jpg" alt="T800"></div>
|
||||
<div>
|
||||
<h2 class="h6 user-pseudo">T800</h2>
|
||||
<h2 class="h5 user-pseudo">T800</h2>
|
||||
<p class="date">Reçue le 10.12.2024</p>
|
||||
</div>
|
||||
<div class="invitation-options ms-auto">
|
||||
|
|
@ -274,7 +274,7 @@
|
|||
<li class="invitation">
|
||||
<div class="user-avatar"><img src="static/img/avatars/default-avatar.svg" alt="Utilisateur"></div>
|
||||
<div>
|
||||
<h2 class="h6 user-pseudo">Utilisateur avec un nom à rallonge</h2>
|
||||
<h2 class="h5 user-pseudo">Utilisateur avec un nom à rallonge</h2>
|
||||
<p class="date">Reçue le 12.12.2024</p>
|
||||
</div>
|
||||
<div class="invitation-options ms-auto">
|
||||
|
|
|
|||
363
my-tandems.html
Normal file
363
my-tandems.html
Normal file
|
|
@ -0,0 +1,363 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>e-TANDEM · Mes TANDEMs</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="robots" content="noindex">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="Blabla">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
|
||||
<link href="static/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="static/css/main.css" rel="stylesheet">
|
||||
<script src="static/js/vendor/bootstrap.bundle.min.js"></script>
|
||||
<script src="static/js/js.js"></script>
|
||||
</head>
|
||||
|
||||
<body data-platform="public" data-screen="invitations">
|
||||
<header class="top-bar fixed-top">
|
||||
<div class="d-grid gap-3 align-items-center">
|
||||
<nav class="navbar navbar-expand-lg bg-body-tertiary" aria-label="Main navigation">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="home.html">
|
||||
<img src="static/img/logo/logo_e-tandem_fr.svg">
|
||||
</a>
|
||||
<button type="button" id="menu-toggle" class="navbar-toggler border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#main-nav" aria-controls="main-nav" aria-label="Toggle main menu">
|
||||
<span class="custom-toggler navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="offcanvas offcanvas-end" tabindex="-1" id="main-nav" aria-label="Main menu" data-bs-scroll="false">
|
||||
<!-- <div class="offcanvas-header">
|
||||
<button type="button" type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close main menu"></button>
|
||||
</div> -->
|
||||
<div class="offcanvas-body">
|
||||
<nav class="side-menu" id="offside-menu">
|
||||
<div class="user-avatar">
|
||||
<img src="static/img/avatars/default-avatar.svg" alt="Priscilla">
|
||||
<p class="user-pseudo">Forum du Bilinguisme</p>
|
||||
</div>
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a href="tandem-list.html" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon-ui" fill="none" class="icon-ui" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m15.75 15.75-2.489-2.489m0 0a3.375 3.375 0 1 0-4.773-4.773 3.375 3.375 0 0 0 4.774 4.774ZM21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
Rechercher des TANDEMs</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link active" aria-current="page">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon-ui" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M20.25 8.511c.884.284 1.5 1.128 1.5 2.097v4.286c0 1.136-.847 2.1-1.98 2.193-.34.027-.68.052-1.02.072v3.091l-3-3c-1.354 0-2.694-.055-4.02-.163a2.115 2.115 0 0 1-.825-.242m9.345-8.334a2.126 2.126 0 0 0-.476-.095 48.64 48.64 0 0 0-8.048 0c-1.131.094-1.976 1.057-1.976 2.192v4.286c0 .837.46 1.58 1.155 1.951m9.345-8.334V6.637c0-1.621-1.152-3.026-2.76-3.235A48.455 48.455 0 0 0 11.25 3c-2.115 0-4.198.137-6.24.402-1.608.209-2.76 1.614-2.76 3.235v6.226c0 1.621 1.152 3.026 2.76 3.235.577.075 1.157.14 1.74.194V21l4.155-4.155" />
|
||||
</svg>
|
||||
Mes TANDEMs
|
||||
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="profile.html" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon-ui" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M15 9h3.75M15 12h3.75M15 15h3.75M4.5 19.5h15a2.25 2.25 0 0 0 2.25-2.25V6.75A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25v10.5A2.25 2.25 0 0 0 4.5 19.5Zm6-10.125a1.875 1.875 0 1 1-3.75 0 1.875 1.875 0 0 1 3.75 0Zm1.294 6.336a6.721 6.721 0 0 1-3.17.789 6.721 6.721 0 0 1-3.168-.789 3.376 3.376 0 0 1 6.338 0Z" />
|
||||
</svg>
|
||||
Mon profil</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon-ui" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m7.875 14.25 1.214 1.942a2.25 2.25 0 0 0 1.908 1.058h2.006c.776 0 1.497-.4 1.908-1.058l1.214-1.942M2.41 9h4.636a2.25 2.25 0 0 1 1.872 1.002l.164.246a2.25 2.25 0 0 0 1.872 1.002h2.092a2.25 2.25 0 0 0 1.872-1.002l.164-.246A2.25 2.25 0 0 1 16.954 9h4.636M2.41 9a2.25 2.25 0 0 0-.16.832V12a2.25 2.25 0 0 0 2.25 2.25h15A2.25 2.25 0 0 0 21.75 12V9.832c0-.287-.055-.57-.16-.832M2.41 9a2.25 2.25 0 0 1 .382-.632l3.285-3.832a2.25 2.25 0 0 1 1.708-.786h8.43c.657 0 1.281.287 1.709.786l3.284 3.832c.163.19.291.404.382.632M4.5 20.25h15A2.25 2.25 0 0 0 21.75 18v-2.625c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125V18a2.25 2.25 0 0 0 2.25 2.25Z" />
|
||||
</svg>
|
||||
Gestion des demandes<span class="badge rounded-pill ms-2">101</span></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon-ui" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 3v11.25A2.25 2.25 0 0 0 6 16.5h2.25M3.75 3h-1.5m1.5 0h16.5m0 0h1.5m-1.5 0v11.25A2.25 2.25 0 0 1 18 16.5h-2.25m-7.5 0h7.5m-7.5 0-1 3m8.5-3 1 3m0 0 .5 1.5m-.5-1.5h-9.5m0 0-.5 1.5m.75-9 3-3 2.148 2.148A12.061 12.061 0 0 1 16.5 7.605" />
|
||||
</svg>
|
||||
Statistiques</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="documents.html" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon-ui" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18a8.967 8.967 0 0 0-6 2.292m0-14.25v14.25" />
|
||||
</svg>
|
||||
Espace documentaire</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="separator menu-admin">
|
||||
<a class="btn-link" data-bs-toggle="collapse" href="#side-menu-admin" role="button" aria-expanded="false" aria-controls="side-menu-admin">Administration</a>
|
||||
</div>
|
||||
<div id="side-menu-admin" class="collapse">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon-ui">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M18 18.72a9.094 9.094 0 0 0 3.741-.479 3 3 0 0 0-4.682-2.72m.94 3.198.001.031c0 .225-.012.447-.037.666A11.944 11.944 0 0 1 12 21c-2.17 0-4.207-.576-5.963-1.584A6.062 6.062 0 0 1 6 18.719m12 0a5.971 5.971 0 0 0-.941-3.197m0 0A5.995 5.995 0 0 0 12 12.75a5.995 5.995 0 0 0-5.058 2.772m0 0a3 3 0 0 0-4.681 2.72 8.986 8.986 0 0 0 3.74.477m.94-3.197a5.971 5.971 0 0 0-.94 3.197M15 6.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm6 3a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Zm-13.5 0a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Z" />
|
||||
</svg>
|
||||
Gérer les comptes</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon-ui">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126ZM12 15.75h.007v.008H12v-.008Z" />
|
||||
</svg>
|
||||
Gérer les signalements</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon-ui">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m10.5 21 5.25-11.25L21 21m-9-3h7.5M3 5.621a48.474 48.474 0 0 1 6-.371m0 0c1.12 0 2.233.038 3.334.114M9 5.25V3m3.334 2.364C11.176 10.658 7.69 15.08 3 17.502m9.334-12.138c.896.061 1.785.147 2.666.257m-4.589 8.495a18.023 18.023 0 0 1-3.827-5.802" />
|
||||
</svg>
|
||||
Langues</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon-ui">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z" />
|
||||
</svg>
|
||||
Dictionnaire</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
<div id="side-lang" class="ms-auto">
|
||||
<div class="col">
|
||||
<label for="lang">Choisir la langue</label>
|
||||
<select id="lang" class="lang-select form-select form-select-sm" aria-label="Select language">
|
||||
<option selected>Français</option>
|
||||
<option>Deutsch</option>
|
||||
<option>Italiano</option>
|
||||
<option>Rumantsch</option>
|
||||
<option>English</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="hero hero-secondary container-fluid">
|
||||
<div>
|
||||
<div class="row">
|
||||
<div class="col-lg-6 bottom-anchored order-2 order-lg-1 ">
|
||||
<img class="img-fluid" src="static/img/ban-5.png">
|
||||
</div>
|
||||
<div class="col-lg-6 order-1 order-lg-2">
|
||||
<h1 class="display-5 fw-bold">Mes TANDEMs</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="container-fluid">
|
||||
<div class="row my-3">
|
||||
<div id="second-nav" class="col-lg-3">
|
||||
<nav class="side-menu">
|
||||
<ul class="nav flex-column mb-auto">
|
||||
<li class="nav-item">
|
||||
<a href="tandem-list.html" role="menuitem" class="nav-link">Rechercher des TANDEMs</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link active" aria-current="page">Mes TANDEMs</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="profile.html" role="menuitem" class="nav-link">Mon profil</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">Gestion des demandes</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">Statistiques</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="documents.html" role="menuitem" class="nav-link">Espace documentaire</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="separator menu-admin">Admin</div>
|
||||
<ul class="nav flex-column mb-auto">
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">Gérer les comptes</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">Gérer les signalements</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">Langues</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#" role="menuitem" class="nav-link">Dictionnaire</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<section id="invitations-list" class="col-lg-8">
|
||||
|
||||
<div id="invitations-results">
|
||||
<!-- <div class="invitation">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<div class="user-avatar">
|
||||
<img src="static/img/avatars/default-avatar.svg" alt="Priscilla">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto col-md-6">
|
||||
<h5 class="user-pseudo fw-bold">Priscilla</h5>
|
||||
<p>Demande envoyée le 12.12.2024</p>
|
||||
</div>
|
||||
<div class="invitation-options col-md-auto">
|
||||
<button type="button" class="btn btn-cta rounded" data-bs-toggle="modal" data-bs-target="#alert-modal">Annuler cette demande</button>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<section class="panel">
|
||||
<h1 class="fs-2">TANDEMs en cours</h1>
|
||||
<ul id="current-tandems" class="mt-4">
|
||||
<li class="tandem">
|
||||
<div class="user-avatar"><img src="static/img/avatars/55238.jpg" alt="Priscilla"></div>
|
||||
<div>
|
||||
<h2 class="h5 user-pseudo">Priscilla</h2>
|
||||
<p>priscilla@mail.ch</p>
|
||||
<p>Allemand, Suisse-allemand, Anglais</p>
|
||||
<p class="date">TANDEM commencé le 15.01.2025</p>
|
||||
</div>
|
||||
<div class="tandem-options ms-auto">
|
||||
<button type="button" class="btn btn-icon ms-auto" data-bs-toggle="modal" data-bs-target="#stop-modal">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon-ui">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
<span>Mettre fin au TANDEM</span>
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="panel mt-4">
|
||||
<h1 class="fs-2">Historique des TANDEMs</h1>
|
||||
<ul id="archived-tandems" class="mt-4">
|
||||
<li class="tandem">
|
||||
<div class="user-avatar"><img src="static/img/avatars/default-avatar.svg" alt="Eric B."></div>
|
||||
<div>
|
||||
<h2 class="h6 user-pseudo">Eric B.</h2>
|
||||
<p>Français, Anglais</p>
|
||||
<p class="date">TANDEM commencé le 16.12.2024 | Terminé le 01:01.2025</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tandem">
|
||||
<div class="user-avatar"><img src="static/img/avatars/default-avatar.svg" alt="Utilisateur"></div>
|
||||
<div>
|
||||
<h2 class="h6 user-pseudo">Utilisateur avec un nom à rallonge</h2>
|
||||
<p>Allemand, Portugais</p>
|
||||
<p class="date">TANDEM commencé le 16.12.2024 | Terminé le 01:01.2025</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tandem">
|
||||
<div class="user-avatar"><img src="static/img/avatars/t800.jpg" alt="T800"></div>
|
||||
<div>
|
||||
<h2 class="h6 user-pseudo">T800</h2>
|
||||
<p>Assembleur, binaire</p>
|
||||
<p class="date">TANDEM commencé le 16.12.2024 | Terminé le 01:01.2025</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
</main>
|
||||
<footer>
|
||||
<div class="container">
|
||||
<div class="row row-cols-1 row-cols-sm-2 row-cols-lg-5 py-5">
|
||||
<div class="col mb-3">
|
||||
<a href="https://www.bilinguisme.ch/" target="_blank" rel="noopener"><img class="img-fluid" src="static/img/logo/forum-bilinguisme.svg" alt="Forum du Bilinguisme"></a>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<h5>Forum du bilinguisme</h5>
|
||||
<p>
|
||||
Place Robert-Walser 7, CP 439<br>
|
||||
2501 Biel/Bienne
|
||||
</p>
|
||||
<a class="text-link" href="mailto:support@e-tandem.ch">support@e-tandem.ch</a>
|
||||
<br>
|
||||
<a class="text-link" href="tel:+41 32 323 22 80">+41 32 323 22 80</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="stop-modal" tabindex="-1" aria-label="Mettre fin au TANDEM" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Mettre fin au TANDEM avec<br>{ userPseudo }</h5>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form>
|
||||
<p>Vous allez mettre fin au TANDEM avec { userPseudo }, veuillez confirmer votre action.</p>
|
||||
<p>En cliquant sur arrêter, { userPseudo } sera notifié de votre décision.</p>
|
||||
<input type="hidden" id="user-id" name="user-id" value="678910" />
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
|
||||
<button type="submit" class="btn btn-primary">Arrêter</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="deny-modal" tabindex="-1" aria-label="Refuser la demande de TANDEM" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Refuser le TANDEM avec<br>{ userPseudo }</h5>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form>
|
||||
<p>Vous allez refuser la demande de TANDEM effectuée par { userPseudo }, veuillez confirmer votre action.</p>
|
||||
<p>En cliquant sur Refuser, { userPseudo } sera notifié de ce refus.</p>
|
||||
<input type="hidden" id="user-id" name="user-id" value="678910" />
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
|
||||
<button type="submit" class="btn btn-primary">Refuser</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="accept-modal" tabindex="-1" aria-label="Accepter la demande de TANDEM" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Accepter le TANDEM avec<br>{ userPseudo }</h5>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form>
|
||||
<p>Vous allez accepter la demande de TANDEM effectuée par { userPseudo }.</p>
|
||||
<p>En cliquant sur Accepter, { userPseudo } sera notifié de votre acceptation et vous pourrez commencer votre TANDEM immédiatement.</p>
|
||||
<input type="hidden" id="user-id" name="user-id" value="678910" />
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
|
||||
<button type="submit" class="btn btn-primary">Accepter</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -288,34 +288,38 @@ article li:not(:first-of-type){
|
|||
padding-left: 0;
|
||||
margin-bottom: 0
|
||||
}
|
||||
.invitation{
|
||||
.invitation, .tandem{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2rem;
|
||||
border-top: 1px dotted var(--bs-gray-400);
|
||||
padding-top: .75rem;
|
||||
}
|
||||
.invitation .user-pseudo{
|
||||
.invitation .user-pseudo, .tandem .user-pseudo{
|
||||
margin-bottom: 0.125rem;
|
||||
}
|
||||
.invitation:not(:first-of-type){
|
||||
.invitation:not(:first-of-type), .tandem:not(:first-of-type){
|
||||
margin-top: .75rem;
|
||||
}
|
||||
.invitation .user-avatar img{
|
||||
.invitation .user-avatar img, .tandem .user-avatar img{
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
}
|
||||
#current-tandems .user-avatar img{
|
||||
width: 5rem;
|
||||
height: 5rem;
|
||||
}
|
||||
p.date{
|
||||
font-size: 0.8em;
|
||||
color: var(--bs-gray-600);
|
||||
margin-bottom: 0.5rem;
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
h2.date{
|
||||
color: var(--bs-gray-600);
|
||||
border-bottom: 1px solid var(--bs-gray-600);
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
.invitation-options{
|
||||
.invitation-options, .tandem-options{
|
||||
margin-left: auto;
|
||||
align-self: center;
|
||||
}
|
||||
|
|
@ -462,7 +466,7 @@ table#reports-todo tr:not(:first-of-type) {
|
|||
border-top: 1px dotted var(--bs-gray-400);
|
||||
padding-top: .75rem;
|
||||
}
|
||||
.report p:not(.date){
|
||||
.report p:not(.date), .tandem p:not(.date){
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#lang-level-list{
|
||||
|
|
@ -624,10 +628,10 @@ nav .icon-ui{
|
|||
.profile .user-pseudo{
|
||||
margin: .5em auto;
|
||||
}
|
||||
.invitation{
|
||||
.invitation, .tandem{
|
||||
gap: 1rem;
|
||||
}
|
||||
.invitation .user-pseudo{
|
||||
.invitation .user-pseudo, .tandem .user-pseudo{
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
|
@ -641,13 +645,13 @@ nav .icon-ui{
|
|||
#avatar-container{
|
||||
text-align: center;
|
||||
}
|
||||
.profile-options, .invitation-options{
|
||||
.profile-options, .invitation-options, .tandem-options{
|
||||
display: grid;
|
||||
gap: 0 .5rem;
|
||||
width: fit-content;
|
||||
margin: calc(var(--div-padding) / 3) auto 0;
|
||||
}
|
||||
.invitation-options{
|
||||
.invitation-options, .tandem-options{
|
||||
margin: 0;
|
||||
}
|
||||
.offcanvas .user-avatar{
|
||||
|
|
@ -713,10 +717,10 @@ nav .icon-ui{
|
|||
.separator.menu-admin > .btn-link{
|
||||
padding: .725rem 1rem .725rem 0;
|
||||
}
|
||||
.invitation-options button span{
|
||||
.invitation-options button span, .tandem-options button span{
|
||||
display: none;
|
||||
}
|
||||
.invitation-options button .icon-ui{
|
||||
.invitation-options button .icon-ui, .tandem-options button .icon-ui{
|
||||
margin: 0;
|
||||
}
|
||||
table#reports-todo td, table#reports-todo td:first-child{
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
|
||||
<defs>
|
||||
<radialGradient id="Dégradé_sans_nom" data-name="Dégradé sans nom" cx="388.66" cy="124.27" fx="388.66" fy="124.27" r="376" gradientTransform="translate(-8.62 340.61) scale(.68 -.68)" gradientUnits="userSpaceOnUse">
|
||||
<radialGradient id="gradient1" data-name="gradient1" cx="388.66" cy="124.27" fx="388.66" fy="124.27" r="376" gradientTransform="translate(-8.62 340.61) scale(.68 -.68)" gradientUnits="userSpaceOnUse">
|
||||
<stop offset=".9" stop-color="#f0f0f0" stop-opacity="0"/>
|
||||
<stop offset=".99" stop-color="#5b5b5b" stop-opacity=".09"/>
|
||||
<stop offset="1" stop-color="#000" stop-opacity=".15"/>
|
||||
|
|
@ -14,9 +14,9 @@
|
|||
<path d="M287.23,195.04c9.27-.02,16.76-7.55,16.73-16.81-.03-9.26-7.55-16.75-16.82-16.72-9.26.03-16.75,7.55-16.72,16.81.03,9.26,7.55,16.75,16.81,16.73h0Z" style="fill: #fff;"/>
|
||||
<path d="M258.98,295.69c16.34-.04,29.54-13.33,29.5-29.67-.04-16.34-12.57-6.25-28.9-6.21-16.35.03-30.32-9.99-30.28,6.35s13.32,29.56,29.67,29.5v.03Z" style="fill: #fff;"/>
|
||||
</g>
|
||||
<g id="Calque_2">
|
||||
<g>
|
||||
<path d="M88,228.93s16,125,77,148" style="fill: none; stroke: #fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 15px;"/>
|
||||
<g id="GyhAtZ">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M88.71,229.94c1.52.09,2.83.21,4.14.24,8.15.22,14.56-4.07,17.39-11.72.74-2,1.2-4.1,1.8-6.15,2.47-8.4,7.85-14.22,15.77-17.79.71-.32,1.42-.63,2.12-.98,3.71-1.84,3.74-5.53,1.71-8.2-1.38-1.82-3.35-2.71-5.5-3.22-7.65-1.84-15.07,2.32-17.57,9.82-.66,1.97-1.26,3.98-2.51,5.69-.43.59-.94,1.14-1.55,1.61.47-1.13.87-2.3,1.44-3.38.74-1.4.39-2.83.28-4.25-.6-7.65.03-15.19,1.86-22.65,1.33-5.39,2.58-10.8,3.82-16.21.35-1.54.63-3.12.1-4.69-.89-2.65-2.81-3.65-5.9-3.1-3.63.64-6.13,2.88-8.09,5.81-2.19,3.27-3.01,7-3.03,10.85-.02,4.33.31,8.66.44,12.99.11,3.77.13,7.55.19,11.32,0,.13-.01.26-.02.35.49.08-11.11-.59-14.43.16s-11.45,6.09-10.87,5.77c-.24-.42-.47-.83-.7-1.22-4.1-6.86-8.21-13.72-12.3-20.59-.84-1.41-1.58-2.87-2.42-4.28-.34-.56-.74-1.12-1.23-1.56-1.29-1.14-2.98-1.23-4.38-.24-2.49,1.75-3.4,4.32-3.46,7.23-.08,4.02,1.41,7.39,4.29,10.22,2.71,2.67,5.4,5.37,7.98,8.16,1.83,1.99,3.26,4.29,4.29,6.8.15.35.28.87.14,1.16-.89,1.8-.65,3.57.04,5.33.38.97.33,1.92.16,2.94-1.22,7.29.03,14.16,4.12,20.32,2.67,4.02,6.82,5.83,11.53,6.35,1.54.17,3.11.1,4.66.14.33,0,1.69-.25,2.77-.83.82-.44,2.92-2.23,2.92-2.23ZM93.96,186.34c-.03-.16-.05-.29-.07-.42-.53-3.52-1.18-7.02-1.58-10.55-.84-7.39-.9-14.8-.31-22.22.25-3.13.46-6.26-.18-9.38-.41-1.98-1.54-3.22-3.51-3.67-1.32-.3-2.61-.14-3.83.41-3.43,1.54-5.67,4.22-7.16,7.58-1.47,3.32-1.58,6.84-1.25,10.39.39,4.24,1.84,8.23,2.95,12.31,1.42,5.23,2.79,10.48,3.24,15.91.04.51.15,1.02.21,1.42l11.47-1.77ZM81.45,188.39s.02-.09,0-.13c-2.45-5.4-4.34-11-6.02-16.68-1.3-4.37-1.99-8.83-2.21-13.37-.12-2.36-.25-4.72-.58-7.06-.42-2.98-2.22-4.21-5.18-3.75-2.61.41-4.55,1.87-6,3.99-2.28,3.32-2.56,7.05-2.02,10.88.54,3.89,2.06,7.48,3.64,11.04,2.73,6.18,6.74,11.76,8.74,18.26,3.23-1.07,6.44-2.12,9.65-3.18Z" style="fill: #fff;"/>
|
||||
<path d="M93.96,186.34l-11.47,1.77c-.06-.4-.17-.91-.21-1.42-.45-5.43-1.82-10.68-3.24-15.91-1.11-4.07-2.56-8.06-2.95-12.31-.32-3.55-.22-7.06,1.25-10.39,1.49-3.36,3.73-6.04,7.16-7.58,1.22-.55,2.51-.71,3.83-.41,1.97.45,3.1,1.69,3.51,3.67.64,3.12.42,6.25.18,9.38-.59,7.42-.53,14.83.31,22.22.4,3.53,1.04,7.03,1.58,10.55.02.13.04.26.07.42Z" style="fill: #fff;"/>
|
||||
|
|
@ -24,5 +24,5 @@
|
|||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<circle cx="256" cy="256" r="256" style="fill: url(#Dégradé_sans_nom);"/>
|
||||
<circle cx="256" cy="256" r="256" style="fill: url(#gradient1);"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4 KiB |
Loading…
Add table
Add a link
Reference in a new issue