UI-tests und fixes aus tests

public/js/modules/board.js

@@ -314,7 +314,7 @@ function toggleBoardSplit() {
     localStorage.setItem('hyprcrd-board-split', state.boardSplitOpen ? '1' : '0');
     boardPreview?.classList.toggle('hidden', !state.boardSplitOpen);
     const btn = $('board-split-toggle');
-    if (btn) btn.classList.toggle('text-t-accent', state.boardSplitOpen);
+    if (btn) btn.classList.toggle('active', state.boardSplitOpen);
     if (!state.boardSplitOpen) {
         board.querySelectorAll('.board-card').forEach(el => el.classList.remove('preview-active'));
         state.boardPreviewCardId = null;
@@ -332,7 +332,7 @@ $('board-preview-edit')?.addEventListener('click', () => {
 if (state.boardSplitOpen) {
     boardPreview?.classList.remove('hidden');
     const btn = $('board-split-toggle');
-    if (btn) btn.classList.add('text-t-accent');
+    if (btn) btn.classList.add('active');
 }
 
 $('superview-toggle')?.addEventListener('click', () => {
@@ -340,49 +340,36 @@ $('superview-toggle')?.addEventListener('click', () => {
     localStorage.setItem('hyprcrd-superview', state.superView ? '1' : '0');
     const btn = $('superview-toggle');
     const icon = btn?.querySelector('i');
-    if (icon) icon.className = `ph ${state.superView ? 'ph-squares-four' : 'ph-list'} text-xs`;
-    if (btn) btn.classList.toggle('text-t-accent', state.superView);
+    if (icon) icon.className = `ph ${state.superView ? 'ph-squares-four' : 'ph-list'} text-sm`;
+    if (btn) btn.classList.toggle('active', state.superView);
     renderBoard();
 });
 if (state.superView) {
     const btn = $('superview-toggle');
     const icon = btn?.querySelector('i');
-    if (icon) icon.className = 'ph ph-squares-four text-xs';
-    if (btn) btn.classList.add('text-t-accent');
+    if (icon) icon.className = 'ph ph-squares-four text-sm';
+    if (btn) btn.classList.add('active');
 }
 
-$('hide-done')?.addEventListener('click', () => {
-    state.hideDone = !state.hideDone;
-    localStorage.setItem('hyprcrd-hide-done', state.hideDone ? '1' : '0');
-    const btn = $('hide-done');
-    const icon = btn?.querySelector('i');
-    if (icon) icon.className = `ph ${state.hideDone ? 'ph-check-square' : 'ph-check-circle'} text-xs`;
-    if (btn) btn.classList.toggle('text-t-accent', state.hideDone);
-    renderBoard();
-});
-if (state.hideDone) {
-    const btn = $('hide-done');
-    const icon = btn?.querySelector('i');
-    if (icon) icon.className = 'ph ph-check-square text-xs';
-    if (btn) btn.classList.add('text-t-accent');
-}
-
-$('hide-termine')?.addEventListener('click', () => {
-    state.hideTermine = !state.hideTermine;
-    localStorage.setItem('hyprcrd-hide-termine', state.hideTermine ? '1' : '0');
-    const btn = $('hide-termine');
-    const icon = btn?.querySelector('i');
-    if (icon) icon.className = `ph ${state.hideTermine ? 'ph-calendar-check' : 'ph-calendar-x'} text-xs`;
-    if (btn) btn.classList.toggle('text-t-accent', state.hideTermine);
-    renderBoard();
-});
-// Init toggle state
-if (state.hideTermine) {
-    const btn = $('hide-termine');
-    const icon = btn?.querySelector('i');
-    if (icon) icon.className = 'ph ph-calendar-check text-xs';
-    if (btn) btn.classList.add('text-t-accent');
+function initToggle(id, stateKey, lsKey, iconOff, iconOn) {
+    const btn = $(id);
+    if (!btn) return;
+    const apply = () => {
+        const icon = btn.querySelector('i');
+        if (icon) icon.className = `ph ${state[stateKey] ? iconOn : iconOff} text-sm`;
+        btn.classList.toggle('active', state[stateKey]);
+    };
+    btn.addEventListener('click', () => {
+        state[stateKey] = !state[stateKey];
+        localStorage.setItem(lsKey, state[stateKey] ? '1' : '0');
+        apply();
+        renderBoard();
+    });
+    apply();
 }
+initToggle('hide-done', 'hideDone', 'hyprcrd-hide-done', 'ph-check-circle', 'ph-check-square');
+initToggle('hide-termine', 'hideTermine', 'hyprcrd-hide-termine', 'ph-calendar-x', 'ph-calendar-check');
+initToggle('hide-tagged', 'hideTagged', 'hyprcrd-hide-tagged', 'ph-hash', 'ph-hash-straight');
 
 $('sort-toggle')?.addEventListener('click', () => {
     state.sortMode = SORT_MODES[(SORT_MODES.indexOf(state.sortMode) + 1) % SORT_MODES.length];
@@ -485,14 +472,18 @@ export function renderBoard() {
             }
         }
     }
-    // Hide appointments + birthdays
+    // Hide appointments + birthdays (tag-based and caldav-synced)
     if (state.hideTermine) {
-        cards = cards.filter(c => { const t = parseTags(c); return !t.includes('termin') && !t.includes('geburtstag'); });
+        cards = cards.filter(c => { const t = parseTags(c); return !t.includes('termin') && !t.includes('geburtstag') && !c.caldav_uid; });
     }
     // Hide done
     if (state.hideDone) {
         cards = cards.filter(c => !parseTags(c).includes('done'));
     }
+    // Hide tagged (cards with any tags)
+    if (state.hideTagged) {
+        cards = cards.filter(c => !c.tags);
+    }
     // Tag filter (intersects with bucket filter) — hierarchical: #nase matches #nase/popel
     if (state.activeTags.length) {
         cards = cards.filter(c => {