34 lines
852 B
JavaScript
34 lines
852 B
JavaScript
import { html } from 'htm/preact';
|
|
|
|
const styles = {
|
|
statCard: {
|
|
background: 'var(--bg-elevated)',
|
|
border: '1px solid var(--border-color)',
|
|
borderRadius: 'var(--radius-md)',
|
|
padding: '12px',
|
|
transition: 'var(--transition)'
|
|
},
|
|
statLabel: {
|
|
fontSize: '12px',
|
|
color: 'var(--text-secondary)',
|
|
marginBottom: '6px',
|
|
textTransform: 'uppercase',
|
|
fontWeight: 600
|
|
},
|
|
statValue: {
|
|
fontSize: '22px',
|
|
fontWeight: 600,
|
|
color: 'var(--primary)',
|
|
fontFamily: '"Courier New", monospace'
|
|
}
|
|
};
|
|
|
|
export function StatCard({ label, value }) {
|
|
return html`
|
|
<div style=${styles.statCard}>
|
|
<div style=${styles.statLabel}>${label}</div>
|
|
<div style=${styles.statValue}>${value}</div>
|
|
</div>
|
|
`;
|
|
}
|