fix(webui): restore import glyphs
- bring the React import page back in line with the legacy emoji/glyph treatment\n- restore album, singles, auto-import, and queue fallback icons\n- keep the visual refresh aligned with the old page while preserving the React port
This commit is contained in:
parent
3fdc815794
commit
fe8ae8f290
6 changed files with 17 additions and 16 deletions
|
|
@ -235,15 +235,15 @@ export function getAutoImportStatusMeta(status: string): {
|
|||
};
|
||||
|
||||
const icons: Record<string, string> = {
|
||||
completed: 'OK',
|
||||
pending_review: '!',
|
||||
needs_identification: 'x',
|
||||
failed: 'x',
|
||||
scanning: '~',
|
||||
matched: 'OK',
|
||||
rejected: 'x',
|
||||
approved: 'OK',
|
||||
processing: '~',
|
||||
completed: '✓',
|
||||
pending_review: '⚠',
|
||||
needs_identification: '✗',
|
||||
failed: '✗',
|
||||
scanning: '⌛',
|
||||
matched: '✓',
|
||||
rejected: '✕',
|
||||
approved: '✓',
|
||||
processing: '⧗',
|
||||
};
|
||||
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -256,7 +256,7 @@ function AlbumImportPanelContent({ viewModel }: { viewModel: AlbumImportViewMode
|
|||
{group.album}
|
||||
</div>
|
||||
<div className={styles.importPageAlbumCardArtist} title={group.artist}>
|
||||
{group.artist} - {group.file_count} tracks
|
||||
{group.artist} · {group.file_count} tracks
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
|
|
@ -369,7 +369,7 @@ function AlbumCard({
|
|||
{album.artist}
|
||||
</div>
|
||||
<div className={styles.importPageAlbumCardMeta}>
|
||||
{album.total_tracks || 0} tracks - {album.release_date?.substring(0, 4) || ''}
|
||||
{album.total_tracks || 0} tracks · {album.release_date?.substring(0, 4) || ''}
|
||||
</div>
|
||||
</button>
|
||||
);
|
||||
|
|
@ -422,7 +422,7 @@ function AlbumMatchPanel({ viewModel }: { viewModel: AlbumImportViewModel }) {
|
|||
<div className={styles.importPageAlbumHeroTitle}>{albumMatch.album.name}</div>
|
||||
<div className={styles.importPageAlbumHeroArtist}>{albumMatch.album.artist}</div>
|
||||
<div className={styles.importPageAlbumHeroMeta}>
|
||||
{albumMatch.album.total_tracks || albumMatch.matches?.length || 0} tracks -{' '}
|
||||
{albumMatch.album.total_tracks || albumMatch.matches?.length || 0} tracks ·{' '}
|
||||
{albumMatch.album.release_date?.substring(0, 4) || ''}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -417,7 +417,7 @@ function AutoImportResultCard({
|
|||
onError={fallbackImage}
|
||||
/>
|
||||
) : (
|
||||
<div className={styles.autoImportCardArtFallback}>Album</div>
|
||||
<div className={styles.autoImportCardArtFallback}>💿</div>
|
||||
)}
|
||||
</div>
|
||||
<div className={styles.autoImportCardCenter}>
|
||||
|
|
|
|||
|
|
@ -115,6 +115,7 @@
|
|||
color: rgba(255, 255, 255, 0.5);
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
margin-bottom: -1px;
|
||||
|
|
|
|||
|
|
@ -156,7 +156,7 @@ function ImportQueueItem({ entry }: { entry: ImportQueueEntry }) {
|
|||
onError={fallbackImage}
|
||||
/>
|
||||
) : (
|
||||
<div className={`${styles.importPageQueueArt} ${styles.importPageQueueArtEmpty}`}>A</div>
|
||||
<div className={`${styles.importPageQueueArt} ${styles.importPageQueueArtEmpty}`}>♪</div>
|
||||
)}
|
||||
<div className={styles.importPageQueueInfo}>
|
||||
<div className={styles.importPageQueueName}>{entry.label}</div>
|
||||
|
|
|
|||
|
|
@ -214,7 +214,7 @@ export function SinglesImportPanel({
|
|||
</div>
|
||||
{manualMatch ? (
|
||||
<div className={styles.importPageSingleMatchedInfo}>
|
||||
OK {manualMatch.name} - {manualMatch.artist}
|
||||
✓ {manualMatch.name} - {manualMatch.artist}
|
||||
<button
|
||||
type="button"
|
||||
className={styles.importPageSingleMatchedChange}
|
||||
|
|
@ -231,7 +231,7 @@ export function SinglesImportPanel({
|
|||
className={styles.importPageIdentifyBtn}
|
||||
onClick={() => onOpenSearch(index)}
|
||||
>
|
||||
Search Identify
|
||||
🔍 Identify
|
||||
</button>
|
||||
</div>
|
||||
{openSearchIndex === index ? (
|
||||
|
|
|
|||
Loading…
Reference in a new issue