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

feat(ui): Midnight Glass v2 마감 — lucide 아이콘 통일 + 몰입 패널 웨이브 + 팝업 정합

Browse source 
- @mui/icons-material → lucide-react 전환 (23파일, 잔여 0)
- VoiceRecordingPanel: 9바 DOM 웨이브 → GradientWave (canvas)
- Vanilla 팝업 5종 style.css v2 정합 (글래스 네이비/헤어라인/블루,
  CSS 변수 주입 구조 유지 — 테마 반응형 보존)
This commit is contained in:
Yun Chan 2026-07-21 20:20:32 +09:00
parent a8a1d6e546
commit 082ed2ef02
30 changed files with 212 additions and 289 deletions
Download patch file Download diff file Expand all files Collapse all files

23
apps/desktop/src/renderer/components/SettingsModal.tsx
View file

@ -24,14 +24,7 @@ import {
Stack,
Paper,
} from '@mui/material'
import CloseIcon from '@mui/icons-material/Close'
import KeyboardIcon from '@mui/icons-material/Keyboard'
import EditIcon from '@mui/icons-material/Edit'
import MicIcon from '@mui/icons-material/Mic'
import LockIcon from '@mui/icons-material/Lock'
import CloudIcon from '@mui/icons-material/Cloud'
import CheckCircleIcon from '@mui/icons-material/CheckCircle'
import CancelIcon from '@mui/icons-material/Cancel'
import { X, Keyboard, Pencil, Mic, Lock, Cloud } from 'lucide-react'
import { d3roPalette, d3roFontMono, d3roShadow } from '@d3ro/ui/theme'
import { HotkeyRecordModal } from './HotkeyRecordModal'
import { formatHotkeyLabel, formatHotkeySegments } from '../utils/format-hotkey'
@ -100,7 +93,7 @@ function HotkeyDisplay({
</Typography>
)}
<IconButton size="small" onClick={onEdit} sx={{ color: d3roPalette.text.inactive, ml: 'auto' }}>
<EditIcon sx={{ fontSize: 16 }} />
<Pencil size={16} />
</IconButton>
</Box>
)
@ -342,7 +335,7 @@ export function SettingsModal({ open, onClose }: SettingsModalProps): React.Reac
>
{t('settings.title')}
<IconButton onClick={onClose} size="small" sx={{ color: d3roPalette.text.inactive }}>
<CloseIcon sx={{ fontSize: 18 }} />
<X size={18} />
</IconButton>
</DialogTitle>
<Divider sx={{ borderColor: d3roPalette.border.subtle }} />
@ -370,12 +363,12 @@ export function SettingsModal({ open, onClose }: SettingsModalProps): React.Reac
'& .MuiTabs-indicator': { bgcolor: d3roPalette.accent.amber, height: 2 },
}}
>
<Tab label={t('settings.tabs.general')} icon={<KeyboardIcon sx={{ fontSize: 14 }} />} iconPosition="start" />
<Tab label={t('settings.tabs.audio')} icon={<MicIcon sx={{ fontSize: 14 }} />} iconPosition="start" />
<Tab label={t('settings.tabs.general')} icon={<Keyboard size={14} />} iconPosition="start" />
<Tab label={t('settings.tabs.audio')} icon={<Mic size={14} />} iconPosition="start" />
<Tab label={t('settings.tabs.stt')} />
<Tab label={t('settings.tabs.llm')} />
<Tab label={t('license.nav')} icon={<LockIcon sx={{ fontSize: 14 }} />} iconPosition="start" />
<Tab label={t('settings.tabs.cloud') ?? 'Cloud'} icon={<CloudIcon sx={{ fontSize: 14 }} />} iconPosition="start" />
<Tab label={t('license.nav')} icon={<Lock size={14} />} iconPosition="start" />
<Tab label={t('settings.tabs.cloud') ?? 'Cloud'} icon={<Cloud size={14} />} iconPosition="start" />
<Tab label={t('settings.tabs.about')} />
</Tabs>
<Box sx={{ p: 3 }}>
@ -531,7 +524,7 @@ export function SettingsModal({ open, onClose }: SettingsModalProps): React.Reac
setSelectedDeviceId(deviceId)
window.electronAPI.audio.setSelectedDevice({ deviceId })
}}
startAdornment={<MicIcon sx={{ color: d3roPalette.text.inactive, mr: 1, fontSize: 18 }} />}
startAdornment={<Mic size={18} style={{ color: d3roPalette.text.inactive, marginRight: 8 }} />}
>
{audioDevices.map((device, idx) => (
<MenuItem key={`${device.deviceId}-${idx}`} value={device.deviceId}>