bachir/drupal-reha
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

css header & footer

Browse Source
This commit is contained in:
ouidade
2023-11-23 11:20:35 +01:00
parent 19320aa20a
commit fd3f2e013f
8 changed files with 257 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/reha/scss/partials/_header.scss
+65 -41
View File
@@ -15,59 +15,94 @@ header{
// position: fixed;
// }
div{
display:flex;
flex-direction: row;
justify-content: space-between;
display: inline-grid;
align-items: center;
grid-template-columns: repeat(10, 1fr) ;
#block-reha-logoministere{
grid-column: 1;
width: fit-content;
padding-left: 4rem;
height: $header-height;
}
#block-reha-logoreha{
grid-column: 2;
max-height: 90%;
img{
// max-height: ;
height: $header-height;
.field--name-field-logo{
height: $header-height;
.field__item{
height: $header-height;
img{
height: 150px;
width: fit-content;
}
}
}
}
#block-reha-connexionutilisateur{
grid-column: 9;
.bouton-connexion{
padding-right: 3rem;
:before{
content: url(../images/noun-contact-2495375.svg);
padding-right: 1rem;
}
}
display: flex;
flex-direction: column;
width: 15%;
height: $header-height;
.user-login-form{
display: none;
// transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */
background-color: $white;
width: 100%;
height: 100vh;
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
clip-path: inset(0px -10px -10px -10px);
padding: 5% 10% 5% 5%;
}
ul{
display: none;
// transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */
background-color: $white;
width: 100%;
height: 100vh;
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
clip-path: inset(0px -10px -10px -10px);
padding: 5% 10% 5% 5%;
}
}
#block-reha-config-pages{
width:35%;
grid-column: 10;
.bouton-contact{
padding-right: 4rem;
::before{
content: url(../images/noun-letter-1064628.svg);
padding-right: 1rem;
}
}
display: flex;
flex-direction: column;
height: $header-height;
.bouton{
align-self: flex-end;
width: 50%;
}
.config_pages--contact--full {
float: right;
display: none; /* Cacher initialement le contenu */
height: 0; /* Hauteur initiale à 0 pour créer l'effet de glissement vers le bas */
// transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */
width: 100%;
}
// .open{
// display: block;
// width: 300px;
// background-color: $white;
// }
}
.field--type-text-long {
transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */
@@ -80,29 +115,18 @@ header{
.field__item{
padding: 5% 10% 5% 5%;
}
}
}
// #block-reha-config-pages {
// position: relative;
// }
// .config_pages--contact--full {
// overflow: hidden;
// height: 0; /* Hauteur initiale à 0 pour créer l'effet de glissement vers le bas */
// transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */
// }
// .field--type-text-long {
// padding: 20px;
// background-color: #f0f0f0;
// }
}
.bouton{
align-self: flex-end;
width: fit-content;
h2{
text-transform: lowercase;
display: inline-flex;
}
}
}