feat(ui): Midnight Glass v2 마감 — lucide 아이콘 통일 + 몰입 패널 웨이브 + 팝업 정합
- @mui/icons-material → lucide-react 전환 (23파일, 잔여 0) - VoiceRecordingPanel: 9바 DOM 웨이브 → GradientWave (canvas) - Vanilla 팝업 5종 style.css v2 정합 (글래스 네이비/헤어라인/블루, CSS 변수 주입 구조 유지 — 테마 반응형 보존)
This commit is contained in:
parent
a8a1d6e546
commit
082ed2ef02
30 changed files with 212 additions and 289 deletions
|
|
@ -4,12 +4,7 @@
|
|||
|
||||
import { useState, useEffect, useCallback } from 'react'
|
||||
import { Box, TextField, IconButton, Tooltip, LinearProgress } from '@mui/material'
|
||||
import AddIcon from '@mui/icons-material/Add'
|
||||
import DeleteIcon from '@mui/icons-material/Delete'
|
||||
import RefreshIcon from '@mui/icons-material/Refresh'
|
||||
import SearchIcon from '@mui/icons-material/Search'
|
||||
import SendIcon from '@mui/icons-material/Send'
|
||||
import DescriptionIcon from '@mui/icons-material/Description'
|
||||
import { Plus, Trash2, RefreshCw, Search, Send, FileText } from 'lucide-react'
|
||||
import { MetalCard, PhosphorText, Led, PhysicalButton, ScreenPanel } from '@d3ro/ui/components/ds'
|
||||
import { PageHeader, EmptyStateCard } from '../components/shared'
|
||||
import { isImeComposingEvent } from '../utils/keyboard'
|
||||
|
|
@ -96,7 +91,7 @@ export function KnowledgeBasePage(): React.ReactElement {
|
|||
title={t('rag.title').toUpperCase()}
|
||||
action={
|
||||
<PhysicalButton size="small" onClick={handleAddDocument} disabled={adding}>
|
||||
<AddIcon sx={{ fontSize: 14, mr: 0.5 }} /> {adding ? t('rag.adding') : t('rag.addDocument')}
|
||||
<Plus size={14} style={{ marginRight: 4 }} /> {adding ? t('rag.adding') : t('rag.addDocument')}
|
||||
</PhysicalButton>
|
||||
}
|
||||
/>
|
||||
|
|
@ -160,7 +155,7 @@ export function KnowledgeBasePage(): React.ReactElement {
|
|||
{documents.map((doc) => (
|
||||
<MetalCard key={doc.id}>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', gap: 2 }}>
|
||||
<DescriptionIcon sx={{ fontSize: 20, color: d3roPalette.text.inactive }} />
|
||||
<FileText size={20} style={{ color: d3roPalette.text.inactive }} />
|
||||
<Box sx={{ flex: 1 }}>
|
||||
<PhosphorText variant="body">{doc.fileName}</PhosphorText>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, mt: 0.25 }}>
|
||||
|
|
@ -176,13 +171,13 @@ export function KnowledgeBasePage(): React.ReactElement {
|
|||
<Tooltip title={t('rag.reindex')}>
|
||||
<IconButton size="small" onClick={() => handleReindex(doc.id)}
|
||||
sx={{ color: d3roPalette.text.inactive, '&:hover': { color: d3roPalette.accent.amber } }}>
|
||||
<RefreshIcon sx={{ fontSize: 16 }} />
|
||||
<RefreshCw size={16} />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Tooltip title={t('common.delete')}>
|
||||
<IconButton size="small" onClick={() => handleRemoveDocument(doc.id)}
|
||||
sx={{ color: d3roPalette.text.inactive, '&:hover': { color: d3roPalette.tag.red } }}>
|
||||
<DeleteIcon sx={{ fontSize: 16 }} />
|
||||
<Trash2 size={16} />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
</Box>
|
||||
|
|
@ -198,7 +193,7 @@ export function KnowledgeBasePage(): React.ReactElement {
|
|||
|
||||
<MetalCard>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
|
||||
<SearchIcon sx={{ fontSize: 20, color: d3roPalette.text.inactive }} />
|
||||
<Search size={20} style={{ color: d3roPalette.text.inactive }} />
|
||||
<TextField
|
||||
value={query}
|
||||
onChange={(e) => setQuery(e.target.value)}
|
||||
|
|
@ -219,7 +214,7 @@ export function KnowledgeBasePage(): React.ReactElement {
|
|||
/>
|
||||
<IconButton onClick={handleQuery} disabled={!query.trim() || querying}
|
||||
sx={{ color: query.trim() ? d3roPalette.accent.amber : d3roPalette.text.inactive }}>
|
||||
<SendIcon sx={{ fontSize: 20 }} />
|
||||
<Send size={20} />
|
||||
</IconButton>
|
||||
</Box>
|
||||
</MetalCard>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue