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

Made hover media query and fixed bug leading to link inconsistencies

Browse source
This commit is contained in:
ericb 2024-11-26 16:45:15 +01:00
parent 35ec8b06a2
commit 916fe4c01b
1 changed files with 30 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

58
static/css/main.css
View file

@ -75,9 +75,7 @@ body {
}
/* side menu */
.side-menu .nav-item{
position: relative;
}
.side-menu .nav-link{
color: black;
padding: 0.725rem 1rem;
@ -86,18 +84,13 @@ body {
border-left: 0px solid #f28705;
transition: all ease-in 0.25s;
}
.side-menu .nav-link:active, .side-menu .nav-link.active{
.side-menu .nav-link.active{
background-color: #f28705;
font-weight: 700;
pointer-events: none;
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{
color: black;
background-color: #fdc314;
@ -168,14 +161,7 @@ body {
padding: 1.5rem;
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{
margin-bottom: 1rem;
}
@ -273,11 +259,6 @@ article li:not(:first-of-type){
padding: 0.5em 1.5em;
border: none;
}
.btn-hero-primary:hover{
background-color: var(--primary);
/* border-color: var(--primary); */
color: white;
}
.btn-hero-secondary{
border-color: var(--primary);
@ -290,11 +271,7 @@ article li:not(:first-of-type){
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{
font-size: 1em;
}
@ -430,4 +407,29 @@ footer a img{
.partners-logo-grid{
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;
}
}