From 904cde62cf84f2a2e5e2a89094dea7b0a7d66ea5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=B3=B4=EA=B3=A4?= Date: Sun, 8 Mar 2026 13:43:42 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20[rd]=20=EC=82=AC=EC=9A=B4=EB=93=9C=20?= =?UTF-8?q?=EB=A1=9C=EA=B3=A0=20=EC=83=9D=EC=84=B1=EA=B8=B0=20=EB=8F=84?= =?UTF-8?q?=EC=9B=80=EB=A7=90=20=EB=AA=A8=EB=8B=AC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 툴바에 ? 아이콘 추가 → 클릭 시 사용법 모달 표시 - 4개 탭(수동/프리셋/AI생성/AI배경음악) 상세 사용법 안내 - 음성 오버레이, 재생/내보내기, 3중 합성 구조 설명 포함 - ESC 키/외부 클릭으로 모달 닫기 지원 --- resources/views/rd/sound-logo/index.blade.php | 249 ++++++++++++++++++ 1 file changed, 249 insertions(+) diff --git a/resources/views/rd/sound-logo/index.blade.php b/resources/views/rd/sound-logo/index.blade.php index 5970168b..7239a9d8 100644 --- a/resources/views/rd/sound-logo/index.blade.php +++ b/resources/views/rd/sound-logo/index.blade.php @@ -202,12 +202,69 @@ } @keyframes spin { to { transform: rotate(360deg); } } + +/* Help Modal */ +.sl-modal-overlay { + position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 9000; + display: flex; align-items: center; justify-content: center; + backdrop-filter: blur(4px); +} +.sl-modal { + background: var(--sl-card); border: 1px solid var(--sl-border); border-radius: 14px; + width: 90%; max-width: 760px; max-height: 85vh; display: flex; flex-direction: column; + box-shadow: 0 20px 60px rgba(0,0,0,.5); +} +.sl-modal-header { + display: flex; align-items: center; gap: 10px; padding: 16px 20px; + border-bottom: 1px solid var(--sl-border); flex-shrink: 0; +} +.sl-modal-header h2 { font-size: 16px; font-weight: 700; margin: 0; flex: 1; } +.sl-modal-body { + overflow-y: auto; padding: 20px; flex: 1; + font-size: 13px; line-height: 1.8; color: var(--sl-text2); +} +.sl-modal-body h3 { + font-size: 14px; font-weight: 700; color: var(--sl-text); margin: 20px 0 8px; + display: flex; align-items: center; gap: 6px; +} +.sl-modal-body h3:first-child { margin-top: 0; } +.sl-modal-body strong { color: var(--sl-text); } +.sl-modal-body .help-badge { + display: inline-flex; align-items: center; gap: 4px; + padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; +} +.sl-modal-body .help-table { + width: 100%; border-collapse: collapse; margin: 8px 0 12px; font-size: 12px; +} +.sl-modal-body .help-table th, +.sl-modal-body .help-table td { + padding: 6px 10px; border: 1px solid var(--sl-border); text-align: left; +} +.sl-modal-body .help-table th { + background: var(--sl-bg); color: var(--sl-text); font-weight: 600; white-space: nowrap; +} +.sl-modal-body .help-step { + display: flex; gap: 10px; margin-bottom: 10px; +} +.sl-modal-body .help-step-num { + width: 24px; height: 24px; border-radius: 50%; background: var(--sl-indigo); color: #fff; + display: flex; align-items: center; justify-content: center; + font-size: 12px; font-weight: 700; flex-shrink: 0; margin-top: 1px; +} +.sl-modal-body .help-step-text { flex: 1; } +.sl-modal-body .help-divider { + border: none; border-top: 1px solid var(--sl-border); margin: 16px 0; +}

사운드 로고 생성기

+
@@ -729,6 +786,197 @@
+ + +
@@ -741,6 +989,7 @@ function soundLogo() { return { mode: 'manual', + showHelp: false, synth: 'sine', adsr: { attack: 10, decay: 100, sustain: 0.7, release: 500 }, volume: 0.8,