make css more generic
This commit is contained in:
@@ -84,6 +84,7 @@ function applyTheme(theme) {
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// ─── Screen management ───────────────────────────────────────────────────────
|
||||
|
||||
function showScreen(screen) {
|
||||
@@ -124,12 +125,17 @@ async function showClassPicker() {
|
||||
classes.forEach(cls => {
|
||||
const card = document.createElement('div');
|
||||
card.className = 'class-card';
|
||||
card.style.setProperty('--card-accent', cls.theme['--theme-accent'] || 'var(--theme-accent)');
|
||||
const bg = cls.theme['--theme-bg-mid'] || '';
|
||||
const border = cls.theme['--theme-accent'] || '';
|
||||
const text = cls.theme['--theme-text'] || '';
|
||||
const muted = cls.theme['--theme-muted'] || '';
|
||||
if (bg) card.style.background = bg;
|
||||
if (border) card.style.borderColor = border;
|
||||
card.innerHTML = `
|
||||
<div class="class-card-icon">${cls.icon || '📚'}</div>
|
||||
<div class="class-card-info">
|
||||
<div class="class-card-name">${cls.name}</div>
|
||||
<div class="class-card-desc">${cls.description || ''}</div>
|
||||
<div class="class-card-name" style="color:${text}">${cls.name}</div>
|
||||
<div class="class-card-desc" style="color:${muted}">${cls.description || ''}</div>
|
||||
</div>
|
||||
`;
|
||||
card.onclick = () => selectClass(cls.id);
|
||||
|
||||
Reference in New Issue
Block a user