animated background

web/themes/custom/colloque2024/css-compiled/index.css

@@ -338,7 +338,9 @@ footer h2 {
   font-size: 1rem;
   line-height: 1.5rem; }
 
-/* Link the SVG file */
+#content-ontop {
+  display: none; }
+
 @keyframes pulse {
   0% {
     transform: scale(0); }
@@ -383,12 +385,6 @@ footer h2 {
     fill: #349a84;
     /* Final fill color */ } }
 
-@keyframes football-motion {
-  0% {
-    transform: translateX(0) translateY(0); }
-  100% {
-    transform: translateX(100px); } }
-
 @keyframes traceAppear {
   0% {
     opacity: 0; }
@@ -400,18 +396,6 @@ footer h2 {
 #path_circle_vert_clair_erable_2 {
   animation: traceAppear 2.5s forwards; }
 
-/* Apply styles to the SVG paths
-#circle_pop_trans,
-#circle_pop_trans-2,
-/* Add other SVG IDs or classes here */
-#circle_orange {
-  /* Add styles to your SVG paths */
-  /* Example animation */
-  /* animation: pulse 2s infinite alternate; */
-  /* animation: dropDown 2s infinite alternate; */
-  /* animation: pulse 2s infinite alternate; */
-  /* animation: slidein 2s infinite alternate; */ }
-
 /*!
  * Hamburgers
  * @description Tasty CSS-animated hamburgers
@@ -538,7 +522,8 @@ body {
   body #content-ontop {
     z-index: 3000;
     position: relative;
-    top: -1200px; }
+    top: -1200px;
+    display: none; }
   body #background-animated {
     z-index: 2000;
     position: relative;

web/themes/custom/colloque2024/css-compiled/pages/layout.css

@@ -11,7 +11,8 @@ body {
   body #content-ontop {
     z-index: 3000;
     position: relative;
-    top: -1200px; }
+    top: -1200px;
+    display: none; }
   body #background-animated {
     z-index: 2000;
     position: relative;

web/themes/custom/colloque2024/css/pages/layout.scss

@@ -13,6 +13,7 @@ body {
  z-index: 3000;
  position: relative;
  top: -1200px;
+ display: none;
  }
  
 

web/themes/custom/colloque2024/js/animation_home.js

@@ -41,7 +41,7 @@ Array.from(dropdowns1).forEach(dropdown1 => {
     let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
     progress = Math.min(progress, 0.3); // Limite la progression à 1 (pour éviter un dépassement)
     progress = easeInOut(progress);
-    translateY = 70 * progress; // Déplacement d'un pixel vers le haut à chaque itération
+    translateY = 65 * progress; // Déplacement d'un pixel vers le haut à chaque itération
     dropdown1.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
     if (progress < 0.8) {
       requestAnimationFrame(animate);

web/themes/custom/colloque2024/template/page--front.html.twig

@@ -89,24 +89,25 @@
        cy="132.53793"
        r="15.890945" />
        <circle style="fill:#349a84;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_pop_trans" cx="136.45699" cy="76.141045" r="15.890945" />
+       id="circle_pop_trans" cx="136.45699" cy="74.141045" r="15.890945" />
        <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_orange_2" cx="193.12822" cy="74.014618" r="15.890945" />
+       id="circle_orange_2" cx="194.12822" cy="74.014618" r="15.890945" />
        <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
        id="circle_vert_clair_erable" class="toleft1" cx="457" cy="74.184013" r="15.890945" />
       <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:1.19737"
        d="m 462.8305,58.142036 c -20.03075,1.78212 -17.31022,32.693116 2.6358,30.918576 20.03076,-1.7821 17.31021,-32.693146 -2.6358,-30.918576 z"
        id="path_circle_vert_clair_erable" class="toleft1"/> 
        <circle style="fill:#038788;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_erable_2" class="toleft3" cx="400" cy="168.13489" r="15.890945" />
+       id="circle_vert_erable_2" class="toleft3" cx="400" cy="166.14003" r="15.890945" />
        <path style="filter:url(#f5);fill:#038788;fill-opacity:1;stroke:none"
-       d="m 400,153.87047 c -2.16405,0.16719 -4.2637,0.74796 -6.15277,1.83301 -12.5874,7.23004 -6.72502,27.5444 7.93188,26.41208 5.739,-0.44336 14.95781,-2.24109 18.75404,-6.93203 3.69834,-4.57001 2.81908,-12.55102 -1.70959,-16.24527 -4.33146,-3.53336 -13.29117,-5.49519 -18.82356,-5.06779 z"
+       d="m 400,152 c -2.16405,0.16719 -4.2637,0.74796 -6.15277,1.83301 -12.5874,7.23004 -6.72502,27.5444 7.93188,26.41208 5.739,-0.44336 14.95781,-2.24109 18.75404,-6.93203 3.69834,-4.57001 2.81908,-12.55102 -1.70959,-16.24527 -4.33146,-3.53336 -13.29117,-5.49519 -18.82356,-5.06779 z"
        id="path_circle_vert_erable_2" class="toleft3"/>
        <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_clair_erable_3" class="toright3" cx="20" cy="166.14003" r="15.890945" />
+       id="circle_vert_clair_erable_3" class="toright3" cx="18" cy="166.14003" r="15.890945" />
        <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.837592"
        d="m 10,153.49503 c 1.66599,0.28713 3.23412,0.86965 4.64923,2.10196 1.13385,0.98738 2.12354,2.20392 2.87042,3.70487 3.4694,6.97221 1.26697,16.7678 -4.79211,19.76085 -1.59028,0.78557 -3.27791,0.9903 -4.95918,0.75119 -2.5558,-0.36348 -4.53937,-2.61939 -7.00484,-3.35343 -5.83083,-1.73601 -11.81781,-2.62133 -17.66709,-4.27621 -2.30955,-0.65342 -5.79646,-2.18476 -6.29444,-5.66197 -0.56424,-3.93983 3.36487,-5.83643 5.67455,-6.56082 1.86819,-0.58593 3.8034,-0.59903 5.70306,-0.83564 4.12917,-0.51429 8.33141,-0.76337 12.39795,-1.93444 1.65451,-0.47646 2.95288,-1.74598 4.46326,-2.65107 1.47815,-0.88578 3.33945,-1.32444 4.95919,-1.04529 z"
        id="path_circle_vert_clair_erable_3" class="toright3"/>
+
        
        
 
@@ -120,22 +121,22 @@
        id="circle_vert_clair_erable_5"
        cx="437.38623"
        cy="165.2007"
-       r="15.890945" /><circle
-       style="fill:#349a84;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_pop_trans_3"
-       cx="325.69421"
-       cy="214.66238"
-       r="15.890945" /><circle
-       style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_orange_4"
-       cx="283.16208"
-       cy="216.84201"
-       r="15.890945" /><circle
-       style="fill:#038788;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_erable_4"
-       cx="190.17583"
-       cy="216.79443"
        r="15.890945" />
+       
+       <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
+       id="circle_orange_4" cx="289" cy="216.84201" r="15.890945" />
+       <path style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:1.19737"
+       d="m 294.96985,200.04259 c -20.03075,1.78212 -17.31022,32.69312 2.6358,30.91858 20.03076,-1.7821 17.31021,-32.69315 -2.6358,-30.91858 z"
+       id="path_circle_orange_4" />
+       <path style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:1.19737"
+       d="m 318,200.04259 c -20.03075,1.78212 -17.31022,32.69312 2.6358,30.91858 20.03076,-1.7821 17.31021,-32.69315 -2.6358,-30.91858 z"
+       id="path_circle_orange_7" />
+       <circle style="fill:#349a84;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
+       id="circle_pop_trans_3" cx="325.69421" cy="216.84201" r="15.890945" />
+       
+
+       <circle style="fill:#038788;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
+       id="circle_vert_erable_4" cx="190.17583" cy="216.84201" r="15.890945" />
        <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
        id="circle_vert_clair_erable_6" class="dropdown2" cx="139.32957" cy="44.208164" r="15.890945" />
        <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none"
@@ -147,11 +148,12 @@
        <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:1.53571"
        d="m 91.317542,30 c -25.690903,2.28569 -22.201624,41.93132 3.380606,39.65534 25.690922,-2.28568 22.201612,-41.93136 -3.380606,-39.65534 z"
        id="path_circle_vert_clair_erable_7" class="dropdown4"/>
-        <circle style="fill:#038788;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_erable_3" class="dropdown3" cx="88.886528" cy="20" r="15.890945" />
-       <path style="filter:url(#f5);fill:#038788;fill-opacity:1;stroke:none"
+      <path style="filter:url(#f5);fill:#038788;fill-opacity:1;stroke:none"
        d="m 74.665152,20 c 0.16719,2.16405 0.74796,4.2637 1.83301,6.15277 7.23004,12.5874 27.544398,6.72502 26.412078,-7.93188 -0.44336,-5.739 -2.24109,-14.95781 -6.932038,-18.75404 -4.57,-3.69834 -12.55101,-2.81908 -16.24526,1.70959 -3.53336,4.33146 -5.49519,13.29117 -5.06779,18.82356 z"
-       id="path_circle_vert_erable_3" class="dropdown3"/> 
+       id="path_circle_vert_erable_3" class="dropdown3"/>
+       <circle style="fill:#038788;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
+       id="circle_vert_erable_3" class="dropdown3" cx="88.886528" cy="20" r="15.890945" />
+        
        <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0353214;paint-order:fill markers stroke"
        id="circle_orange_6" class="dropdown5" cx="512.90173" cy="41.339592" r="24.167231" />
        <path style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:1.25134"
@@ -160,30 +162,27 @@
        <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
        id="circle_orange_5" cx="484.91324" cy="165.12646" r="15.890945" />
        <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_clair_erable_4" cx="438.36194" cy="77.165817" r="15.890945" />
+       id="circle_vert_clair_erable_4" cx="438.36194" cy="74.165817" r="15.890945" />
        <circle style="fill:#349a84;fill-opacity:1;stroke:none;stroke-width:0.0330534;paint-order:fill markers stroke"
        id="circle_pop_trans_4" cx="513.32098" cy="116.0085" r="22.615427" />
        <path style="filter:url(#f5);fill:#349a84;stroke:none;stroke-width:1.26656"
        d="m 506.27395,96.085496 c 2.51922,0.43418 4.89045,1.31504 7.03031,3.17846 1.71454,1.493054 3.2111,3.332644 4.34049,5.602294 5.24622,10.54298 1.91584,25.35532 -7.24636,29.88124 -2.40473,1.18789 -4.95667,1.49748 -7.49899,1.13591 -3.86474,-0.54964 -6.86418,-3.96089 -10.59233,-5.07087 -8.81705,-2.6251 -17.87023,-3.96382 -26.71517,-6.46624 -3.49238,-0.98807 -8.76508,-3.30367 -9.5181,-8.56171 -0.85321,-5.95759 5.08816,-8.82552 8.58073,-9.92091 2.82498,-0.886 5.75129,-0.90581 8.62384,-1.2636 6.24391,-0.77769 12.5983,-1.15433 18.74749,-2.92515 2.50185,-0.72048 4.46518,-2.640174 6.74909,-4.008804 2.23517,-1.33942 5.04973,-2.00274 7.499,-1.58062 z"
        id="path_circle_pop_trans_4"  />
        <circle style="fill:#038788;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_erable" class="dropdown1" cx="193.12822" cy="0" r="15.890945" />
+       id="circle_vert_erable" class="dropdown1" cx="194.12822" cy="0" r="15.890945" />
        <path style="filter:url(#f5);fill:#038788;fill-opacity:1;stroke:none;stroke-width:1.19737"
-       d="m 193.12822,-23 c -20.03075,1.78212 -17.31022,32.693118 2.6358,30.918578 20.03076,-1.7821 17.31021,-32.693148 -2.6358,-30.918578 z"
+       d="m 193.12822,-20 c -20.03075,1.78212 -17.31022,32.693118 2.6358,30.918578 20.03076,-1.7821 17.31021,-32.693148 -2.6358,-30.918578 z"
        id="path_circle_vert_erable" class="dropdown1" />
-       <path
-       style="filter:url(#f5);fill:#038788;stroke:none;stroke-width:0.837592"
+       <path style="filter:url(#f5);fill:#038788;stroke:none;stroke-width:0.837592"
        d="m 176.96306,228.27149 c 0.28713,-1.66598 0.86969,-3.23411 2.10196,-4.64922 0.98738,-1.13386 2.20392,-2.12354 3.70487,-2.87043 6.97221,-3.4694 16.7678,-1.26697 19.76085,4.79211 0.78557,1.59028 0.9903,3.27791 0.75119,4.95918 -0.36348,2.5558 -2.61938,4.53937 -3.35343,7.00485 -1.73601,5.83082 -2.62133,11.8178 -4.2762,17.66708 -0.65342,2.30955 -2.18477,5.79646 -5.66198,6.29444 -3.93982,0.56424 -5.83643,-3.36487 -6.56082,-5.67454 -0.58593,-1.8682 -0.59903,-3.8034 -0.83564,-5.70307 -0.51428,-4.12917 -0.76337,-8.33141 -1.93444,-12.39795 -0.47645,-1.6545 -1.74598,-2.95288 -2.65106,-4.46326 -0.88579,-1.47815 -1.32445,-3.33945 -1.0453,-4.95919 z"
-       id="path_circle_vert_erable_4" /><path
-       style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:1.19737"
-       d="m 294.96985,200.04259 c -20.03075,1.78212 -17.31022,32.69312 2.6358,30.91858 20.03076,-1.7821 17.31021,-32.69315 -2.6358,-30.91858 z"
-       id="path_circle_orange_4" /><path
-       style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none"
+       id="path_circle_vert_erable_4" />
+       
+
+       <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none"
        d="m 442.70309,151.34247 c -2.16405,0.16719 -4.2637,0.74796 -6.15277,1.83301 -12.5874,7.23004 -6.72502,27.5444 7.93188,26.41208 5.739,-0.44336 14.95781,-2.24109 18.75404,-6.93204 3.69834,-4.57 2.81908,-12.55101 -1.70959,-16.24526 -4.33146,-3.53336 -13.29117,-5.49519 -18.82356,-5.06779 z"
        id="path_circle_vert_clair_erable_5" />
        
-       <path
-       style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none"
+       <path style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none"
        d="m 482.59447,150.98761 c 2.16405,0.16719 4.2637,0.74796 6.15277,1.83301 12.5874,7.23004 6.72502,27.5444 -7.93188,26.41208 -5.739,-0.44336 -14.95781,-2.24109 -18.75404,-6.93204 -3.69834,-4.57 -2.81908,-12.55101 1.70959,-16.24526 4.33146,-3.53336 13.29117,-5.49519 18.82356,-5.06779 z"
        id="path_circle_orange_5" />