Ajouter responsiveness au header #93

Merged
vlbeaudoin merged 21 commits from feature/responsive-header into main 2023-08-16 13:43:50 -04:00
2 changed files with 11 additions and 9 deletions
Showing only changes of commit 5ccbee3d9d - Show all commits

View file

@ -14,7 +14,11 @@ img {
body { body {
margin: 0; margin: 0;
padding-top: 75px; padding-top: 60px;
}
ul {
margin: 0;
} }
.wrapper { .wrapper {

View file

@ -4,7 +4,7 @@
width: 100%; width: 100%;
top: 0; top: 0;
background-color: #fff; background-color: #fff;
height: 75px; height: 60px;
} }
.headerWrapper { .headerWrapper {
@ -39,6 +39,7 @@ a:visited {
.headerMenuElement { .headerMenuElement {
padding-bottom: 5px; padding-bottom: 5px;
margin: 0;
} }
.headerMenuElement:hover { .headerMenuElement:hover {
@ -68,7 +69,7 @@ a:visited {
background-color: #fff; background-color: #fff;
display: flex; display: flex;
flex-flow: column; flex-flow: column;
justify-content: space-around; justify-content: center;
align-items: center; align-items: center;
text-align: left; text-align: left;
position: fixed; position: fixed;
@ -76,17 +77,14 @@ a:visited {
width: 100%; width: 100%;
height: 90%; height: 90%;
margin: 0; margin: 0;
padding-top: 200px; padding: auto;
padding-bottom: 200px;
} }
/* Le header s'affiche en menu hamburger pour les breakpoints téléphone et tablette */ /* Le header s'affiche en menu hamburger pour les breakpoints téléphone et tablette */
@media screen and (min-width: 778px) { @media screen and (min-width: 778px) {
.nav-is-active { .nav-is-active {
font-size: 3rem; font-size: 2rem;
/*48px*/ /*32px*/
padding-top: 100px;
padding-bottom: 100px;
} }
} }