refactor: 예정 일정 placeholder UI 개선
- 유튜브 아이콘 제거 - 업로드 예정 텍스트 하단으로 이동 - 배경 오버레이를 하단 그라데이션으로 변경 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
f01b2b8054
commit
277c6a79c9
1 changed files with 5 additions and 14 deletions
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue