yunchan/d3ro-voice
1
0
Fork 0
Code Issues Pull requests Projects Releases 2 Packages Wiki Activity Actions 2

feat: MTG 카드 세로 풍성한 레이아웃

Browse source 
제목 heading 크기 + 2줄, 날짜/소요시간/메모수 구조적 배치,
하단 구분선 + 상태 LED + UPPERCASE 상태 텍스트.
This commit is contained in:
Yun Chan 2026-04-08 11:59:25 +09:00
parent 4b14fa9553
commit da25791c75
1 changed files with 35 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

70
src/renderer/pages/MeetingModePage.tsx
View file

@ -261,49 +261,49 @@ export function MeetingModePage(): React.ReactElement {
}} }}
> >
<MetalCard> <MetalCard>
{/* 상태 LED + 날짜 */} {/* 제목 — 여러 줄 허용 */}
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 1 }}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.75 }}>
<Led color={statusColor(session.status)} size={6} />
<PhosphorText variant="dim" sx={{ fontSize: d3roTypo.meta.size }}>
{session.status === 'completed' ? t('meeting.completed')
: session.status === 'error' ? t('meeting.error')
: session.status === 'processing' ? t('meeting.processing')
: t('meeting.recording')}
</PhosphorText>
</Box>
<PhosphorText variant="dim" sx={{ fontSize: d3roTypo.meta.size }}>
{formatDate(session.startedAt)}
</PhosphorText>
</Box>
{/* 제목 — ellipsis */}
<PhosphorText <PhosphorText
variant="compact" variant="heading"
sx={{ sx={{
display: '-webkit-box',
WebkitLineClamp: 2,
WebkitBoxOrient: 'vertical',
overflow: 'hidden', overflow: 'hidden',
textOverflow: 'ellipsis', mb: 1.5,
whiteSpace: 'nowrap',
display: 'block',
mb: 0.5,
}} }}
> >
{session.title ?? t('meeting.untitled')} {session.title ?? t('meeting.untitled')}
</PhosphorText> </PhosphorText>
{/* 메타 — 소요 시간 · 메모 수 */} {/* 정보 그리드 */}
<PhosphorText variant="dim" sx={{ <Box sx={{ display: 'flex', flexDirection: 'column', gap: 0.75, mb: 1.5 }}>
fontSize: d3roTypo.meta.size, <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
overflow: 'hidden', <PhosphorText variant="dim" sx={{ fontSize: d3roTypo.meta.size, fontFamily: d3roFontMono }}>
textOverflow: 'ellipsis', {formatDate(session.startedAt)}
whiteSpace: 'nowrap', </PhosphorText>
}}> </Box>
{session.durationMs != null <Box sx={{ display: 'flex', gap: 1.5 }}>
? t('meeting.duration', { minutes: Math.round(session.durationMs / 60000) }) <PhosphorText variant="dim" sx={{ fontSize: d3roTypo.meta.size, fontFamily: d3roFontMono }}>
: '—'} {session.durationMs != null
{' · '} ? t('meeting.duration', { minutes: Math.round(session.durationMs / 60000) })
{t('meeting.memos')}: {session.memoCount} : '—'}
</PhosphorText> </PhosphorText>
<PhosphorText variant="dim" sx={{ fontSize: d3roTypo.meta.size, fontFamily: d3roFontMono }}>
{t('meeting.memos')}: {session.memoCount}
</PhosphorText>
</Box>
</Box>
{/* 하단 — 상태 표시 */}
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.75, pt: 1, borderTop: `1px solid ${d3roPalette.border.subtle}` }}>
<Led color={statusColor(session.status)} size={6} />
<PhosphorText variant="dim" sx={{ fontSize: d3roTypo.label.size, textTransform: 'uppercase', letterSpacing: d3roTypo.label.spacing }}>
{session.status === 'completed' ? t('meeting.completed')
: session.status === 'error' ? t('meeting.error')
: session.status === 'processing' ? t('meeting.processing')
: t('meeting.recording')}
</PhosphorText>
</Box>
{/* 프로세싱 진행 바 */} {/* 프로세싱 진행 바 */}
{session.status === 'processing' && progress && progress.sessionId === session.id && ( {session.status === 'processing' && progress && progress.sessionId === session.id && (