diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md index 4f65a56..115e067 100644 --- a/.github/pull_request_template.md +++ b/.github/pull_request_template.md @@ -1,3 +1,3 @@ Test URLs: -- before: https://main--franklin-spin-landingpage--techdivision.hlx.page/ -- after: https://--franklin-spin-landingpage--techdivision.hlx.page/ +- before: https://main--eds-spin-landingpage--techdivision.hlx.page/ +- after: https://--eds-spin-landingpage--techdivision.hlx.page/ diff --git a/README.md b/README.md index 75b78ed..99d0a65 100644 --- a/README.md +++ b/README.md @@ -31,7 +31,7 @@ npm run lint Mehr Infos: https://www.hlx.live/docs/admin.html#tag/code/operation/codeStatus ```sh -curl -X POST "https://admin.hlx.page/code/techdivision/franklin-spin-landingpage/{branch}/*?branch={branch}" -H "x-github-token: {GitHub token}" +curl -X POST "https://admin.hlx.page/code/techdivision/eds-spin-landingpage/{branch}/*?branch={branch}" -H "x-github-token: {GitHub token}" ``` Als Antwort wird bei einem Erfolg ein json Objekt übertragen diff --git a/scripts/scripts.js b/scripts/scripts.js index f994b51..7e43464 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -110,7 +110,7 @@ function decorateSectionsWithPlanetToBackgroundAnimation(main) { }); }, { rootMargin: `-${planetAnimationRootMargin}px 0px` }); - main.querySelectorAll('.planet-to-background').forEach((section) => { + main.querySelectorAll('.planet-to-background').forEach((section, index) => { section.classList.add('background-hidden'); const previousSection = section.previousElementSibling; const nextSection = section.nextElementSibling; @@ -127,10 +127,12 @@ function decorateSectionsWithPlanetToBackgroundAnimation(main) { } const previousPlanet = planet.cloneNode(); previousPlanet.classList.add('section-planet-entering'); + previousPlanet.style.setProperty('--scroll-planet', `var(--scroll-planet-${index})`); previousSection.appendChild(previousPlanet); const nextPlanet = planet.cloneNode(); nextPlanet.classList.add('section-planet-leaving'); nextPlanet.classList.add('hidden'); + nextPlanet.style.setProperty('--scroll-planet', `var(--scroll-planet-${index})`); nextSection.appendChild(nextPlanet); registerCustomScrollLinkedVariable( previousSection, @@ -138,7 +140,7 @@ function decorateSectionsWithPlanetToBackgroundAnimation(main) { (elementDistanceToWindowTop, elementRect) => elementDistanceToWindowTop + elementRect.height / 2 - window.innerHeight / 2, // eslint-disable-next-line max-len (elementDistanceToWindowTop, elementRect) => elementDistanceToWindowTop + elementRect.height - window.innerHeight + planetAnimationRootMargin, - '--scroll-planet', + `--scroll-planet-${index}`, ); registerCustomScrollLinkedVariable( nextSection, @@ -146,7 +148,7 @@ function decorateSectionsWithPlanetToBackgroundAnimation(main) { (elementDistanceToWindowTop) => elementDistanceToWindowTop - planetAnimationRootMargin, // eslint-disable-next-line max-len (elementDistanceToWindowTop, elementRect) => elementDistanceToWindowTop + elementRect.height / 2 - window.innerHeight / 2, - '--scroll-planet', + `--scroll-planet-${index}`, ); planetSectionIntersectionObserver.observe(section); });