SPIN-146 // removed planet-animation css fix and added js fix instead.

scripts/scripts.js

@@ -90,11 +90,19 @@ function decorateSectionsWithPlanetToBackgroundAnimation(main) {
       const nextSection = entry.target.nextElementSibling;
       if (entry.isIntersecting) {
         entry.target.classList.remove('background-hidden');
-        previousSection.querySelector('.section-planet').classList.add('hidden');
-        nextSection.querySelector('.section-planet').classList.add('hidden');
+        // previousSection.querySelector('.section-planet').classList.add('hidden');
+        // nextSection.querySelector('.section-planet').classList.add('hidden');
+        previousSection.querySelectorAll('.section-planet').forEach((planet) => {
+          planet.classList.add('hidden');
+        })
+        nextSection.querySelectorAll('.section-planet').forEach((planet) => {
+          planet.classList.add('hidden');
+        })
       } else if (entry.boundingClientRect.top > 0) {
         entry.target.classList.add('background-hidden');
-        previousSection.querySelector('.section-planet').classList.remove('hidden');
+        previousSection.querySelectorAll('.section-planet').forEach((planet) => {
+          planet.classList.remove('hidden');
+        })
       } else if (entry.boundingClientRect.top < 0) {
         entry.target.classList.add('background-hidden');
         nextSection.querySelector('.section-planet').classList.remove('hidden');

styles/styles.css

@@ -546,7 +546,6 @@ main .section.hero .icon-logo-adobe-techdivision {
     100% {
         transform: translateX(-50%) scale(50);
         border-radius: 10px;
-        display: none;
     }
 }