Browse Source

feat : 운영 유지보수 desc 제거

remotes/origin/main
이시연 2 weeks ago
parent
commit
8afc00b61f
  1. 73
      src/pages/business/MaintenancePage.jsx

73
src/pages/business/MaintenancePage.jsx

@ -270,10 +270,6 @@ function VennDiagram({ inView }) {
return ( return (
<div className="mt-venn"> <div className="mt-venn">
{/*
등장 애니메이션
SVG 전체: 오른쪽에서 슬라이드 + fade
*/}
<motion.svg <motion.svg
className="mt-venn__svg" className="mt-venn__svg"
viewBox={`0 0 ${SVG_W} ${SVG_H}`} viewBox={`0 0 ${SVG_W} ${SVG_H}`}
@ -296,7 +292,7 @@ function VennDiagram({ inView }) {
))} ))}
</defs> </defs>
{/* 바깥 장식 원 — fade in */} {/* 바깥 장식 원 */}
<motion.circle <motion.circle
cx={CX} cx={CX}
cy={CY} cy={CY}
@ -309,7 +305,7 @@ function VennDiagram({ inView }) {
transition={{ duration: 1, ease, delay: 0.35 }} transition={{ duration: 1, ease, delay: 0.35 }}
/> />
{/* 가이드 원 실선 — fade in + scale */} {/* 가이드 원 실선 */}
<motion.circle <motion.circle
cx={CX} cx={CX}
cy={CY} cy={CY}
@ -323,7 +319,7 @@ function VennDiagram({ inView }) {
style={{ transformOrigin: `${CX}px ${CY}px` }} style={{ transformOrigin: `${CX}px ${CY}px` }}
/> />
{/* 그라데이션 호 — DOM 직접 조작 */} {/* 그라데이션 호 */}
<circle <circle
ref={arcRef} ref={arcRef}
cx={CX} cx={CX}
@ -337,7 +333,7 @@ function VennDiagram({ inView }) {
fill="none" fill="none"
/> />
{/* 도트 3개 — fade in */} {/* 도트 3개 */}
{initDots.map((pos, k) => ( {initDots.map((pos, k) => (
<motion.g <motion.g
key={`dot-${k}`} key={`dot-${k}`}
@ -364,11 +360,7 @@ function VennDiagram({ inView }) {
</motion.g> </motion.g>
))} ))}
{/* {/* 소원 5개 */}
소원 5: stagger scale + fade in
원을 motion.g로 감싸서 자신의 중심 기준으로 scale
delay: 0.45 + i * 0.1 순서대로 등장
*/}
{centers.map(({ x, y }, i) => { {centers.map(({ x, y }, i) => {
const isActive = activeFill === i; const isActive = activeFill === i;
return ( return (
@ -383,10 +375,10 @@ function VennDiagram({ inView }) {
}} }}
style={{ transformOrigin: `${x}px ${y}px` }} style={{ transformOrigin: `${x}px ${y}px` }}
> >
{/* 흰색 fill — 호를 가림 */} {/* 흰색 fill */}
<circle cx={x} cy={y} r={CR} fill="white" /> <circle cx={x} cy={y} r={CR} fill="white" />
{/* 그라데이션 fill — 활성일 때만 */} {/* 그라데이션 fill */}
<circle <circle
cx={x} cx={x}
cy={y} cy={y}
@ -411,12 +403,13 @@ function VennDiagram({ inView }) {
style={{ transition: "stroke 0.4s ease" }} style={{ transition: "stroke 0.4s ease" }}
/> />
{/* 텍스트 */} {/* 타이틀만 — 설명 제거, 폰트 24→28px, 수직 중앙 정렬 */}
<text <text
x={x} x={x}
y={y - 32} y={y + 6}
textAnchor="middle" textAnchor="middle"
fontSize="18" dominantBaseline="middle"
fontSize="24"
fontWeight="700" fontWeight="700"
fontFamily="inherit" fontFamily="inherit"
fill={isActive ? "white" : "#1a1f5e"} fill={isActive ? "white" : "#1a1f5e"}
@ -425,32 +418,6 @@ function VennDiagram({ inView }) {
> >
{CIRCLES[i].title} {CIRCLES[i].title}
</text> </text>
<line
x1={x - 28}
y1={y - 18}
x2={x + 28}
y2={y - 18}
stroke={
isActive ? "rgba(255,255,255,0.3)" : "rgba(100,80,160,0.15)"
}
strokeWidth="0.8"
style={{ transition: "stroke 0.4s ease" }}
/>
{CIRCLES[i].items.map((item, j) => (
<text
key={j}
x={x}
y={y + 4 + j * 22}
textAnchor="middle"
fontSize="15"
fontWeight="400"
fontFamily="inherit"
fill={isActive ? "rgba(255,255,255,0.88)" : "#999"}
style={{ transition: "fill 0.4s ease" }}
>
{item}
</text>
))}
</motion.g> </motion.g>
); );
})} })}
@ -522,24 +489,6 @@ function MaintenancePage() {
<br /> <br />
시스템의 가용성과 안정성을 지속적으로 보장합니다. 시스템의 가용성과 안정성을 지속적으로 보장합니다.
</motion.p> </motion.p>
{/* <motion.a
className="mt-intro__cta"
href="/contact"
initial={{ opacity: 0, y: 12 }}
animate={introInView ? { opacity: 1, y: 0 } : {}}
transition={{ duration: 0.6, ease, delay: 0.62 }}
>
서비스 자세히 보기
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
<path
d="M3 8h10M9 4l4 4-4 4"
stroke="currentColor"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
</motion.a> */}
</div> </div>
<div className="mt-intro__right"> <div className="mt-intro__right">
<VennDiagram inView={introInView} /> <VennDiagram inView={introInView} />

Loading…
Cancel
Save