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

Compare commits

base: eric:916fe4c01b258cb66ffcc5ce034542115e8f1a7e
Branches Tags
eric:main
..
compare: eric:8bf2721b4163045b1c782cc761de2cd39745cec2
Branches Tags
eric:main

No commits in common. "916fe4c01b258cb66ffcc5ce034542115e8f1a7e" and "8bf2721b4163045b1c782cc761de2cd39745cec2" have entirely different histories.
916fe4c01b ... 8bf2721b41

2 changed files with 38 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

58
static/css/main.css
View file

@ -75,7 +75,9 @@ body {
} }
/* side menu */ /* side menu */
.side-menu .nav-item{
position: relative;
}
.side-menu .nav-link{ .side-menu .nav-link{
color: black; color: black;
padding: 0.725rem 1rem; padding: 0.725rem 1rem;
@ -84,13 +86,18 @@ body {
border-left: 0px solid #f28705; border-left: 0px solid #f28705;
transition: all ease-in 0.25s; transition: all ease-in 0.25s;
} }
.side-menu .nav-link.active{ .side-menu .nav-link:active, .side-menu .nav-link.active{
background-color: #f28705; background-color: #f28705;
font-weight: 700; font-weight: 700;
pointer-events: none; pointer-events: none;
cursor: default; cursor: default;
} }
.side-menu .nav-link:not(.active):hover{
color: black;
background: #fdc314;
border-left: 6px solid #f28705;
transition: all ease-in 0.25s;
}
.side-menu .nav-link:focus{ .side-menu .nav-link:focus{
color: black; color: black;
background-color: #fdc314; background-color: #fdc314;
@ -161,7 +168,14 @@ body {
padding: 1.5rem; padding: 1.5rem;
transition: all ease-out 0.3s; transition: all ease-out 0.3s;
} }
#tandem-meet .col:hover{
background-color: var(--accent-light);
border-radius: 0.5rem;
transition: all ease-out 0.3s;
}
#tandem-meet .col:hover .form-check-input{
--bs-border-color: var(--primary);
}
#tandem-meet .col img{ #tandem-meet .col img{
margin-bottom: 1rem; margin-bottom: 1rem;
} }
@ -259,6 +273,11 @@ article li:not(:first-of-type){
padding: 0.5em 1.5em; padding: 0.5em 1.5em;
border: none; border: none;
} }
.btn-hero-primary:hover{
background-color: var(--primary);
/* border-color: var(--primary); */
color: white;
}
.btn-hero-secondary{ .btn-hero-secondary{
border-color: var(--primary); border-color: var(--primary);
@ -271,7 +290,11 @@ article li:not(:first-of-type){
padding: 0.5em 1.5em; padding: 0.5em 1.5em;
} }
.btn-cta:hover{
background-color: var(--accent-normal);
color: white;
border: 1px solid white;
}
.btn-cta, .btn-primary, .btn-secondary, .btn-outline-primary, .btn-outline-secondary{ .btn-cta, .btn-primary, .btn-secondary, .btn-outline-primary, .btn-outline-secondary{
font-size: 1em; font-size: 1em;
} }
@ -408,28 +431,3 @@ footer a img{
grid-template-columns: repeat(auto-fit, minmax(10em, 1fr)); grid-template-columns: repeat(auto-fit, minmax(10em, 1fr));
} }
} }
@media (hover: hover) {
.btn-cta:hover{
background-color: var(--accent-normal);
color: white;
border: 1px solid white;
}
#tandem-meet .col:hover{
background-color: var(--accent-light);
border-radius: 0.5rem;
transition: all ease-out 0.3s;
}
#tandem-meet .col:hover .form-check-input{
--bs-border-color: var(--primary);
}
.btn-hero-primary:hover{
background-color: var(--primary);
color: white;
}
.side-menu .nav-link:not(.active):hover{
color: black;
background: #fdc314;
border-left: 6px solid #f28705;
transition: all ease-in 0.25s;
}
}

29
tandem-list.html
View file

@ -31,40 +31,25 @@
<nav class="side-menu" id="offSideMenu"> <nav class="side-menu" id="offSideMenu">
<ul class="nav flex-column mb-auto"> <ul class="nav flex-column mb-auto">
<li class="nav-item"> <li class="nav-item">
<a href="#"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>
</li> </li>
<li> <li>
<a href="#" class="nav-link">Mes TANDEMs</a> <a href="#" role="menuitem" class="nav-link">Mes TANDEMs</a>
</li> </li>
<li> <li>
<a href="profile.html" class="nav-link">Modifier mon profil</a> <a href="profile.html" role="menuitem" class="nav-link">Modifier mon profil</a>
</li> </li>
<li> <li>
<a href="#" class="nav-link">Demandes reçues <span class="badge text-bg-secondary rounded-pill">101</span></a> <a href="#" role="menuitem" class="nav-link">Demandes reçues <span class="badge text-bg-secondary rounded-pill">101</span></a>
</li> </li>
<li> <li>
<a href="#" class="nav-link">Demandes envoyées</a> <a href="#" role="menuitem" class="nav-link">Demandes envoyées</a>
</li> </li>
<li> <li>
<a href="#" class="nav-link">Statistiques</a> <a href="#" role="menuitem" class="nav-link">Statistiques</a>
</li> </li>
<li> <li>
<a href="#" class="nav-link">Espace documentaire</a> <a href="#" role="menuitem" class="nav-link">Espace documentaire</a>
</li>
</ul>
<div class="menu-separator">Admin</div>
<ul class="nav flex-column mb-auto">
<li class="nav-item">
<a href="#" class="nav-link">Comptes</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">Signalements</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">Langues</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">Dictionnaire</a>
</li> </li>
</ul> </ul>
</nav> </nav>