diff --git a/css/common.css b/css/common.css index 2e51507..0588a7d 100644 --- a/css/common.css +++ b/css/common.css @@ -1567,4 +1567,97 @@ body { .streamer-links { flex-wrap: wrap; } +} + +/* ======================================== + 방문 크리에이터 사인 섹션 + ======================================== */ +.creator-signs-section { + background: var(--bg-white); + overflow: hidden; +} + +.signs-marquee { + position: relative; + overflow: hidden; + mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); + -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); +} + +.signs-marquee-track { + display: flex; + gap: var(--spacing-xl); + animation: signsScroll 40s linear infinite; +} + +.signs-marquee:hover .signs-marquee-track { + animation-play-state: paused; +} + +@keyframes signsScroll { + 0% { transform: translateX(0); } + 100% { transform: translateX(calc(-50% - var(--spacing-xl) / 2)); } +} + +.sign-item { + flex-shrink: 0; + display: flex; + flex-direction: column; + border-radius: var(--radius-lg); + overflow: hidden; + background: var(--bg-light); + box-shadow: var(--shadow-sm); + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.sign-item:hover { + transform: scale(1.05); + box-shadow: var(--shadow-md); +} + +.sign-item img { + height: 280px; + width: auto; + display: block; +} + +.sign-name { + display: block; + padding: 8px 12px; + font-size: var(--font-sm); + font-weight: 500; + color: var(--text-primary); + text-align: center; + background: var(--bg-white); +} + +/* 방문 크리에이터 다크모드 */ +[data-theme="dark"] .creator-signs-section { + background: transparent; +} + +[data-theme="dark"] .sign-item { + background: rgba(255, 255, 255, 0.05); + border: 1px solid var(--glass-border); +} + +[data-theme="dark"] .sign-item:hover { + border-color: rgba(255, 136, 0, 0.3); +} + +[data-theme="dark"] .sign-name { + background: rgba(255, 255, 255, 0.05); + color: var(--dark-text-primary); +} + +/* 방문 크리에이터 반응형 */ +@media (max-width: 768px) { + .sign-item img { + height: 200px; + } + + .sign-name { + padding: 6px 10px; + font-size: var(--font-xs); + } } \ No newline at end of file diff --git a/images/sign/김마늘.jpg b/images/sign/김마늘.jpg new file mode 100644 index 0000000..4742b9a Binary files /dev/null and b/images/sign/김마늘.jpg differ diff --git a/images/sign/만타.jpg b/images/sign/만타.jpg new file mode 100644 index 0000000..9074ed9 Binary files /dev/null and b/images/sign/만타.jpg differ diff --git a/images/sign/문모모.jpg b/images/sign/문모모.jpg new file mode 100644 index 0000000..3720b43 Binary files /dev/null and b/images/sign/문모모.jpg differ diff --git a/images/sign/베니.jpg b/images/sign/베니.jpg new file mode 100644 index 0000000..85ee44e Binary files /dev/null and b/images/sign/베니.jpg differ diff --git a/images/sign/시에.jpg b/images/sign/시에.jpg new file mode 100644 index 0000000..0f28ae0 Binary files /dev/null and b/images/sign/시에.jpg differ diff --git a/images/sign/요나카.jpg b/images/sign/요나카.jpg new file mode 100644 index 0000000..c809fb9 Binary files /dev/null and b/images/sign/요나카.jpg differ diff --git a/images/sign/이무지.jpg b/images/sign/이무지.jpg new file mode 100644 index 0000000..65b7850 Binary files /dev/null and b/images/sign/이무지.jpg differ diff --git a/images/sign/지한이또.jpg b/images/sign/지한이또.jpg new file mode 100644 index 0000000..f1ed3ee Binary files /dev/null and b/images/sign/지한이또.jpg differ diff --git a/images/sign/최또.jpg b/images/sign/최또.jpg new file mode 100644 index 0000000..cf9f68d Binary files /dev/null and b/images/sign/최또.jpg differ diff --git a/images/sign/치요.jpg b/images/sign/치요.jpg new file mode 100644 index 0000000..38882aa Binary files /dev/null and b/images/sign/치요.jpg differ diff --git a/index.html b/index.html index 0347efd..20fd8fb 100644 --- a/index.html +++ b/index.html @@ -667,6 +667,42 @@ + +
+
+
+

방문 크리에이터

+

밍글 스튜디오를 방문한 크리에이터들의 사인

+
+ +
+
+
김마늘 사인김마늘
+
만타 사인만타
+
문모모 사인문모모
+
베니 사인베니
+
시에 사인시에
+
요나카 사인요나카
+
이무지 사인이무지
+
지한이또 사인지한이또
+
최또 사인최또
+
치요 사인치요
+ +
김마늘 사인김마늘
+
만타 사인만타
+
문모모 사인문모모
+
베니 사인베니
+
시에 사인시에
+
요나카 사인요나카
+
이무지 사인이무지
+
지한이또 사인지한이또
+
최또 사인최또
+
치요 사인치요
+
+
+
+
+