Browse Source

css

remotes/origin/main
김지은 2 months ago
parent
commit
d3e95ae496
  1. 11
      src/components/main/MainVisual.jsx
  2. 3
      src/css/common.css

11
src/components/main/MainVisual.jsx

@ -90,11 +90,20 @@ function MainVisual() {
return () => { return () => {
ctx.revert(); ctx.revert();
// pin
ScrollTrigger.getAll().forEach((t) => t.kill()); ScrollTrigger.getAll().forEach((t) => t.kill());
// pin spacer
document.querySelectorAll("[data-gsap-pin-spacer]").forEach((el) => {
const parent = el.parentNode;
if (parent) {
while (el.firstChild) parent.insertBefore(el.firstChild, el);
parent.removeChild(el);
}
});
document.body.style.removeProperty("overflow"); document.body.style.removeProperty("overflow");
document.body.style.removeProperty("padding-bottom"); document.body.style.removeProperty("padding-bottom");
document.body.style.removeProperty("height");
document.documentElement.style.removeProperty("overflow"); document.documentElement.style.removeProperty("overflow");
document.documentElement.style.removeProperty("height");
document.body.classList.remove("is-dark-hero"); document.body.classList.remove("is-dark-hero");
}; };
}, []); }, []);

3
src/css/common.css

@ -47,7 +47,7 @@ body{overflow-x:hidden;}
.sub-fade-in.is-visible{opacity:1;transform:translateY(0);} .sub-fade-in.is-visible{opacity:1;transform:translateY(0);}
/*about page*/ /*about page*/
.sh{height:520px;position:relative;overflow:hidden;background:#050c1f;} .sh{height:520px;position:relative;overflow:hidden;background:#050c1f;margin-top:calc(-1 * var(--header-height));}
.sh-bg{position:absolute;inset:-8%;background-size:cover;background-position:center;background-repeat:no-repeat;transform:scale(1.12);transition:transform 2s cubic-bezier(.16,1,.3,1);will-change:transform;} .sh-bg{position:absolute;inset:-8%;background-size:cover;background-position:center;background-repeat:no-repeat;transform:scale(1.12);transition:transform 2s cubic-bezier(.16,1,.3,1);will-change:transform;}
.sh-bg--zoomed{transform:scale(1);} .sh-bg--zoomed{transform:scale(1);}
.sh-glow{position:absolute;inset:0;background:radial-gradient(ellipse 65% 55% at 68% 42%,rgba(58,64,129,.32) 0%,transparent 62%);pointer-events:none;} .sh-glow{position:absolute;inset:0;background:radial-gradient(ellipse 65% 55% at 68% 42%,rgba(58,64,129,.32) 0%,transparent 62%);pointer-events:none;}
@ -176,6 +176,7 @@ body{overflow-x:hidden;}
} }
@media (max-width:1024px){ @media (max-width:1024px){
.sh{margin-top:-82px;}
.sh-nav{top:82px;} .sh-nav{top:82px;}
.sh-nav-inner{padding-left:20px;padding-right:20px;} .sh-nav-inner{padding-left:20px;padding-right:20px;}
} }

Loading…
Cancel
Save