mobile header

This commit is contained in:
2023-11-29 21:17:30 +01:00
parent 4151b787f3
commit 0bf78c9d28
2 changed files with 17 additions and 5 deletions
+5 -1
View File
@@ -215,7 +215,7 @@ header {
object-fit: contain; } object-fit: contain; }
@media (max-width: 891px) { @media (max-width: 891px) {
header .region-header #block-reha-logoministere { header .region-header #block-reha-logoministere {
width: 150px; width: 10%;
padding-left: 1rem; } } padding-left: 1rem; } }
header .region-header #block-reha-logoreha { header .region-header #block-reha-logoreha {
display: none; display: none;
@@ -234,6 +234,10 @@ header {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: fit-content; } height: fit-content; }
@media (max-width: 891px) {
header .region-header #block-reha-connexionutilisateur {
width: 10%;
padding-left: 1rem; } }
header .region-header #block-reha-connexionutilisateur .bouton-connexion { header .region-header #block-reha-connexionutilisateur .bouton-connexion {
padding-right: 3rem; } padding-right: 3rem; }
header .region-header #block-reha-connexionutilisateur .bouton-connexion :before { header .region-header #block-reha-connexionutilisateur .bouton-connexion :before {
@@ -32,7 +32,7 @@ header{
object-fit: contain; object-fit: contain;
} }
@media (max-width:891px) { @media (max-width:891px) {
width: 150px; width: 10%;
padding-left: 1rem; padding-left: 1rem;
} }
@@ -55,17 +55,25 @@ header{
} }
#block-reha-connexionutilisateur{ #block-reha-connexionutilisateur{
grid-column: 9; grid-column: 9;
display: flex;
flex-direction: column;
height: fit-content;
@media (max-width:891px) {
width: 10%;
padding-left: 1rem;
}
.bouton-connexion{ .bouton-connexion{
padding-right: 3rem; padding-right: 3rem;
:before{ :before{
content: url(../images/noun-contact-2495375.svg); content: url(../images/noun-contact-2495375.svg);
padding-right: 1rem; padding-right: 1rem;
} }
} }
display: flex;
flex-direction: column;
height: fit-content;
.connexion{ .connexion{
height: 0; /* Hauteur initiale à 0 pour créer l'effet de glissement vers le bas */ height: 0; /* Hauteur initiale à 0 pour créer l'effet de glissement vers le bas */
width: 100%; width: 100%;