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

js header smoozer

Browse Source
This commit is contained in:
ouidade
2023-11-23 16:07:57 +01:00
parent a022b2272e
commit ec8b09383a
3 changed files with 22 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/reha/css/reha.css
+9 -13
View File
@@ -209,22 +209,18 @@ header {
padding-right: 1rem; } padding-right: 1rem; }
header div #block-reha-config-pages .config_pages--contact--full { header div #block-reha-config-pages .config_pages--contact--full {
float: right; float: right;
display: none;
/* Cacher initialement le contenu */
height: 0; height: 0;
/* Hauteur initiale à 0 pour créer l'effet de glissement vers le bas */ /* Hauteur initiale à 0 pour créer l'effet de glissement vers le bas */
width: 100%; } width: 100%; }
header div #block-reha-config-pages .field--type-text-long { header div #block-reha-config-pages .config_pages--contact--full .field--type-text-long {
transition: height 0.5s; display: none;
/* Animation de 0.5 seconde lors de l'expansion vers le bas */ background-color: white;
background-color: white; width: 400px;
display: block; height: 100vh;
width: 100%; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
height: 100vh; clip-path: inset(0px -10px -10px -10px); }
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; header div #block-reha-config-pages .config_pages--contact--full .field--type-text-long .field__item {
clip-path: inset(0px -10px -10px -10px); } padding: 5% 10% 5% 5%; }
header div #block-reha-config-pages .field--type-text-long .field__item {
padding: 5% 10% 5% 5%; }
header .bouton { header .bouton {
align-self: flex-end; align-self: flex-end;
width: fit-content; } width: fit-content; }
web/themes/custom/reha/js/reha.js
+1 -1
View File
@@ -25,7 +25,7 @@ jQuery(document).ready(function($){
$(document).ready(function() { $(document).ready(function() {
$(".bouton-contact").click(function(event) { $(".bouton-contact").click(function(event) {
$(".config_pages--contact--full").slideToggle(); $(".field--type-text-long").slideToggle();
}); });
}); });
web/themes/custom/reha/scss/partials/_header.scss
+12 -36
View File
@@ -56,9 +56,7 @@ header{
height: fit-content; height: fit-content;
.connexion{ .connexion{
float: right; float: right;
// display: none; /* Cacher initialement le contenu */
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 */
// transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */
width: 100%; width: 100%;
position: relative; position: relative;
.connexion-full{ .connexion-full{
@@ -74,26 +72,6 @@ header{
} }
} }
// .user-login-form{
// display: none;
// 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{ #block-reha-config-pages{
grid-column: 10; grid-column: 10;
@@ -110,24 +88,22 @@ header{
.config_pages--contact--full { .config_pages--contact--full {
float: right; float: right;
display: none; /* Cacher initialement le contenu */
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 */
// transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */
width: 100%; width: 100%;
} .field--type-text-long {
display: none;
.field--type-text-long { background-color: $white;
transition: height 0.5s; /* Animation de 0.5 seconde lors de l'expansion vers le bas */ width: 400px;
background-color: $white; height: 100vh;
display: block; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
width: 100%; clip-path: inset(0px -10px -10px -10px);
height: 100vh; .field__item{
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; padding: 5% 10% 5% 5%;
clip-path: inset(0px -10px -10px -10px); }
.field__item{
padding: 5% 10% 5% 5%;
} }
} }
} }
} }