refactor: 예정 일정 placeholder UI 개선

- 유튜브 아이콘 제거
- 업로드 예정 텍스트 하단으로 이동
- 배경 오버레이를 하단 그라데이션으로 변경

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
caadiq 2026-02-03 18:24:55 +09:00
parent f01b2b8054
commit 277c6a79c9

View file

@ -85,14 +85,14 @@ function VideoInfo({ schedule, isShorts, isScheduled = false }) {
*/
function ScheduledPlaceholder({ bannerUrl }) {
return (
<div className="relative aspect-video bg-gradient-to-br from-gray-800 to-gray-900 rounded-2xl overflow-hidden shadow-lg shadow-black/10 flex flex-col items-center justify-center">
<div className="relative aspect-video bg-gradient-to-br from-gray-800 to-gray-900 rounded-2xl overflow-hidden shadow-lg shadow-black/10">
{/* 배경: 배너 이미지 또는 패턴 */}
{bannerUrl ? (
<div
className="absolute inset-0 bg-cover bg-center"
style={{ backgroundImage: `url(${bannerUrl})` }}
>
<div className="absolute inset-0 bg-black/50" />
<div className="absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent" />
</div>
) : (
<div className="absolute inset-0 opacity-5">
@ -102,18 +102,9 @@ function ScheduledPlaceholder({ bannerUrl }) {
</div>
)}
{/* 유튜브 아이콘 */}
<div className="relative mb-4">
<div className="w-20 h-20 bg-red-500/20 backdrop-blur-sm rounded-full flex items-center justify-center">
<svg className="w-10 h-10 text-red-500" viewBox="0 0 24 24" fill="currentColor">
<path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z" />
</svg>
</div>
</div>
{/* 텍스트 */}
<div className="relative text-center">
<div className="flex items-center gap-2 text-white/80">
{/* 하단 텍스트 */}
<div className="absolute bottom-0 left-0 right-0 p-6">
<div className="flex items-center gap-2 text-white/90">
<Clock size={18} className="text-amber-400" />
<span className="text-lg font-medium">업로드 예정</span>
</div>