design.estate/dees-catalog
3
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(chart-log, simple-appdash): align terminal and dashboard theming with brightness mode and improve app dashboard scroll presentation

Browse Source
This commit is contained in:
Jürgen Kunz
2026-04-03 13:33:56 +00:00
parent 77130ffb5e
commit f052fb9c9f
5 changed files with 98 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
ts_web/elements/00group-simple/dees-simple-appdash/dees-simple-appdash.demo.ts
View File

@@ -110,6 +110,48 @@ class DemoViewDashboard extends DeesElement {
console.log('Tile action:', e.detail);
}}
></dees-statsgrid>
<h2 style="margin-top: 40px;">Recent Activity</h2>
<p>Below is a log of recent system events and user activity to demonstrate scrollable content.</p>
${[
{ time: '2 min ago', event: 'User john@example.com logged in from 192.168.1.42', type: 'info' },
{ time: '5 min ago', event: 'Deployment v3.52.1 completed successfully on production', type: 'success' },
{ time: '12 min ago', event: 'Database backup finished — 2.4 GB compressed', type: 'info' },
{ time: '18 min ago', event: 'SSL certificate renewed for api.example.com (expires 2027-04-03)', type: 'success' },
{ time: '25 min ago', event: 'Memory usage spike on worker-03 (92%) — auto-scaled to 4 instances', type: 'warning' },
{ time: '31 min ago', event: 'New user registration: sarah@company.io', type: 'info' },
{ time: '45 min ago', event: 'Scheduled job "cleanup-temp-files" completed — removed 1,247 files', type: 'info' },
{ time: '1 hour ago', event: 'API rate limit reached for client app-mobile-ios (429 responses)', type: 'warning' },
{ time: '1.5 hours ago', event: 'CDN cache purged for /assets/* — 340 objects invalidated', type: 'info' },
{ time: '2 hours ago', event: 'Failed login attempt for admin@example.com from 203.0.113.50 (blocked)', type: 'error' },
{ time: '2.5 hours ago', event: 'Webhook delivery to https://hooks.slack.com succeeded (200 OK)', type: 'info' },
{ time: '3 hours ago', event: 'Cron job "generate-reports" started — processing Q1 2026 data', type: 'info' },
{ time: '3.5 hours ago', event: 'Load balancer health check: all 8 nodes healthy', type: 'success' },
{ time: '4 hours ago', event: 'DNS propagation complete for new subdomain staging.example.com', type: 'success' },
].map(item => html`
<div style="
display: flex;
align-items: baseline;
gap: 12px;
padding: 10px 0;
border-bottom: 1px solid ${cssManager.bdTheme('hsl(0 0% 90%)', 'hsl(0 0% 12%)')};
font-size: 13px;
">
<span style="
flex-shrink: 0;
width: 100px;
font-size: 11px;
color: ${cssManager.bdTheme('hsl(0 0% 55%)', 'hsl(0 0% 45%)')};
">${item.time}</span>
<span style="
color: ${item.type === 'error' ? cssManager.bdTheme('hsl(0 72% 50%)', 'hsl(0 72% 65%)') :
item.type === 'warning' ? cssManager.bdTheme('hsl(25 95% 50%)', 'hsl(25 95% 63%)') :
item.type === 'success' ? cssManager.bdTheme('hsl(142 70% 40%)', 'hsl(142 70% 55%)') :
cssManager.bdTheme('hsl(0 0% 30%)', 'hsl(0 0% 75%)')};
">${item.event}</span>
</div>
`)}
`;
}
}