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

fix anim header

Browse Source
This commit is contained in:
Ouidade Soussi Chiadmi
2024-07-15 14:30:53 +02:00
parent 7a3a139c3f
commit 119451da1a
6 changed files with 56 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
web/themes/custom/quartiers_de_demain/src/assets/scss/pages/partenaires.scss
View File

@@ -94,9 +94,10 @@
display: none;
}
&::after{
display: inline-block;
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.5rem;
padding-right: 0.2rem;
padding-left: 0.2rem;
}
}

21
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/animation-logo-header.scss
View File

@@ -2,35 +2,40 @@ header{
#block-quartiers-de-demain-logoquartiersdedemain{
.field_field_logo{
.qdd-header{
opacity: 0;
&.animated{
opacity: 1;
transform: scale(2);
@media(max-width:820px) {
transform: scale(1);
}
.blink-blue {
opacity: 0;
// animation: blink 3s 3;
animation-delay: 0.2s;
animation-name: blink;
animation-duration: 5s;
animation-duration: 10s;
}
.blink-red {
animation-delay: 0.4s;
opacity: 0;
animation-delay: 0.8s;
animation-name: blink;
animation-duration: 5s;
animation-duration: 10s;
}
.blink-black {
animation-delay: 0.6s;
opacity: 0;
animation-delay: 1.5s;
animation-name: blink;
animation-duration: 5s;
animation-duration: 10s;
}
.blink-black2 {
animation-delay: 0.8s;
opacity: 0;
animation-delay: 2s;
animation-name: blink;
animation-duration: 5s;
animation-duration: 10s;
}
@keyframes blink {
0%, 100% {

4
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/footer.scss
View File

@@ -57,8 +57,8 @@ footer{
img{
width: auto;
height: 40px;
padding-left: 1rem;
padding-bottom: 1rem;
// padding-left: 1rem;
padding-bottom: 0.2rem;
@media(max-width: 700px){
height: 30px;
padding-left: 0;

6
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/header.scss
View File

@@ -193,6 +193,9 @@ header{
width: 45%;
transform-origin: bottom right;
transition: all 1s ease-in-out;
.qdd-header{
opacity: 1 !important;
}
@media(max-width: 810px){
width: 100%;
height: 170px;
@@ -220,6 +223,9 @@ header{
width: 45%;
transform-origin: bottom right;
transition: all 0s ease-in-out;
.qdd-header{
opacity: 1 !important;
}
@media(max-width: 810px){
width: 100%;
height: 170px;