diff --git a/web/themes/custom/colloque2024/colloque2024.libraries.yml b/web/themes/custom/colloque2024/colloque2024.libraries.yml
index 994e11ea..3d645351 100644
--- a/web/themes/custom/colloque2024/colloque2024.libraries.yml
+++ b/web/themes/custom/colloque2024/colloque2024.libraries.yml
@@ -15,5 +15,7 @@ global-scripts:
js/lightbox.js: {}
js/script.js: {}
js/animation_home.js: {}
+ js/animation_aside.js: {}
+
dependencies:
- core/jquery
diff --git a/web/themes/custom/colloque2024/css-compiled/configs/animation.css b/web/themes/custom/colloque2024/css-compiled/configs/animation.css
new file mode 100644
index 00000000..d80ab65e
--- /dev/null
+++ b/web/themes/custom/colloque2024/css-compiled/configs/animation.css
@@ -0,0 +1,51 @@
+@keyframes pulse {
+ 0% {
+ transform: scale(0); }
+ 100% {
+ transform: scale(0.5); } }
+
+@keyframes slidein {
+ from {
+ transform: translateX(0%); }
+ to {
+ transform: translateX(100%); } }
+
+@keyframes dropDown {
+ from {
+ transform: translateY(0%); }
+ to {
+ transform: translateY(100%); } }
+
+@keyframes translateAnimation {
+ 0% {
+ transform: translateX(0);
+ /* Start translation */ }
+ 50% {
+ transform: translateX(200); }
+ 100% {
+ transform: translateX(500px);
+ /* End translation */ } }
+
+@keyframes changeColor {
+ 0% {
+ fill: #b9ce00;
+ /* Initial fill color */ }
+ 100% {
+ fill: #ff804d;
+ /* Final fill color */ } }
+
+@keyframes changeColor2 {
+ 0% {
+ fill: #038788;
+ /* Initial fill color */ }
+ 100% {
+ fill: #349a84;
+ /* Final fill color */ } }
+
+@keyframes traceAppear {
+ 0% {
+ opacity: 0; }
+ 80% {
+ opacity: 0; }
+ 100% {
+ opacity: 1; } }
diff --git a/web/themes/custom/colloque2024/css-compiled/index.css b/web/themes/custom/colloque2024/css-compiled/index.css
index 393d7815..50096ef4 100644
--- a/web/themes/custom/colloque2024/css-compiled/index.css
+++ b/web/themes/custom/colloque2024/css-compiled/index.css
@@ -715,6 +715,7 @@ header #block-colloque2024-mainnavigation ul li {
z-index: -1;
position: absolute;
width: 25%;
+ top: 0;
left: 0;
margin: auto;
padding: auto; }
diff --git a/web/themes/custom/colloque2024/css/configs/animation.scss b/web/themes/custom/colloque2024/css/configs/animation.scss
index 3dba4774..fdca4b98 100644
--- a/web/themes/custom/colloque2024/css/configs/animation.scss
+++ b/web/themes/custom/colloque2024/css/configs/animation.scss
@@ -43,4 +43,3 @@
}
-
diff --git a/web/themes/custom/colloque2024/css/pages/presentation.scss b/web/themes/custom/colloque2024/css/pages/presentation.scss
index 900a1be3..82aff371 100644
--- a/web/themes/custom/colloque2024/css/pages/presentation.scss
+++ b/web/themes/custom/colloque2024/css/pages/presentation.scss
@@ -35,12 +35,18 @@
z-index: -1;
position: absolute;
width: 25%;
+ top: 0;
left: 0;
margin: auto;
padding: auto;
svg{
margin: auto;
}
+
+
+
+
+
}
}
diff --git a/web/themes/custom/colloque2024/images/fond-rond-test.svg b/web/themes/custom/colloque2024/images/fond-rond-test.svg
new file mode 100644
index 00000000..fe7799ea
--- /dev/null
+++ b/web/themes/custom/colloque2024/images/fond-rond-test.svg
@@ -0,0 +1,121 @@
+
+
+
+
\ No newline at end of file
diff --git a/web/themes/custom/colloque2024/images/fond-ronds.svg b/web/themes/custom/colloque2024/images/fond-ronds.svg
index 579a52ae..287cfd1b 100644
--- a/web/themes/custom/colloque2024/images/fond-ronds.svg
+++ b/web/themes/custom/colloque2024/images/fond-ronds.svg
@@ -1,144 +1,118 @@
-
-
-
\ No newline at end of file
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/web/themes/custom/colloque2024/js/animation-aside.js b/web/themes/custom/colloque2024/js/animation-aside.js
deleted file mode 100644
index 9b008bb6..00000000
--- a/web/themes/custom/colloque2024/js/animation-aside.js
+++ /dev/null
@@ -1,21 +0,0 @@
-let dropdowns1 = document.getElementById('circle_vert_clair_erable_3');
-
- function slideDown() {
- let translateY = 0; // Position de départ (en bas)
- let duration = 17000; // Durée de l'animation en millisecondes
- let startTime = null; // Temps de départ de l'animation
- function animate(timestamp) {
- if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
- let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
- progress = Math.min(progress, 0.3); // Limite la progression à 0.3 (pour éviter un dépassement)
- translateY = 410 * progress * (0.48 - progress); // Réduction de la vitesse vers la fin de l'animation
- dropdown1.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
- if (progress < 0.999999) {
- requestAnimationFrame(animate);
- }
-}
-requestAnimationFrame(animate);
-}
-slideDown(); // Lancer l'animation lorsque la page est chargée
-
-
diff --git a/web/themes/custom/colloque2024/js/animation_aside.js b/web/themes/custom/colloque2024/js/animation_aside.js
new file mode 100644
index 00000000..2294e7c0
--- /dev/null
+++ b/web/themes/custom/colloque2024/js/animation_aside.js
@@ -0,0 +1,107 @@
+
+
+
+let asideDowns1 = document.getElementsByClassName('asideDown1');
+Array.from(asideDowns1).forEach(asideDown1 => {
+ function slideDown() {
+ let translateY = 0; // Position de départ (en bas)
+ let duration = 17000; // Durée de l'animation en millisecondes
+ let startTime = null; // Temps de départ de l'animation
+ function animate(timestamp) {
+ if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+ let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+ progress = Math.min(progress, 0.9); // Limite la progression à 0.3 (pour éviter un dépassement)
+ translateY = 410 * progress * (0.7 - progress); // Réduction de la vitesse vers la fin de l'animation
+ asideDown1.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
+ if (progress < 0.7) {
+ requestAnimationFrame(animate);
+ }
+ // if (progress >= 0.7) {
+ // // startTime = null;
+ // requestAnimationFrame(animate);
+
+ // }
+}
+requestAnimationFrame(animate);
+}
+slideDown(); // Lancer l'animation lorsque la page est chargée
+
+});
+
+
+let asideDowns2 = document.getElementsByClassName('asideDown2');
+Array.from(asideDowns2).forEach(asideDown2 => {
+ function slideDown() {
+ let translateY = 0; // Position de départ (en bas)
+ let duration = 25000; // Durée de l'animation en millisecondes
+ let startTime = null; // Temps de départ de l'animation
+ function animate(timestamp) {
+ if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+ let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+ progress = Math.min(progress, 1); // Limite la progression à 0.3 (pour éviter un dépassement)
+ translateY = 410 * progress * (0.7 - progress); // Réduction de la vitesse vers la fin de l'animation
+ asideDown2.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
+ if (progress < 0.7) {
+ requestAnimationFrame(animate);
+ }
+ // if (progress >= 0.7) {
+ // // startTime = null;
+ // requestAnimationFrame(animate);
+
+ // }
+}
+requestAnimationFrame(animate);
+}
+slideDown(); // Lancer l'animation lorsque la page est chargée
+
+});
+
+
+let asideDown3 = document.getElementById('circle_vert_clair_erable_6');
+ function slideDown() {
+ let translateY = 0; // Position de départ (en bas)
+ let duration = 23000; // Durée de l'animation en millisecondes
+ let startTime = null; // Temps de départ de l'animation
+ function animate(timestamp) {
+ if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+ let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+ progress = Math.min(progress, 1); // Limite la progression à 0.3 (pour éviter un dépassement)
+ translateY = 410 * progress * (0.7 - progress); // Réduction de la vitesse vers la fin de l'animation
+ asideDown3.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
+ if (progress < 0.7) {
+ requestAnimationFrame(animate);
+ }
+ // if (progress >= 0.7) {
+ // // startTime = null;
+ // requestAnimationFrame(animate);
+
+ // }
+}
+requestAnimationFrame(animate);
+}
+slideDown(); // Lancer l'animation lorsque la page est chargée
+
+
+
+
+// let moveups = document.getElementsByClassName('moveup');
+// console.log(moveups);
+// Array.from(moveups).forEach(moveup => {
+// function slideUp() {
+// let translateY = 0; // Position de départ (en bas)
+// let duration = 6000; // Durée de l'animation en millisecondes
+// let startTime = null; // Temps de départ de l'animation
+// function animate(timestamp) {
+// if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+// let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+// progress = Math.min(progress, 0.8); // Limite la progression à 1 (pour éviter un dépassement)
+// translateY = -10 * progress * (0.7 - progress); // Déplacement d'un pixel vers le haut à chaque itération
+// moveup.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
+// if (progress < 0.8) {
+// requestAnimationFrame(animate);
+// }
+// }
+// requestAnimationFrame(animate);
+// }
+// slideUp(); // Lancer l'animation lorsque la page est chargée
+// });
\ No newline at end of file
diff --git a/web/themes/custom/colloque2024/js/animation_home.js b/web/themes/custom/colloque2024/js/animation_home.js
index ec406bdc..ea7a790d 100644
--- a/web/themes/custom/colloque2024/js/animation_home.js
+++ b/web/themes/custom/colloque2024/js/animation_home.js
@@ -3,32 +3,6 @@
// Récupérer la forme SVG
-// let dropdowns = document.getElementsByClassName('dropdown');
-// console.log(dropdowns);
-
-// // Parcourir tous les éléments sélectionnés
-// Array.from(dropdowns).forEach(dropdown => {
-// function slideDown() {
-// let translateY = -50; // Position de départ (en bas)
-
-// function animate() {
-// translateY += 1; // Déplacement d'un pixel vers le haut à chaque itération
-// dropdown.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
-
-// // dropdown.setAttribute('transform', `translate(0, ${translateY})`); // Appliquer la transformation
-
-// if (translateY < 100) { // Limite la hauteur à laquelle la forme doit être animée
-// requestAnimationFrame(animate); // Appel récursif de la fonction animate
-// }
-// }
-
-// animate(); // Lancer l'animation
-// }
-
-// slideDown(); // Lancer l'animation lorsque la page est chargée
-// });
-
-
let dropdowns1 = document.getElementsByClassName('dropdown1');
console.log(dropdowns1);
Array.from(dropdowns1).forEach(dropdown1 => {
diff --git a/web/themes/custom/colloque2024/template/node/node--presentation.html.twig b/web/themes/custom/colloque2024/template/node/node--presentation.html.twig
index 807700f9..090718a0 100644
--- a/web/themes/custom/colloque2024/template/node/node--presentation.html.twig
+++ b/web/themes/custom/colloque2024/template/node/node--presentation.html.twig
@@ -74,7 +74,7 @@
#}