feat(videos): inline ID edit with live availability check

영상 편집 페이지에 영상 ID 입력란을 추가했다. 입력 시 250ms 디바운스로
/op/videos/idAvailable 를 호출해 중복/형식을 실시간 확인하고, 변경
버튼으로 /op/videos/:id/changeId 를 호출한 뒤 새 ID 의 편집 페이지로
location.replace 한다. 공유 주소 복사 버튼도 함께 노출한다.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Claude (owner)
2026-05-31 23:51:18 +09:00
parent 3089af1ad8
commit 55ce30733b
3 changed files with 120 additions and 0 deletions

View File

@@ -230,6 +230,20 @@ body.siteBody.centerLayout { display: flex; align-items: center; justify-content
.videoPanel video {
width: 100%; max-height: 60vh; background: #000; border-radius: 10px;
}
.videoIdRow {
display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
background: var(--bg-card); border: 1px solid var(--border);
border-radius: 10px; padding: 10px 14px;
}
.videoIdRow label { color: var(--text-muted); font-size: 13px; }
.videoIdRow input[type="text"] {
background: var(--bg); border: 1px solid var(--border); border-radius: 6px;
color: var(--text); padding: 6px 10px; font-family: ui-monospace, monospace;
font-size: 14px; min-width: 260px; flex: 1; max-width: 420px;
}
.idStatus { font-size: 13px; min-width: 90px; }
.idStatusOk { color: #5dd28a; }
.idStatusBad { color: #e57373; }
.trimTimeline {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: 10px; padding: 16px;