diff --git a/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx b/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx index 104c434..d1e343b 100644 --- a/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx +++ b/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx @@ -484,89 +484,83 @@ function MobileVarietySection({ schedule }) { const hasThumbnail = !!schedule.thumbnailUrl; const hasReplayUrl = !!schedule.replayUrl; const isYoutubeReplay = hasReplayUrl && /youtu\.?be/i.test(schedule.replayUrl); + const categoryColor = schedule.category?.color || '#06b6d4'; return ( -
-
- {/* 썸네일 */} -
- {hasThumbnail ? ( - {schedule.title} - ) : ( -
+ {/* 썸네일 카드 */} +
+ {hasThumbnail ? ( + {schedule.title} + ) : ( +
+ +
+ )} +
+ + {/* 정보 카드 */} +
+ {/* 방송사 + 날짜 */} +
+ {schedule.broadcaster && ( + - -
+ + {schedule.broadcaster} + )} + + {formatFullDate(schedule.date)} + {schedule.time && ` · ${formatTime(schedule.time)}`} +
- {/* 콘텐츠 */} -
- {/* 상단 */} -
- {/* 방송사 + 날짜 */} -
- {schedule.broadcaster && ( - - - {schedule.broadcaster} - - )} - - {formatFullDate(schedule.date)} + {/* 제목 */} +

+ {decodeHtmlEntities(schedule.title)} +

+ + {/* 멤버 */} + {members.length > 0 && ( +
+ {isFullGroup ? ( + + 프로미스나인 -
- - {/* 제목 */} -

- {decodeHtmlEntities(schedule.title)} -

- - {/* 멤버 */} - {members.length > 0 && ( -
- {isFullGroup ? ( - - 프로미스나인 - - ) : ( - members.map((member) => ( - - {member.name} - - )) - )} -
+ ) : ( + members.map((member) => ( + + {member.name} + + )) )}
+ )} - {/* 다시보기 */} - {hasReplayUrl && ( - - )} -
+ {/* 다시보기 */} + {hasReplayUrl && ( + + )}
); diff --git a/frontend/src/pages/pc/public/schedule/sections/VarietySection.jsx b/frontend/src/pages/pc/public/schedule/sections/VarietySection.jsx index 9605dc7..d22348f 100644 --- a/frontend/src/pages/pc/public/schedule/sections/VarietySection.jsx +++ b/frontend/src/pages/pc/public/schedule/sections/VarietySection.jsx @@ -10,87 +10,83 @@ function VarietySection({ schedule }) { const hasThumbnail = !!schedule.thumbnailUrl; const hasReplayUrl = !!schedule.replayUrl; const isYoutubeReplay = hasReplayUrl && /youtu\.?be/i.test(schedule.replayUrl); + const categoryColor = schedule.category?.color || '#06b6d4'; return ( -
-
- {/* 왼쪽: 썸네일 */} -
- {hasThumbnail ? ( - {schedule.title} - ) : ( -
- -
- )} -
- - {/* 오른쪽: 콘텐츠 */} -
- {/* 방송사 + 날짜 */} -
- {schedule.broadcaster && ( - - - {schedule.broadcaster} - - )} - - {formatFullDate(schedule.date)} - {schedule.time && ` · ${formatTime(schedule.time)}`} - +
+ {/* 썸네일 카드 */} +
+ {hasThumbnail ? ( + {schedule.title} + ) : ( +
+
+ )} +
- {/* 제목 */} -

- {decodeHtmlEntities(schedule.title)} -

- - {/* 멤버 */} - {members.length > 0 && ( -
- {isFullGroup ? ( - - 프로미스나인 - - ) : ( - members.map((member) => ( - - {member.name} - - )) - )} -
- )} - - {/* 다시보기 (하단 고정) */} - {hasReplayUrl && ( - + {/* 정보 카드 */} +
+ {/* 방송사 + 날짜 */} +
+ {schedule.broadcaster && ( + + + {schedule.broadcaster} + )} + + {formatFullDate(schedule.date)} + {schedule.time && ` · ${formatTime(schedule.time)}`} +
+ + {/* 제목 */} +

+ {decodeHtmlEntities(schedule.title)} +

+ + {/* 멤버 */} + {members.length > 0 && ( +
+ {isFullGroup ? ( + + 프로미스나인 + + ) : ( + members.map((member) => ( + + {member.name} + + )) + )} +
+ )} + + {/* 다시보기 */} + {hasReplayUrl && ( + + )}
);