Verteilte
Sichten.
- +
Daten waren vorhanden – aber nicht operativ nutzbar.
-diff --git a/docs/Praesentation/Sales_Intelligence_Cockpit_CLevel_v2.html b/docs/Praesentation/Sales_Intelligence_Cockpit_CLevel_v2.html index 827aeab14..488d5d990 100644 --- a/docs/Praesentation/Sales_Intelligence_Cockpit_CLevel_v2.html +++ b/docs/Praesentation/Sales_Intelligence_Cockpit_CLevel_v2.html @@ -29,20 +29,20 @@ padding: 0; } - /* 1080p Optimization - Maximum Whitespace */ + /* 1080p Precision Layout */ .slide { - min-height: 140vh; /* High whitespace between sections */ + height: 100vh; width: 100vw; display: flex; align-items: center; justify-content: center; - padding: 0 10%; + padding: 0 8%; position: relative; } .split-layout { display: grid; - grid-template-cols: 38% 52%; + grid-template-cols: 35% 55%; width: 100%; height: 100%; align-items: center; @@ -51,53 +51,52 @@ .story-content { z-index: 10; - max-width: 500px; } .visual-area { position: relative; - height: 500px; + height: 100%; display: flex; align-items: center; - justify-content: flex-end; /* Right-aligned */ + justify-content: flex-end; } - /* UI Element Styling - Compressed & Authentic */ + /* DGS Dashboard UI - 1:1 Replica */ .dashboard-card { background: white; border: 1px solid #cbd5e1; - border-radius: 0.75rem; - box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.1); - padding: 1.25rem; + border-radius: 0.5rem; + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08); width: 100%; - max-width: 580px; + max-width: 720px; } - .system-header { + .card-header { + padding: 1.5rem; + border-bottom: 1px solid #f1f5f9; + } + + .badge-red { background: #fee2e2; color: #b91c1c; font-size: 10px; font-weight: 800; padding: 2px 8px; border-radius: 4px; text-transform: uppercase; } + .badge-orange { background: #ffedd5; color: #c2410c; font-size: 10px; font-weight: 800; padding: 2px 8px; border-radius: 4px; text-transform: uppercase; } + + .data-grid { + display: grid; + grid-template-cols: repeat(8, 1fr); + padding: 1rem; background: #f8fafc; - border-bottom: 1px solid #e2e8f0; - padding: 0.5rem 1rem; - margin: -1.25rem -1.25rem 1.25rem -1.25rem; - border-radius: 0.75rem 0.75rem 0 0; - display: flex; - gap: 0.5rem; + border-top: 1px solid #f1f5f9; + align-items: center; + text-align: center; } - .dot { width: 8px; height: 8px; border-radius: 50%; background: #e2e8f0; } - - .kpi-card { - background: white; - border-radius: 1rem; - border: 1px solid #e2e8f0; - padding: 2rem; - box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05); - } + .data-cell { font-size: 11px; font-weight: 600; color: #334155; } + .data-label { font-size: 9px; color: #94a3b8; font-weight: 700; margin-bottom: 4px; } /* Scrollytelling Transitions */ .visual-element { position: absolute; opacity: 0; - transform: translateY(80px); + transform: translateY(40px); pointer-events: none; width: 100%; display: flex; @@ -119,13 +118,12 @@ z-index: 110; } - /* Solid White Header */ header { position: fixed; top: 0; left: 0; width: 100%; - padding: 1.5rem 4rem; + padding: 1.5rem 3rem; background: #ffffff; z-index: 100; border-bottom: 1px solid #f1f5f9; @@ -135,65 +133,49 @@ box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); } - .logo-img { - width: 14rem; - } + .logo-img { width: 14rem; } h2 { - letter-spacing: -0.05em; - line-height: 1.0; - font-size: 5rem; + letter-spacing: -0.04em; + line-height: 1.1; + font-size: 4.5rem; font-weight: 800; - margin-bottom: 3rem; + margin-bottom: 2rem; } - .text-xl { font-size: 1.25rem; } - .text-2xl { font-size: 1.6rem; color: #475569; font-weight: 400; } - - .highlight-blue { - color: var(--robo-blue); - } + .text-2xl { font-size: 1.5rem; color: #475569; font-weight: 400; }
-