feat(members): 전 멤버 섹션 제거
- PC 멤버 페이지에서 전 멤버 섹션 제거 - 모바일 멤버 페이지에서 전 멤버 섹션 제거 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
9163ade56d
commit
45da9c6277
2 changed files with 1 additions and 80 deletions
|
|
@ -54,15 +54,11 @@ function MobileMembers() {
|
||||||
}
|
}
|
||||||
}, [allMembers.length]);
|
}, [allMembers.length]);
|
||||||
|
|
||||||
// 현재/전 멤버 분리
|
// 현재 멤버만 표시
|
||||||
const currentMembers = useMemo(
|
const currentMembers = useMemo(
|
||||||
() => allMembers.filter((m) => !m.is_former),
|
() => allMembers.filter((m) => !m.is_former),
|
||||||
[allMembers]
|
[allMembers]
|
||||||
);
|
);
|
||||||
const formerMembers = useMemo(
|
|
||||||
() => allMembers.filter((m) => m.is_former),
|
|
||||||
[allMembers]
|
|
||||||
);
|
|
||||||
|
|
||||||
// 나이 계산
|
// 나이 계산
|
||||||
const calculateAge = (birthDate) => {
|
const calculateAge = (birthDate) => {
|
||||||
|
|
@ -105,28 +101,6 @@ function MobileMembers() {
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 전 멤버 섹션 */}
|
|
||||||
{formerMembers.length > 0 && (
|
|
||||||
<>
|
|
||||||
<div className="flex items-center gap-3 my-6">
|
|
||||||
<div className="flex-1 h-px bg-gray-300" />
|
|
||||||
<span className="text-gray-400 text-sm font-medium">전 멤버</span>
|
|
||||||
<div className="flex-1 h-px bg-gray-300" />
|
|
||||||
</div>
|
|
||||||
<div className="grid grid-cols-2 gap-4">
|
|
||||||
{formerMembers.map((member, index) => (
|
|
||||||
<MemberCard
|
|
||||||
key={member.id}
|
|
||||||
member={member}
|
|
||||||
index={index}
|
|
||||||
onClick={() => setSelectedMember(member)}
|
|
||||||
shouldAnimate={shouldAnimate}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* 선택된 멤버 모달 */}
|
{/* 선택된 멤버 모달 */}
|
||||||
<AnimatePresence>
|
<AnimatePresence>
|
||||||
{selectedMember && (
|
{selectedMember && (
|
||||||
|
|
|
||||||
|
|
@ -91,59 +91,6 @@ function Members() {
|
||||||
</motion.div>
|
</motion.div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 전 멤버 섹션 */}
|
|
||||||
{members.filter((m) => m.is_former).length > 0 && (
|
|
||||||
<motion.div
|
|
||||||
initial={{ opacity: 0, y: 30 }}
|
|
||||||
animate={{ opacity: 1, y: 0 }}
|
|
||||||
transition={{ delay: 0.5 }}
|
|
||||||
className="mt-16"
|
|
||||||
>
|
|
||||||
<h2 className="text-2xl font-bold mb-8 text-gray-400">전 멤버</h2>
|
|
||||||
<div className="grid grid-cols-5 gap-8">
|
|
||||||
{members
|
|
||||||
.filter((m) => m.is_former)
|
|
||||||
.map((member, index) => (
|
|
||||||
<motion.div
|
|
||||||
key={member.id}
|
|
||||||
initial={{ opacity: 0, y: 30 }}
|
|
||||||
animate={{ opacity: 1, y: 0 }}
|
|
||||||
transition={{ delay: 0.6 + index * 0.1 }}
|
|
||||||
className="group h-full"
|
|
||||||
>
|
|
||||||
<div className="relative bg-white rounded-3xl overflow-hidden shadow-lg hover:shadow-2xl transition-all duration-300 h-full flex flex-col">
|
|
||||||
{/* 이미지 - grayscale */}
|
|
||||||
<div className="aspect-[3/4] bg-gray-100 overflow-hidden flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src={member.image_url}
|
|
||||||
alt={member.name}
|
|
||||||
className="w-full h-full object-cover grayscale group-hover:grayscale-0 transition-all duration-500"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 정보 */}
|
|
||||||
<div className="p-6 flex-1 flex flex-col">
|
|
||||||
<h3 className="text-xl font-bold mb-3 text-gray-500">
|
|
||||||
{member.name}
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<div className="flex items-center gap-2 text-sm text-gray-400">
|
|
||||||
<Cake size={14} />
|
|
||||||
<span>
|
|
||||||
{formatDate(member.birth_date, 'YYYY.MM.DD')}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 호버 효과 - 컬러 바 */}
|
|
||||||
<div className="absolute bottom-0 left-0 right-0 h-1 bg-gray-400 transform scale-x-0 group-hover:scale-x-100 transition-transform duration-300" />
|
|
||||||
</div>
|
|
||||||
</motion.div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</motion.div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue