feat: premium redesign — DM Serif, refined palette, flat score badges
- Design tokens (ds.ts, theme.ts, scoreTheme.ts): new warm palette (#152642 navy, #f9f8f6 warm white, #e8e7e4 borders, #b8975a gold accent), flat score tier badges replacing CSS gradients, Inter + DM Serif Display typography - Card components: white-background cards, DM Serif score numbers, max-2 badge chips with +N overflow tooltip, editorial score badge positioning - Layout shell: gold left-accent nav active state, 64px top bar, outlined workspace chip, DM Serif page titles - Shared atoms: GenericBadge (outlined/solid variants), ResultFilterBar (simplified chip styles), DecisionContextPanel (dot metrics, no left accent) - Global replacement (118 files): #1e3a5f→#152642, #e2e8f0→#e8e7e4, #f4f6f9→#f9f8f6 — all handled via Node.js for proper UTF-8 safety Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -13,7 +13,7 @@ export function ExecutiveSummaryPanel({ match }: Props) {
|
||||
|
||||
const rows: { icon: React.ReactNode; label: string; text: string }[] = [
|
||||
{
|
||||
icon: <Target size={15} color="#1e3a5f" />,
|
||||
icon: <Target size={15} color="#152642" />,
|
||||
label: 'Gesamteignung',
|
||||
text: match.explainabilitySummary || `${match.matchStrength}-Match mit ${match.matchScore} Punkten`,
|
||||
},
|
||||
|
||||
@@ -82,7 +82,7 @@ export function InquiryQuickDialog() {
|
||||
size="small"
|
||||
disabled={!message.trim()}
|
||||
startIcon={<Send size={14} />}
|
||||
sx={{ bgcolor: '#1e3a5f', '&:hover': { bgcolor: '#162d4a' } }}
|
||||
sx={{ bgcolor: '#152642', '&:hover': { bgcolor: '#162d4a' } }}
|
||||
>
|
||||
Anfrage senden
|
||||
</Button>
|
||||
|
||||
@@ -6,7 +6,7 @@ import type { Property } from '../../domain/property'
|
||||
import type { FutureSignal } from '../../domain/futureSignal'
|
||||
|
||||
const RESULT_TYPE_META: Record<string, { label: string; color: string }> = {
|
||||
VERIFIED_PORTFOLIO: { label: 'Verified Portfolio', color: '#1e3a5f' },
|
||||
VERIFIED_PORTFOLIO: { label: 'Verified Portfolio', color: '#152642' },
|
||||
MAISON_WORK: { label: 'Maison Work', color: '#0369a1' },
|
||||
FUTURE_AVAILABILITY: { label: 'Zukunftssignal', color: '#7c3aed' },
|
||||
}
|
||||
@@ -101,7 +101,7 @@ export function MatchDetailHeader({ match, property, signal, onBack, onCompare,
|
||||
size="small"
|
||||
startIcon={<Columns2 size={14} />}
|
||||
onClick={onCompare}
|
||||
sx={{ bgcolor: '#1e3a5f', '&:hover': { bgcolor: '#162d4a' } }}
|
||||
sx={{ bgcolor: '#152642', '&:hover': { bgcolor: '#162d4a' } }}
|
||||
>
|
||||
Vergleichen
|
||||
</Button>
|
||||
|
||||
@@ -46,7 +46,7 @@ export function MatchDetailHero({
|
||||
{/* Hero: image first, map fallback */}
|
||||
{!isFuture && (
|
||||
property?.images?.[0] ? (
|
||||
<Box sx={{ width: '100%', height: 400, overflow: 'hidden', bgcolor: '#e2e8f0', flexShrink: 0 }}>
|
||||
<Box sx={{ width: '100%', height: 400, overflow: 'hidden', bgcolor: '#e8e7e4', flexShrink: 0 }}>
|
||||
<img
|
||||
src={property.images[0]}
|
||||
alt={property.title}
|
||||
@@ -105,7 +105,7 @@ export function MatchDetailHero({
|
||||
size="small"
|
||||
startIcon={<Columns2 size={14} />}
|
||||
onClick={onCompare}
|
||||
sx={{ bgcolor: '#1e3a5f', '&:hover': { bgcolor: '#162d4a' }, textTransform: 'none' }}
|
||||
sx={{ bgcolor: '#152642', '&:hover': { bgcolor: '#162d4a' }, textTransform: 'none' }}
|
||||
>
|
||||
Vergleichen
|
||||
</Button>
|
||||
|
||||
@@ -28,7 +28,7 @@ export function NextActionsPanel({ match, onCompare, onPipeline, onInquire }: Pr
|
||||
variant="contained"
|
||||
startIcon={<MessageSquare size={14} />}
|
||||
onClick={onInquire}
|
||||
sx={{ justifyContent: 'flex-start', bgcolor: '#1e3a5f', '&:hover': { bgcolor: '#162d4a' } }}
|
||||
sx={{ justifyContent: 'flex-start', bgcolor: '#152642', '&:hover': { bgcolor: '#162d4a' } }}
|
||||
>
|
||||
Anfrage senden
|
||||
</Button>
|
||||
|
||||
@@ -20,7 +20,7 @@ export function factorLabel(criterion: string): string {
|
||||
// Convert normalised weight to 1-5 importance level relative to other factors in the same set
|
||||
export function importanceLabel(weight: number, maxWeight: number): { label: string; color: string } {
|
||||
const ratio = maxWeight > 0 ? weight / maxWeight : 0
|
||||
if (ratio >= 0.85) return { label: 'Entscheidend', color: '#1e3a5f' }
|
||||
if (ratio >= 0.85) return { label: 'Entscheidend', color: '#152642' }
|
||||
if (ratio >= 0.65) return { label: 'Sehr wichtig', color: '#1d4ed8' }
|
||||
if (ratio >= 0.40) return { label: 'Wichtig', color: '#475569' }
|
||||
if (ratio >= 0.20) return { label: 'Wenig wichtig',color: '#94a3b8' }
|
||||
|
||||
Reference in New Issue
Block a user