';
// Linke Zone: die eigenen Projekte mit ihren Terminen
- const daten = dashDaten();
html += '
';
const zuAlle = dashZuLesen();
const alleOffen = daten.projekte.some(x => !zuAlle.has(dashProjKey(x.p)));
@@ -153,7 +159,6 @@ async function renderDashboard(){
if(typeof renderDashNeu === 'function'){ renderDashNeu(); ladeBenachrichtigungen(true); }
dashKalDaten = daten;
renderDashKalender();
- startDashboardClock();
}
// ---------- Meine Projekte + Kalender (Entwurf B "Monatsblatt") ----------
@@ -164,6 +169,8 @@ async function renderDashboard(){
let dashKalDaten = null;
let dashKalMonat = null; // { jahr, monat } (monat 0–11)
let dashKalTag = null; // ISO-Datum
+// dashNotizen: { project_uid: {anzahl, zuletzt} } aus GET /projekt-notizen/anzahl.
+let dashNotizen = {};
// dashDaten: sammelt aus der aktuellen Sitzung (currentWeek()) die Projekte
// des angemeldeten Kontos und alle Kalendereinträge. Ein Projekt gehört dazu,
@@ -440,9 +447,8 @@ function renderDashProjekte(daten){
const key = dashProjKey(p);
const istZu = zu.has(key);
const rollen = x.rollen.length
- ? x.rollen.map(r => '
' + esc(r.rolle) + ' ').join('')
- : '
nur Aufgabe ';
+ ? x.rollen.map(r => esc(r.rolle) + (r.state === 2 ? ', Unterstützung' : '')).join(' / ')
+ : 'nur eigene Aufgabe';
const aktLp = (typeof lpActiveList === 'function' ? lpActiveList(p) : [])[0];
const pct = aktLp && p.lph && p.lph[aktLp] !== undefined && p.lph[aktLp] !== '' ? Math.max(0, Math.min(100, Number(p.lph[aktLp]) || 0)) : null;
const phase = aktLp
@@ -463,7 +469,7 @@ function renderDashProjekte(daten){
// Eingeklappt bleibt sichtbar, was Aufmerksamkeit braucht: wie viele
// Termine überfällig bzw. offen sind.
const kurz = (ueber.length ? '
' + ueber.length + ' überfällig ' : '')
- + '
' + kommend.length + ' offen ';
+ + '
' + kommend.length + ' offen ';
return '
'
+ '
'
+ (daten.projekte.length > 1 ? '
' + icon('grip') + ' ' : '')
@@ -472,10 +478,10 @@ function renderDashProjekte(daten){
+ '
' + esc(p.nr || '') + ' ' + esc(p.name || '') + ' '
+ ''
+ '
' + kurz + ' '
- + '
' + rollen + ' '
+ '
Öffnen '
+ '
'
+ '
'
+ + renderDashProjektInfo(x, rollen)
+ '
' + phase + '
'
+ '
' + zeilen + mehr + '
'
+ '
'
@@ -483,6 +489,103 @@ function renderDashProjekte(daten){
}).join('') + '
';
}
+// renderDashWoche: Band „Diese Woche“ (Entwurf „Bauplan“): Mo bis Fr als
+// Spalten mit den Terminen der eigenen Projekte an diesem Tag — eigene
+// Aufgaben, Aufgaben im Projekt, Meilensteine, Überfälliges. Je Tag höchstens
+// DASH_WOCHE_JE_TAG, der Rest als „+ N weitere“. Parameter: daten (dashDaten()).
+const DASH_WOCHE_JE_TAG = 4;
+function renderDashWoche(daten){
+ if(!daten.geladen || !daten.projekte.length) return '';
+ const heute = heuteIso();
+ const mo = dashWochenMontag();
+ const TAGE = ['Mo', 'Di', 'Mi', 'Do', 'Fr'];
+ let spalten = '';
+ for(let i = 0; i < 5; i++){
+ const d = new Date(mo); d.setDate(mo.getDate() + i);
+ const iso = formatDateISO(d);
+ const e = daten.eintraege.filter(x => x.datum === iso)
+ .sort((a, b) => (b.meins ? 1 : 0) - (a.meins ? 1 : 0));
+ const sicht = e.slice(0, DASH_WOCHE_JE_TAG);
+ const rest = e.length - sicht.length;
+ spalten += '
'
+ + '
' + TAGE[i] + ' ' + d.getDate() + '.' + (d.getMonth() + 1) + '.
'
+ + '
';
+ }
+ const legende = '
'
+ + '
';
+ return dashAbschnitt('Diese Woche', null, 'eigene Aufgaben und Termine meiner Projekte',
+ '
');
+}
+
+// renderDashProjektInfo: Zeile „Meine Rolle | Team | Notizen“ im Projektblock
+// (Eriks Wunsch): die eigene Rolle, die übrigen Beteiligten als Kürzel-Kreise
+// in den Rollenfarben (wie Projektliste, beteiligtenAvatarHtml()) und — nur
+// wenn vorhanden — die Zahl der Notizen mit Sprung in den Reiter „Notizen“.
+// Parameter: x (Eintrag aus dashDaten()), rollenText. Rückgabe: HTML-String.
+const DASH_TEAM_MAX = 5;
+function renderDashProjektInfo(x, rollenText){
+ const p = x.p;
+ const w = currentWeek();
+ const ich = currentUser && currentUser.personId;
+ const personen = {};
+ ((w && w.people) || []).forEach(q => { personen[q.id] = q; });
+ const eintraege = [];
+ Object.keys(p.assign || {}).forEach(key => {
+ const [pid, role] = key.split('|');
+ const state = Number(p.assign[key]) || 0;
+ if(state > 0) eintraege.push({ person: personen[pid] || { id: pid, name: pid, fullName: pid }, role, state });
+ });
+ const alle = beteiligteJePerson(eintraege);
+ const ichB = alle.find(b => b.person.id === ich);
+ const team = alle.filter(b => b.person.id !== ich);
+ const kreis = b => beteiligtenAvatarHtml(b, typeof roleClass === 'function' ? roleClass(b.role) : '');
+ const kurzName = b => {
+ const teile = String(b.person.fullName || b.person.name || '').trim().split(/\s+/);
+ return teile.length > 1 ? teile[0] + ' ' + teile[teile.length - 1][0] + '.' : teile[0];
+ };
+ const namen = team.length > 2
+ ? team.slice(0, 2).map(kurzName).join(', ') + ' +' + (team.length - 2)
+ : team.map(kurzName).join(', ');
+
+ let html = '
';
+}
+
+// dashZuletzt: „zuletzt heute/gestern“ oder „vom 28.10.“ zu einem Zeitstempel.
+function dashZuletzt(zeit){
+ const d = new Date(zeit);
+ if(isNaN(d)) return '';
+ const tage = -tageBis(formatDateISO(d));
+ if(tage <= 0) return 'zuletzt heute';
+ if(tage === 1) return 'zuletzt gestern';
+ return 'vom ' + d.getDate() + '.' + (d.getMonth() + 1) + '.';
+}
+
// renderDashTermin: eine Terminzeile im Projektblock und in der Tagesliste
// des Kalenders. Eigene Aufgaben tragen das Zeichen "A" in Akzentfarbe,
// fremde Aufgaben dazu die Zuständigen, Meilensteine eine Raute.
@@ -593,22 +696,30 @@ function dashKalBlaettern(n){
renderDashKalender();
}
-// renderDashboardKopf: Begrüßung und Datum links, Sitzung und Uhr klein
-// rechts. Die Uhrzeit war zuvor die größte Zahl auf dem Bildschirm — sie ist
-// die Angabe, nach der man am wenigsten handelt, und steht deshalb am Rand.
-// Die Inhalte füllt startDashboardClock() live nach.
-// Parameter: weekLabel. Rückgabe: HTML-String.
+// renderDashboardKopf: Titel und Kalenderwoche statt Begrüßung (Entwurf
+// „Bauplan“, Eriks Wahl): „KW 45, Mo 2. bis Fr 6. November 2026“, rechts die
+// Sitzung. Parameter: weekLabel. Rückgabe: HTML-String.
function renderDashboardKopf(weekLabel){
+ const MONATE = ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'];
+ const mo = dashWochenMontag();
+ const fr = new Date(mo); fr.setDate(mo.getDate() + 4);
+ const zeile = 'KW ' + getWeekNumber(mo) + ', Mo ' + mo.getDate() + '.'
+ + (mo.getMonth() !== fr.getMonth() ? ' ' + MONATE[mo.getMonth()] : '')
+ + ' bis Fr ' + fr.getDate() + '. ' + MONATE[fr.getMonth()] + ' ' + fr.getFullYear();
return '
'
- + '
'
- + '
'
- + (weekLabel ? '' + esc(weekLabel) + ' ' : '')
- + '
'
+ + '
' + esc(zeile) + ' '
+ + '
Meine Aufgaben '
+ + (weekLabel ? '
Sitzung ' + esc(weekLabel) + '
' : '')
+ '
';
}
+// dashWochenMontag: Montag der laufenden Woche (lokale Zeit, 0 Uhr).
+function dashWochenMontag(){
+ const d = parseDateISO(heuteIso());
+ d.setDate(d.getDate() - ((d.getDay() + 6) % 7));
+ return d;
+}
+
// renderDashboardBand: der Befund des Tages als Satz, daneben die Kennzahlen.
//
// Zuvor standen hier vier gleich große Kacheln, von denen meist drei eine
@@ -634,17 +745,17 @@ function renderDashboardBand(z){
satz = '
Nichts offen, nichts überfällig. ';
}
- const zahl = (wert, label) =>
- '
' + wert + ' ' + label + '
';
+ const zahl = (wert, label, rot) =>
+ '
' + label + ' ' + wert + '
';
const ruhig = z.ueberfaellig === 0 && z.heuteFaellig === 0;
return '
'
+ '
' + satz + '
'
+ '
'
+ zahl(z.aufgaben, 'offene Aufgaben')
- + zahl(z.termine, 'Termine im Blick')
+ + zahl(z.ueberfaellig, 'überfällig', z.ueberfaellig > 0)
+ + zahl(z.dieseWoche, 'diese Woche fällig')
+ zahl(z.freigaben, 'Freigaben')
- + zahl(z.abwesend, 'heute abwesend')
+ '
';
}
@@ -666,43 +777,6 @@ function dashLeer(text){
return '
';
}
-// greetingForHour:// greetingForHour: liefert je Tageszeit eine passende Begrüßung. Parameter:
-// hour (Number, 0-23). Rückgabe: String.
-function greetingForHour(hour){
- if(hour < 5) return 'Gute Nacht';
- if(hour < 11) return 'Guten Morgen';
- if(hour < 18) return 'Guten Tag';
- if(hour < 22) return 'Guten Abend';
- return 'Gute Nacht';
-}
-
-// startDashboardClock: (re-)startet das Intervall, das Begrüßung, Datum und
-// Uhrzeit im Dashboard-Header aktualisiert. Bricht sich selbst ab, sobald die
-// Zielelemente nicht mehr im DOM sind (z. B. weil das Dashboard neu gerendert
-// wurde). Keine Parameter, keine Rückgabe.
-function startDashboardClock(){
- if(dashboardClockTimer) clearInterval(dashboardClockTimer);
- const name = (currentUser && (currentUser.displayName || currentUser.username)) || '';
- const tick = () => {
- const textEl = document.getElementById('dashboardGreetingText');
- const dateEl = document.getElementById('dashboardGreetingDate');
- const clockEl = document.getElementById('dashboardClock');
- if(!textEl || !dateEl || !clockEl){
- clearInterval(dashboardClockTimer);
- dashboardClockTimer = null;
- return;
- }
- const now = new Date();
- // Begrüßung und Datum stehen in EINER Zeile (früher untereinander), das
- // Datum als gedämpfter Zusatz — deshalb der führende Gedankenstrich.
- textEl.textContent = greetingForHour(now.getHours()) + (name ? ', ' + name : '');
- dateEl.textContent = ' — ' + now.toLocaleDateString('de-DE', { weekday: 'long', day: '2-digit', month: 'long', year: 'numeric' });
- clockEl.textContent = now.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' });
- };
- tick();
- dashboardClockTimer = setInterval(tick, 30000);
-}
-
// relativerTag: "heute", "morgen", "in 5 Tagen", "seit 3 Tagen" zu einem
// ISO-Datum. Die Angabe steht neben dem Datum, weil "12.08." allein nicht
// sagt, ob das morgen oder in drei Wochen ist.
diff --git a/public/js/einfuehrung.js b/public/js/einfuehrung.js
index 5af060b..4ef552a 100644
--- a/public/js/einfuehrung.js
+++ b/public/js/einfuehrung.js
@@ -44,7 +44,7 @@ const EINFUEHRUNG_SCHRITTE = [
text: () => 'Dein Konto: Passwort, E-Mail-Adresse, deine KI-Schlüssel und die Darstellung. Hier kannst du diesen
Rundgang jederzeit neu starten .' },
{ id: 'admin', wenn: () => typeof hatAdminRecht === 'function' && hatAdminRecht(), ziel: '#adminAccordionToggle', titel: 'Admin',
text: () => 'Du darfst Teile der Verwaltung pflegen: ' + esc(typeof ADMIN_SECTIONS !== 'undefined' ? ADMIN_SECTIONS.filter(adminAbschnittErlaubt).map(s => s.title).join(', ') : '') + '.' },
- { id: 'ende', tab: 'dashboard', titel: 'Fertig!',
+ { id: 'ende', tab: 'dashboard', titel: 'Rundgang abgeschlossen',
text: () => {
const hinweise = [];
if(currentUser && !currentUser.personId){
diff --git a/public/js/globals.js b/public/js/globals.js
index 84f8515..4d31e89 100644
--- a/public/js/globals.js
+++ b/public/js/globals.js
@@ -147,6 +147,7 @@ const TAB_SLUGS = {
wochenbericht: 'Wochenbericht',
load: 'Auslastung',
abwesenheit: 'Abwesenheiten',
+ notizen: 'Notizen',
people: 'Projektbeteiligte',
planung: 'Planung',
planchecker: 'PlanChecker',
diff --git a/public/js/notizen/notizen.js b/public/js/notizen/notizen.js
new file mode 100644
index 0000000..da2cac2
--- /dev/null
+++ b/public/js/notizen/notizen.js
@@ -0,0 +1,408 @@
+// -----------------------------
+// Seitenleiste „Notizen“ (Tab `notizen`, /Notizen)
+// -----------------------------
+// Eriks Wunsch: Jedes Konto sieht hier die Notizen ALLER seiner Projekte und
+// legt auch projektunabhängige Notizen an, die sich beim Bearbeiten einem
+// Projekt zuordnen lassen. Gleicher Aufbau wie der Reiter „Notizen“ im
+// Projektbereich (js/plan/plan-notizen.js: Liste + Editor, Werkzeugleiste,
+// automatisches Speichern), dazu ein Projektfilter und im Editor die Auswahl
+// „Projekt“. Eigene Element-ids (mn…), weil der Projekt-Reiter gleichzeitig
+// im DOM liegt.
+//
+// Daten: GET /meine-notizen (Notizen meiner Projekte + meine
+// projektunabhängigen, project_uid = ''), sonst dieselben Routen
+// /projekt-notizen* wie der Projekt-Reiter; PUT nimmt `uid` zum Zuordnen.
+// Projektunabhängige Notizen sieht und ändert nur, wer sie angelegt hat.
+(function(){
+ const SPEICHER_PAUSE_MS = 1200;
+ const OHNE = '__ohne__';
+
+ let liste = [];
+ let meineProjekte = new Set();
+ let geladen = false;
+ let ladeFehler = '';
+ let filter = ''; // '' = alle, OHNE = ohne Projekt, sonst uid
+ let suche = '';
+ let aktivId = null;
+ let basis = '';
+ let ungespeichert = false;
+ let speicherTimer = null;
+ let speichertGerade = false;
+ let beobachter = null;
+ let loeschenFragt = null;
+ let eigenesSchreiben = 0; // Zeitpunkt der letzten eigenen Änderung (Live-Echo auslassen)
+
+ const el = () => document.getElementById('notizen');
+ const aktiv = () => liste.find(n => n.id === aktivId) || null;
+ const darf = n => !n || !n.uid ? true : (typeof hatRecht === 'function' && hatRecht('proj.plan'));
+ const darfProjekte = () => typeof hatRecht === 'function' && hatRecht('proj.plan');
+
+ // Projekte der aktuellen Sitzung je projectUid (Name und Nummer).
+ function projekte(){
+ const w = typeof currentWeek === 'function' ? currentWeek() : null;
+ const m = new Map();
+ ((w && w.projects) || []).forEach(p => { if(p.projectUid) m.set(String(p.projectUid), p); });
+ return m;
+ }
+ function projektName(uid, karte){
+ if(!uid) return 'Ohne Projekt';
+ const p = (karte || projekte()).get(uid);
+ return p ? [p.nr, p.name].filter(Boolean).join(' ') : 'Projekt nicht in der aktuellen Sitzung';
+ }
+ function zeit(iso){
+ if(!iso) return '';
+ const d = new Date(iso);
+ if(isNaN(d)) return '';
+ const heute = new Date();
+ const gestern = new Date(heute); gestern.setDate(heute.getDate() - 1);
+ const uhr = d.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' });
+ if(d.toDateString() === heute.toDateString()) return 'heute ' + uhr;
+ if(d.toDateString() === gestern.toDateString()) return 'gestern ' + uhr;
+ return d.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit', year: d.getFullYear() === heute.getFullYear() ? undefined : 'numeric' });
+ }
+ const klartext = html => typeof statusPlainText === 'function' ? statusPlainText(html) : String(html || '').replace(/<[^>]+>/g, ' ');
+ function sortieren(){
+ liste.sort((a, b) => (b.angeheftet - a.angeheftet) || String(b.geaendertAm).localeCompare(String(a.geaendertAm)));
+ }
+
+ // ---------- Laden ----------
+ function laden(){
+ ladeFehler = '';
+ return fetch(baseUrl() + '/meine-notizen')
+ .then(r => r.json().then(d => ({ ok: r.ok, d })))
+ .then(({ ok, d }) => {
+ if(!ok || !d.ok) throw new Error(d.error || 'Laden fehlgeschlagen');
+ liste = d.notizen || [];
+ meineProjekte = new Set(d.meineProjekte || []);
+ sortieren();
+ geladen = true;
+ })
+ .catch(e => { ladeFehler = e.message || 'Die Notizen konnten nicht geladen werden.'; liste = []; geladen = true; });
+ }
+
+ // ---------- Darstellung ----------
+ window.renderMeineNotizen = function(){
+ const box = el();
+ if(!box) return;
+ box.innerHTML = '
Notizen werden geladen…
';
+ jetztSpeichern();
+ laden().then(aufbauen);
+ };
+
+ function sichtbar(){
+ const s = suche.trim().toLowerCase();
+ return liste.filter(n => (!filter || (filter === OHNE ? !n.uid : n.uid === filter))
+ && (!s || (n.titel + ' ' + klartext(n.html) + ' ' + projektName(n.uid)).toLowerCase().includes(s)));
+ }
+
+ function filterOptionen(){
+ const karte = projekte();
+ const mitNotizen = new Set(liste.filter(n => n.uid).map(n => n.uid));
+ const uids = Array.from(new Set([...meineProjekte, ...mitNotizen]))
+ .sort((a, b) => projektName(a, karte).localeCompare(projektName(b, karte), 'de'));
+ const zahl = f => liste.filter(n => f === OHNE ? !n.uid : n.uid === f).length;
+ return '
Alle Projekte (' + liste.length + ') '
+ + '
Ohne Projekt (' + zahl(OHNE) + ') '
+ + uids.map(u => '
' + esc(projektName(u, karte)) + ' (' + zahl(u) + ') ').join('');
+ }
+
+ function aufbauen(){
+ const box = el();
+ if(!box) return;
+ const treffer = sichtbar();
+ if(!treffer.some(n => n.id === aktivId)) aktivId = treffer.length ? treffer[0].id : null;
+ box.innerHTML = `
+
+
+
+ Notizen aller meiner Projekte und eigene Notizen ohne Projekt
+
Notizen
+
+
Projekt
+ ${filterOptionen()}
+
+
+
+
`;
+ listeZeichnen();
+ editorZeichnen();
+ }
+
+ function listeZeichnen(){
+ const box = document.getElementById('mnEintraege');
+ if(!box) return;
+ if(ladeFehler){ box.innerHTML = '
' + esc(ladeFehler) + '
'; return; }
+ const treffer = sichtbar();
+ if(!liste.length){ box.innerHTML = '
Noch keine Notizen. Mit „+ Neu“ eine eigene anlegen.
'; return; }
+ if(!treffer.length){ box.innerHTML = '
' + (suche ? 'Keine Notiz enthält „' + esc(suche) + '“.' : 'Keine Notizen in dieser Auswahl.') + '
'; return; }
+ const karte = projekte();
+ const zeile = n => {
+ const vorschau = klartext(n.html).replace(/\s+/g, ' ').trim().slice(0, 90);
+ return `
+ ${esc(n.titel || 'Ohne Titel')}${n.quelle === 'mail' ? ' Mail ' : ''}
+ ${esc(vorschau || 'Kein Text')}
+ ${esc(projektName(n.uid, karte))} · ${esc(zeit(n.geaendertAm))} `;
+ };
+ const oben = treffer.filter(n => n.angeheftet), rest = treffer.filter(n => !n.angeheftet);
+ box.innerHTML = (oben.length ? '
' + oben.map(zeile).join('') : '')
+ + (rest.length ? (oben.length ? '
Weitere
' : '') + rest.map(zeile).join('') : '');
+ }
+
+ // projektAuswahl: Auswahl im Editor — „Ohne Projekt“, meine Projekte, dann
+ // die übrigen der Sitzung. Ohne Recht proj.plan nur „Ohne Projekt“ (und das
+ // aktuelle Projekt, damit der Stand lesbar bleibt).
+ function projektAuswahl(n){
+ const karte = projekte();
+ const name = u => projektName(u, karte);
+ const sort = arr => arr.sort((a, b) => name(a).localeCompare(name(b), 'de'));
+ const opt = u => '
' + esc(name(u)) + ' ';
+ const meine = sort(Array.from(meineProjekte).filter(u => karte.has(u)));
+ const weitere = sort(Array.from(karte.keys()).filter(u => !meineProjekte.has(u)));
+ const sperren = !darf(n) || (!darfProjekte() && !n.uid);
+ let html = '
Ohne Projekt ';
+ if(darfProjekte()){
+ if(meine.length) html += '
' + meine.map(opt).join('') + ' ';
+ if(weitere.length) html += '
' + weitere.map(opt).join('') + ' ';
+ }
+ if(n.uid && !karte.has(n.uid)) html += opt(n.uid);
+ return '
Projekt ' + html + ' ';
+ }
+
+ function editorZeichnen(){
+ const box = document.getElementById('mnEditor');
+ if(!box) return;
+ if(beobachter){ beobachter.disconnect(); beobachter = null; }
+ const n = aktiv();
+ if(!n){
+ box.innerHTML = `
+ ${liste.length ? 'Notiz links auswählen' : 'Noch keine Notizen'}
+ Mit „+ Neu“ eine Notiz anlegen. Sie gehört zunächst nur Ihnen und lässt sich oben rechts einem Projekt zuordnen.
+
`;
+ return;
+ }
+ const schreiben = darf(n);
+ basis = n.geaendertAm;
+ ungespeichert = false;
+ const projekt = n.uid ? projekte().get(n.uid) : null;
+ box.innerHTML = `
+
+ ${n.angeheftet ? 'Angeheftet' : 'Anheften'}
+ Löschen ` : ''}
+
+
+ ${projektAuswahl(n)}
+ ${projekt ? `
Im Projekt öffnen ` : ''}
+ ${!n.uid ? '
Nur für Sie sichtbar, bis sie einem Projekt zugeordnet ist ' : ''}
+
+
+ ${schreiben ? richtextToolbarHtml('#mnText') : ''}
+ ${richtextFeldHtml('notizen-text', sanitizeStatusHtml(n.html || ''), 'Notiz schreiben…', 'id="mnText" onblur="mnJetztSpeichern()"', schreiben)}
+
+
+ Angelegt von ${esc(n.erstelltVon)} ${esc(zeit(n.erstelltAm))}${n.geaendertAm !== n.erstelltAm ? ' · zuletzt geändert von ' + esc(n.geaendertVon) + ' ' + esc(zeit(n.geaendertAm)) : ''}
+
`;
+ const text = document.getElementById('mnText');
+ if(text && schreiben){
+ beobachter = new MutationObserver(() => mnGeaendert());
+ beobachter.observe(text, { childList: true, subtree: true, characterData: true, attributes: true });
+ }
+ }
+
+ function status(text, art){
+ const s = document.getElementById('mnStatus');
+ if(!s) return;
+ s.className = 'notizen-status' + (art ? ' ist-' + art : '');
+ s.innerHTML = text;
+ }
+ function hinweis(text){ if(typeof zeigeHinweis === 'function') zeigeHinweis(text); else status(esc(text), 'fehler'); }
+
+ // ---------- Bedienung ----------
+ window.mnFilter = function(wert){ jetztSpeichern(); filter = wert || ''; aufbauen(); };
+ window.mnSuchen = function(wert){ suche = wert || ''; listeZeichnen(); };
+ window.mnWaehlen = function(id){
+ if(id === aktivId) return;
+ jetztSpeichern();
+ aktivId = id;
+ listeZeichnen();
+ editorZeichnen();
+ };
+ window.mnGeaendert = function(){
+ const n = aktiv();
+ if(!n || !darf(n)) return;
+ ungespeichert = true;
+ status('Ungespeichert');
+ clearTimeout(speicherTimer);
+ speicherTimer = setTimeout(jetztSpeichern, SPEICHER_PAUSE_MS);
+ };
+ window.mnJetztSpeichern = function(){ jetztSpeichern(); };
+
+ function senden(n, nutzlast){
+ eigenesSchreiben = Date.now();
+ return fetch(baseUrl() + '/projekt-notizen/' + encodeURIComponent(n.id), {
+ method: 'PUT', headers: { 'Content-Type': 'application/json; charset=utf-8' }, body: JSON.stringify(nutzlast)
+ }).then(r => r.json().then(d => ({ r, d })));
+ }
+
+ function jetztSpeichern(ohneBasis){
+ clearTimeout(speicherTimer);
+ const n = aktiv();
+ if(!n || !ungespeichert || !darf(n)) return Promise.resolve();
+ if(speichertGerade){ speicherTimer = setTimeout(jetztSpeichern, 400); return Promise.resolve(); }
+ const titelEl = document.getElementById('mnTitel');
+ const textEl = document.getElementById('mnText');
+ const titel = titelEl ? titelEl.value : n.titel;
+ const html = textEl ? textEl.innerHTML : n.html;
+ ungespeichert = false;
+ speichertGerade = true;
+ status('Speichert…');
+ return senden(n, { titel, html, basis: ohneBasis ? '' : basis }).then(({ r, d }) => {
+ if(r.status === 409 && d.konflikt){
+ ungespeichert = true;
+ status(esc(d.error) + '
Meine Fassung speichern '
+ + '
Neuen Stand laden ', 'warnung');
+ n._fremd = d.notiz;
+ return;
+ }
+ if(!r.ok || !d.ok) throw new Error(d.error || 'Speichern fehlgeschlagen');
+ Object.assign(n, d.notiz, { titel, html });
+ if(n.id === aktivId) basis = d.notiz.geaendertAm;
+ sortieren();
+ listeZeichnen();
+ if(!ungespeichert) status('Gespeichert ✓', 'ok');
+ }).catch(e => {
+ ungespeichert = true;
+ status('Nicht gespeichert: ' + esc(e.message) + ' — wird erneut versucht.', 'fehler');
+ speicherTimer = setTimeout(jetztSpeichern, 5000);
+ }).finally(() => { speichertGerade = false; });
+ }
+
+ window.mnKonflikt = function(meine){
+ const n = aktiv();
+ if(!n) return;
+ if(meine){ ungespeichert = true; jetztSpeichern(true); return; }
+ if(n._fremd) Object.assign(n, n._fremd);
+ delete n._fremd;
+ ungespeichert = false;
+ listeZeichnen();
+ editorZeichnen();
+ };
+
+ // mnNeu: neue Notiz — im gefilterten Projekt, sonst ohne Projekt.
+ window.mnNeu = function(){
+ jetztSpeichern();
+ const uid = filter && filter !== OHNE && darfProjekte() ? filter : '';
+ eigenesSchreiben = Date.now();
+ fetch(baseUrl() + '/projekt-notizen', {
+ method: 'POST', headers: { 'Content-Type': 'application/json; charset=utf-8' },
+ body: JSON.stringify({ uid, titel: '', html: '' })
+ }).then(r => r.json()).then(d => {
+ if(!d.ok) throw new Error(d.error || 'Anlegen fehlgeschlagen');
+ liste = liste.filter(x => x.id !== d.notiz.id).concat([d.notiz]);
+ sortieren();
+ aktivId = d.notiz.id;
+ suche = '';
+ aufbauen();
+ const t = document.getElementById('mnTitel');
+ if(t) t.focus();
+ }).catch(e => hinweis('Notiz konnte nicht angelegt werden: ' + e.message));
+ };
+
+ // mnZuordnen: Notiz einem Projekt zuordnen (oder wieder lösen). Offene
+ // Änderungen werden vorher gespeichert.
+ window.mnZuordnen = function(uid){
+ const n = aktiv();
+ if(!n) return;
+ jetztSpeichern().then(() => senden(n, { uid: uid || '' })).then(({ r, d }) => {
+ if(!r.ok || !d.ok) throw new Error(d.error || 'Zuordnen fehlgeschlagen');
+ Object.assign(n, d.notiz);
+ if(n.uid) meineProjekte.add(n.uid);
+ if(filter && filter !== (n.uid || OHNE)) filter = n.uid || OHNE;
+ aufbauen();
+ status(n.uid ? 'Dem Projekt zugeordnet ✓' : 'Vom Projekt gelöst ✓', 'ok');
+ }).catch(e => { hinweis(e.message); editorZeichnen(); });
+ };
+
+ window.mnAnheften = function(){
+ const n = aktiv();
+ if(!n) return;
+ jetztSpeichern().then(() => senden(n, { angeheftet: !n.angeheftet })).then(({ d }) => {
+ if(!d.ok) throw new Error(d.error || 'Fehler');
+ n.angeheftet = d.notiz.angeheftet;
+ sortieren();
+ listeZeichnen();
+ editorZeichnen();
+ }).catch(e => hinweis('Anheften fehlgeschlagen: ' + e.message));
+ };
+
+ window.mnLoeschen = function(){
+ const n = aktiv();
+ const knopf = document.getElementById('mnLoeschen');
+ if(!n || !knopf) return;
+ if(!loeschenFragt){
+ knopf.textContent = 'Wirklich löschen?';
+ knopf.classList.add('ist-fragend');
+ loeschenFragt = setTimeout(() => {
+ loeschenFragt = null;
+ const k = document.getElementById('mnLoeschen');
+ if(k){ k.textContent = 'Löschen'; k.classList.remove('ist-fragend'); }
+ }, 4000);
+ return;
+ }
+ clearTimeout(loeschenFragt); loeschenFragt = null;
+ clearTimeout(speicherTimer); ungespeichert = false;
+ eigenesSchreiben = Date.now();
+ fetch(baseUrl() + '/projekt-notizen/' + encodeURIComponent(n.id), { method: 'DELETE' })
+ .then(r => r.json().then(d => ({ r, d }))).then(({ r, d }) => {
+ if(!r.ok || !d.ok) throw new Error(d.error || 'Löschen fehlgeschlagen');
+ liste = liste.filter(x => x.id !== n.id);
+ aktivId = null;
+ aufbauen();
+ }).catch(e => { status(esc(e.message), 'fehler'); const k = document.getElementById('mnLoeschen'); if(k){ k.textContent = 'Löschen'; k.classList.remove('ist-fragend'); } });
+ };
+
+ window.mnProjektOeffnen = function(pid){
+ jetztSpeichern();
+ location.hash = 'notizen';
+ if(typeof openProjectPlan === 'function') openProjectPlan(pid);
+ return false;
+ };
+
+ // ---------- Live: Änderungen aus anderen Browsern ----------
+ window.meineNotizenLive = function(uid){
+ if(typeof currentTab === 'undefined' || currentTab !== 'notizen' || !geladen) return;
+ if(uid && !meineProjekte.has(uid)) return;
+ const vorher = aktiv();
+ const tippt = document.activeElement && document.activeElement.closest && document.activeElement.closest('#mnEditor');
+ // Das Echo der eigenen Speicherung (kommt auch in diesem Tab an) auslassen.
+ if(ungespeichert || tippt || Date.now() - eigenesSchreiben < 3000) return;
+ laden().then(() => {
+ if(vorher && liste.some(x => x.id === vorher.id)) aktivId = vorher.id;
+ aufbauen();
+ });
+ };
+
+ // Klick irgendwo anders: die Rückfrage „Wirklich löschen?“ zurücknehmen.
+ document.addEventListener('pointerdown', e => {
+ if(!loeschenFragt || (e.target.closest && e.target.closest('#mnLoeschen'))) return;
+ clearTimeout(loeschenFragt); loeschenFragt = null;
+ const k = document.getElementById('mnLoeschen');
+ if(k){ k.textContent = 'Löschen'; k.classList.remove('ist-fragend'); }
+ }, true);
+ window.addEventListener('pagehide', () => { if(ungespeichert) jetztSpeichern(); });
+})();
diff --git a/public/js/plan/plan-gantt.js b/public/js/plan/plan-gantt.js
index 7255ef5..71d9ffd 100644
--- a/public/js/plan/plan-gantt.js
+++ b/public/js/plan/plan-gantt.js
@@ -540,7 +540,7 @@
const ampel = loadAmpelColor(l.quote);
const breite = Math.min(100, l.quote * 100);
const absCount = app.countPersonAbsences(l.person.id);
- const absBadge = absCount > 0 ? `
${absCount} Abwesenheit(en)
` : '';
+ const absBadge = absCount > 0 ? `
${absCount} Abwesenheit(en)
` : '';
let todoListHtml;
if(l.todos.length === 0){
@@ -566,12 +566,12 @@
: `
keine Aufgaben mit Aufwand
`;
html += `
-
${esc(l.person.name)} (${esc(l.roles.join(' / '))})
+
${esc(l.person.name)} (${esc(l.roles.join(' / '))})
${stundenFormat(l.stunden)}h diese Woche
${offenText}
${otherBadge}
-
${todoListHtml}
+
${todoListHtml}
${absBadge}
`;
});
diff --git a/public/js/plan/plan-notizen.js b/public/js/plan/plan-notizen.js
index 40f83d8..c948a34 100644
--- a/public/js/plan/plan-notizen.js
+++ b/public/js/plan/plan-notizen.js
@@ -406,5 +406,12 @@
ausDaten(e.clipboardData);
});
// Beim Verlassen der Seite noch speichern, was offen ist.
+ // Klick irgendwo anders: die Rückfrage „Wirklich löschen?“ zurücknehmen.
+ document.addEventListener('pointerdown', e => {
+ if(!loeschenFragt || (e.target.closest && e.target.closest('#notizLoeschen'))) return;
+ clearTimeout(loeschenFragt); loeschenFragt = null;
+ const k = document.getElementById('notizLoeschen');
+ if(k){ k.textContent = 'Löschen'; k.classList.remove('ist-fragend'); }
+ }, true);
window.addEventListener('pagehide', () => { if(ungespeichert) jetztSpeichern(); });
})();
diff --git a/public/js/plan/plan-protokoll-todos.js b/public/js/plan/plan-protokoll-todos.js
index 4f0a46a..d6a9b21 100644
--- a/public/js/plan/plan-protokoll-todos.js
+++ b/public/js/plan/plan-protokoll-todos.js
@@ -100,7 +100,7 @@
// ein Fallback ist ein akzeptiertes Ergebnis, kein Fehlschlag.
function zeigeFallbackHinweis(msg){
const el = document.getElementById('protokollTodosFallback');
- if(el){ el.textContent = '⚠️ ' + msg; el.hidden = false; }
+ if(el){ el.textContent = msg; el.hidden = false; }
}
function verbergeFallbackHinweis(){
const el = document.getElementById('protokollTodosFallback');
diff --git a/public/js/plan/plan-protokoll.js b/public/js/plan/plan-protokoll.js
index cbe06d9..c6426dc 100644
--- a/public/js/plan/plan-protokoll.js
+++ b/public/js/plan/plan-protokoll.js
@@ -548,7 +548,7 @@
// ab, verschwindet also nie von selbst, sondern nur wenn man das
// Protokoll erneut öffnet — bewusst so, die Herkunft bleibt sichtbar.
const importBanner = p.quelleDateiname
- ? `
🔎 Punkte automatisch aus „${esc(p.quelleDateiname)}“ erkannt — bitte vor dem Speichern prüfen und bei Bedarf korrigieren.
`
+ ? `
Punkte automatisch aus „${esc(p.quelleDateiname)}“ erkannt — bitte vor dem Speichern prüfen und bei Bedarf korrigieren.
`
: '';
// Rein clientseitiges Merkmal (siehe importiereProtokoll() oben) — nur
// direkt nach GENAU dem Import gesetzt, der die KI angefordert, aber
@@ -559,7 +559,7 @@
// das war Eriks Rückmeldung, nachdem er von einem KI-Fehlschlag nichts
// in der Oberfläche sah.
const kiFallbackBanner = p._kiFallbackHinweis
- ? `
⚠️ Die KI-Erkennung ist fehlgeschlagen (${esc(p._kiFallbackHinweis)}) — die Punkte wurden stattdessen per Textmuster erkannt.
`
+ ? `
Die KI-Erkennung ist fehlgeschlagen (${esc(p._kiFallbackHinweis)}) — die Punkte wurden stattdessen per Textmuster erkannt.
`
: '';
const kopf = `
${kiFallbackBanner}
diff --git a/public/js/plan/plan-schedule.js b/public/js/plan/plan-schedule.js
index 3d73fac..8403f50 100644
--- a/public/js/plan/plan-schedule.js
+++ b/public/js/plan/plan-schedule.js
@@ -128,7 +128,7 @@
if(moved.size > 0){
app.savePlan();
renderPlanGantt();
- app.showToast(moved.size + ' Element(e) automatisch verschoben.' + (hasCycle ? ' Achtung: zyklische Abhängigkeit gefunden!' : ''));
+ app.showToast(moved.size + ' Element(e) automatisch verschoben.' + (hasCycle ? ' Zyklische Abhängigkeit gefunden — bitte Vorgänger prüfen.' : ''));
} else if(hasCycle){
app.showToast('Achtung: zyklische Abhängigkeit gefunden – bitte Vorgänger prüfen.');
} else {
diff --git a/public/js/store.js b/public/js/store.js
index 37dad83..ed4253d 100644
--- a/public/js/store.js
+++ b/public/js/store.js
@@ -541,7 +541,11 @@ function liveEreignis(d){
if(d.typ === 'woche') return liveWocheNachladen(d.label, d.geloescht);
if(d.typ === 'neu') return liveAllesNeu();
if(d.typ === 'personen') return personenNachladen();
- if(d.typ === 'notizen' && typeof notizenLiveAenderung === 'function') return notizenLiveAenderung(d.uid);
+ if(d.typ === 'notizen'){
+ if(typeof meineNotizenLive === 'function') meineNotizenLive(d.uid);
+ if(typeof notizenLiveAenderung === 'function') notizenLiveAenderung(d.uid);
+ return;
+ }
}
// personenNachladen: Personenliste samt Abwesenheiten neu holen (nach einer
diff --git a/public/js/tabs-auth.js b/public/js/tabs-auth.js
index 5552ed9..0ce315f 100644
--- a/public/js/tabs-auth.js
+++ b/public/js/tabs-auth.js
@@ -23,7 +23,7 @@
// Bereich wie jeder andere: Menüband und Seitenleiste bleiben stehen, der
// Wechsel dorthin läuft über denselben showTab()-Weg wie der Wechsel vom
// Dashboard ins Projektboard.
-const TAB_PANELS = ['board','wochenbericht','load','abwesenheit','people','planung','planchecker','dashboard','wand','settings','admin','plan'];
+const TAB_PANELS = ['board','wochenbericht','load','abwesenheit','notizen','people','planung','planchecker','dashboard','wand','settings','admin','plan'];
function showTab(t){
// Weichen nach Rollen & Rechte (UI-Gate, die Routen dahinter prüft der
@@ -61,6 +61,7 @@ function showTab(t){
if(t==='wochenbericht') renderWochenbericht();
if(t==='load') renderLoad();
if(t==='abwesenheit'){ abwBeimOeffnen(); renderAbwesenheiten(); }
+ if(t==='notizen' && typeof renderMeineNotizen === 'function') renderMeineNotizen();
if(t==='people') renderPeople();
if(t==='planung') renderPlanung();
if(t==='planchecker') renderPlanChecker();
@@ -108,6 +109,9 @@ function syncPlanNavItem(){
const name = app && app.projName ? app.projName : '';
item.style.display = name ? '' : 'none';
const label = document.getElementById('planNavItemLabel');
- if(label) label.textContent = name || 'Projektbereich';
+ // Projektnummer in Mono-Ziffern davor (Kennzeichen „Bauplan“).
+ if(label) label.innerHTML = name
+ ? (app.projNr ? '
' + esc(app.projNr) + ' ' : '') + esc(name)
+ : 'Projektbereich';
item.title = name ? ('Projektbereich: ' + name) : 'Projektbereich';
}
diff --git a/public/plan-styles.css b/public/plan-styles.css
index 0d92602..fa8fdf4 100644
--- a/public/plan-styles.css
+++ b/public/plan-styles.css
@@ -12,20 +12,20 @@
.plan-page { display: flex; flex-direction: column; }
.plan-header {
- display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
+ display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
padding: 12px 24px; background: var(--surface); border-bottom: 1px solid var(--line-soft);
}
-.plan-header h1 { font-size: 16px; margin: 0; font-weight: 600; white-space: nowrap; }
+.plan-header h1 { font-size: 19px; margin: 0; font-weight: 500; white-space: nowrap; }
.plan-header .plan-id {
- font-family: ui-monospace, 'SF Mono', monospace; font-size: 12.5px; color: var(--text-muted); white-space: nowrap;
+ font-family: ui-monospace, 'SF Mono', monospace; font-size: 13px; color: var(--text-muted); white-space: nowrap;
}
-.plan-header .subtitle { color: var(--text-muted); font-size: 12.5px; white-space: nowrap; }
+.plan-header .subtitle { color: var(--text-muted); font-size: 13px; white-space: nowrap; }
.plan-header-spacer { flex: 1; min-width: 12px; }
.plan-header-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.plan-body { flex: 1; display: flex; gap: 0; }
.plan-main { flex: 1; display: flex; flex-direction: column; background: var(--bg); min-width: 0; }
.plan-main-header {
- padding: 0 0 14px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
+ padding: 0 0 16px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
}
.plan-main-content { flex: 1; padding: 20px 20px 20px; min-width: 0; }
.todo-row:last-child { margin-bottom: 0; }
@@ -45,7 +45,7 @@
.plan-toast {
position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%) translateY(20px);
background: var(--surface); color: var(--text); border: 1px solid var(--line);
- padding: 10px 18px; border-radius: var(--r-pill);
+ padding: 12px 20px; border-radius: 8px;
font-size: 13px; opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s;
z-index: 1000; box-shadow: var(--sh-3);
}
@@ -53,11 +53,11 @@
.plan-resource-grid {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(140px, max-content)) !important;
- gap: 10px !important;
+ gap: 8px !important;
justify-content: start !important;
}
.plan-resource-card {
- padding: 8px 10px !important;
+ padding: 8px 12px !important;
min-height: 0 !important;
width: 140px !important;
max-width: 140px !important;
@@ -83,7 +83,7 @@
display: flex;
align-items: center;
gap: 8px;
- padding: 5px 6px;
+ padding: 4px 6px;
border-radius: var(--r-sm);
cursor: pointer;
font-size: 12px;
@@ -96,8 +96,7 @@
color: var(--text-muted);
margin-top: 6px;
margin-bottom: 2px;
- text-transform: uppercase;
- letter-spacing: .03em;
+ letter-spacing: 0;
}
.todo-depends-group:first-child { margin-top: 0; }
/* Im eingeklappten Bereich trägt bereits das
den Rahmen */
@@ -113,7 +112,7 @@
.todo-depends-item.is-blocked:hover { background: transparent; }
.todo-depends-note {
margin-left: auto;
- font-size: 10.5px;
+ font-size: 11px;
color: var(--amber);
white-space: nowrap;
}
@@ -128,7 +127,7 @@
align-items: baseline;
justify-content: space-between;
gap: 12px;
- margin-bottom: 18px;
+ margin-bottom: 16px;
}
.modal-head h2 { margin: 0; }
.modal-kbd { font-size: 11px; color: var(--text-subtle); white-space: nowrap; }
@@ -149,8 +148,8 @@
font-weight: 500;
color: var(--text-muted);
background: var(--surface-sunk);
- border-radius: var(--r-pill);
- padding: 3px 9px;
+ border-radius: 6px;
+ padding: 4px 8px;
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
@@ -160,13 +159,13 @@
.person-chip {
display: inline-flex;
align-items: center;
- gap: 7px;
+ gap: 8px;
background: var(--surface);
color: var(--text-muted);
border: 1px solid var(--line);
- border-radius: var(--r-pill);
+ border-radius: 6px;
padding: 4px 12px 4px 4px;
- font-size: 12.5px;
+ font-size: 13px;
font-weight: 500;
transition: border-color .15s var(--ease), background .15s var(--ease), color .15s var(--ease);
}
@@ -180,8 +179,8 @@
display: flex;
align-items: center;
justify-content: center;
- font-size: 10px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
}
.person-chip[aria-pressed="true"] {
background: var(--accent-soft);
@@ -208,7 +207,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.segmented {
display: inline-flex;
background: var(--surface-sunk);
- border-radius: var(--r-pill);
+ border-radius: 8px;
padding: 2px;
gap: 2px;
width: fit-content;
@@ -216,9 +215,9 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.segmented button {
background: transparent;
color: var(--text-muted);
- padding: 5px 14px;
- font-size: 12.5px;
- border-radius: var(--r-pill);
+ padding: 4px 16px;
+ font-size: 13px;
+ border-radius: 6px;
display: flex;
align-items: center;
gap: 6px;
@@ -227,7 +226,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.segmented button[aria-pressed="true"] {
background: var(--surface);
color: var(--text);
- font-weight: 600;
+ font-weight: 500;
box-shadow: var(--sh-1);
}
.segmented-dot {
@@ -239,7 +238,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.segmented button[data-status="arbeit"][aria-pressed="true"] .segmented-dot { background: var(--amber); }
.segmented button[data-status="fertig"][aria-pressed="true"] .segmented-dot { background: var(--green); }
-.progress-row { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
+.progress-row { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.progress-row[hidden] { display: none; }
.progress-row input[type=range] { flex: 1; accent-color: var(--accent); }
.progress-row output {
@@ -260,38 +259,38 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.fold > summary {
cursor: pointer;
list-style: none;
- padding: 9px 11px;
+ padding: 8px 12px;
display: flex;
align-items: center;
- gap: 9px;
- font-size: 12.5px;
+ gap: 8px;
+ font-size: 13px;
user-select: none;
}
.fold > summary::-webkit-details-marker { display: none; }
.fold > summary:hover { background: var(--surface-alt); }
.fold-caret {
color: var(--text-subtle);
- font-size: 10px;
+ font-size: 11px;
transition: transform .18s var(--ease);
}
.fold[open] > summary .fold-caret { transform: rotate(90deg); }
.fold-count {
margin-left: auto;
font-size: 11px;
- font-weight: 600;
+ font-weight: 500;
background: var(--accent-soft);
color: var(--accent);
- border-radius: var(--r-pill);
- padding: 1px 9px;
+ border-radius: 6px;
+ padding: 1px 8px;
font-variant-numeric: tabular-nums;
}
.fold-count.zero { background: var(--surface-sunk); color: var(--text-subtle); }
.fold-body {
- padding: 9px 11px 11px;
+ padding: 8px 12px 12px;
border-top: 1px solid var(--line-soft);
display: flex;
flex-direction: column;
- gap: 7px;
+ gap: 8px;
}
.fold-search { position: relative; }
.fold-search input { width: 100%; padding-left: 28px; }
@@ -336,14 +335,14 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
box-shadow: var(--sh-1);
}
.plan-kpi-tile .kpi-label {
- font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em;
- color: var(--text-subtle); font-weight: 600; margin-bottom: 4px;
+ font-size: 11px; letter-spacing: 0;
+ color: var(--text-subtle); font-weight: 500; margin-bottom: 4px;
}
.plan-kpi-tile .kpi-value {
- font-size: 22px; font-weight: 700; letter-spacing: -0.02em; color: var(--text);
+ font-size: 24px; font-weight: 600; letter-spacing: 0; color: var(--text);
font-variant-numeric: tabular-nums;
}
-.plan-kpi-tile .kpi-sub { font-size: 11.5px; color: var(--text-muted); margin-top: 2px; }
+.plan-kpi-tile .kpi-sub { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.plan-kpi-tile.warn .kpi-value { color: var(--amber); }
/* Kompakt-Karten im Dashboard (Ressourcen-Auslastung, Dateien & Freigaben,
@@ -352,23 +351,23 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.plan-card-row {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
- gap: 14px;
- margin-top: 18px;
+ gap: 12px;
+ margin-top: 16px;
}
.plan-mini-card {
background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--r-lg);
- padding: 14px 16px; cursor: pointer; transition: box-shadow .15s, transform .15s;
+ padding: 16px 16px; cursor: pointer; transition: box-shadow .15s, transform .15s;
}
.plan-mini-card:hover { box-shadow: var(--sh-2); transform: translateY(-1px); }
.plan-mini-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
-.plan-mini-card-title { font-size: 13px; font-weight: 600; }
+.plan-mini-card-title { font-size: 13px; font-weight: 500; }
.plan-mini-card-expand { font-size: 11px; color: var(--accent); font-weight: 500; flex-shrink: 0; }
.plan-mini-card-preview {
- font-size: 12.5px; color: var(--text-muted); line-height: 1.5;
+ font-size: 13px; color: var(--text-muted); line-height: 1.5;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.plan-mini-chip-row { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
-.plan-mini-chip { font-size: 10.5px; padding: 2px 8px; border-radius: var(--r-pill); background: var(--surface-sunk); color: var(--text-muted); }
+.plan-mini-chip { font-size: 11px; padding: 2px 8px; border-radius: 6px; background: var(--surface-sunk); color: var(--text-muted); }
.plan-mini-chip.warn { background: rgba(178,80,0,.12); color: var(--amber); }
.plan-heat-row { display: flex; gap: 4px; }
.plan-heat-cell { flex: 1; height: 18px; border-radius: 4px; background: var(--accent); }
@@ -415,57 +414,57 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
border: 1px solid var(--line-soft);
border-left: 3px solid var(--amber);
border-radius: var(--r-md);
- padding: 10px 14px;
+ padding: 12px 16px;
margin-bottom: 12px;
}
.plan-warning-head {
- display: flex; align-items: center; gap: 7px;
- font-size: 12.5px; font-weight: 600; color: var(--amber);
+ display: flex; align-items: center; gap: 8px;
+ font-size: 13px; font-weight: 500; color: var(--amber);
}
.plan-warning-list {
- margin: 6px 0 0; padding-left: 26px;
- font-size: 12.5px; color: var(--text-muted); line-height: 1.55;
+ margin: 6px 0 0; padding-left: 28px;
+ font-size: 13px; color: var(--text-muted); line-height: 1.55;
}
/* Projektübergreifende Auslastung in der Ressourcen-Karte */
.plan-resource-other {
- font-size: 10px; margin-top: 4px; font-weight: 600; color: var(--amber);
+ font-size: 11px; margin-top: 4px; font-weight: 500; color: var(--amber);
cursor: help;
}
.plan-resource-other.muted { color: var(--text-subtle); font-weight: 400; cursor: default; }
/* --- Verlaufs-Modal (plan-history.js) --- */
.history-list {
- display: flex; flex-direction: column; gap: 10px;
+ display: flex; flex-direction: column; gap: 8px;
max-height: 58vh; overflow-y: auto;
}
.history-entry {
border: 1px solid var(--line-soft); border-radius: var(--r-md);
- background: var(--surface-alt); padding: 10px 12px;
+ background: var(--surface-alt); padding: 12px 12px;
}
.history-entry.current { border-color: var(--accent); background: var(--surface); }
.history-entry-head {
display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px;
}
-.history-week { font-size: 12.5px; font-weight: 600; }
-.history-date { font-size: 11.5px; color: var(--text-subtle); }
+.history-week { font-size: 13px; font-weight: 500; }
+.history-date { font-size: 12px; color: var(--text-subtle); }
.history-badge {
- font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: var(--r-pill);
+ font-size: 11px; font-weight: 500; padding: 2px 8px; border-radius: 6px;
background: var(--accent-soft); color: var(--accent);
}
.history-badge.muted { background: var(--surface-sunk); color: var(--text-subtle); }
-.history-entry-text { font-size: 12.5px; line-height: 1.5; color: var(--text); }
+.history-entry-text { font-size: 13px; line-height: 1.5; color: var(--text); }
.history-entry-text p { margin: 0 0 4px; }
.history-entry-text p:last-child { margin-bottom: 0; }
/* --- Vorlagen-Modal (plan-templates.js) --- */
.template-head-grid {
- display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
+ display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
-.template-admin-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
+.template-admin-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.template-admin-row {
display: flex; align-items: center; gap: 8px;
- font-size: 12.5px; padding: 4px 6px;
+ font-size: 13px; padding: 4px 6px;
background: var(--surface-alt); border-radius: var(--r-sm);
}
.template-admin-title { flex: 1; min-width: 0; }
@@ -474,27 +473,27 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.template-add-row input[type=number] { width: 70px; }
/* --- Honorar-Terminplan (plan-honorar.js) --- */
-.honorar-check { display: flex; align-items: center; gap: 7px; font-size: 12.5px; cursor: help; }
+.honorar-check { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: help; }
.honorar-plan-wrap { overflow-x: auto; margin-top: 4px; }
-.honorar-table { font-size: 12.5px; }
+.honorar-table { font-size: 13px; }
.honorar-table th.num, .honorar-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.honorar-table td.nowrap { white-space: nowrap; }
-.honorar-table input[type=number] { width: 58px; padding: 3px 6px; font-size: 12px; text-align: center; }
+.honorar-table input[type=number] { width: 58px; padding: 4px 6px; font-size: 12px; text-align: center; }
.honorar-table tfoot th, .honorar-table tfoot td {
- border-top: 2px solid var(--line); font-weight: 600; background: var(--surface-alt);
+ border-top: 2px solid var(--line); font-weight: 500; background: var(--surface-alt);
}
.honorar-anteil-grid {
display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
- gap: 8px; margin-bottom: 10px;
+ gap: 8px; margin-bottom: 8px;
}
.honorar-anteil-field { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.honorar-anteil-field span { width: 46px; flex-shrink: 0; color: var(--text-muted); }
.honorar-anteil-field input { width: 100%; min-width: 0; padding: 4px 6px; font-size: 12px; text-align: right; }
-.honorar-admin-foot { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
-.honorar-satz-field { display: flex; align-items: center; gap: 6px; font-size: 12.5px; }
-.honorar-satz-field input { width: 78px; padding: 4px 7px; font-size: 12.5px; text-align: right; }
-.honorar-sum { font-size: 12.5px; font-weight: 600; }
+.honorar-admin-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
+.honorar-satz-field { display: flex; align-items: center; gap: 6px; font-size: 13px; }
+.honorar-satz-field input { width: 78px; padding: 4px 8px; font-size: 13px; text-align: right; }
+.honorar-sum { font-size: 13px; font-weight: 500; }
.honorar-sum.ok { color: var(--green); }
.honorar-sum.warn { color: var(--amber); }
@@ -507,25 +506,25 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
/* Upload-Maske des Bereichs "Dateien": oben ausgerichtet, damit
Dateiauswahl und Prüferliste in der breiten Karte auf gleicher Höhe
beginnen (im früheren Modal war sie unten ausgerichtet). */
-.plan-files-upload { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-start; margin-bottom: 4px; }
+.plan-files-upload { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; margin-bottom: 4px; }
.plan-files-upload .form-row { margin-bottom: 0; }
.plan-files-upload #fileUploadReviewers { width: 240px; }
-.files-list { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; max-height: 50vh; overflow-y: auto; }
+.files-list { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; max-height: 50vh; overflow-y: auto; }
.file-item {
border: 1px solid var(--line-soft); border-radius: var(--r-md);
- background: var(--surface-alt); padding: 10px 12px;
+ background: var(--surface-alt); padding: 12px 12px;
}
.file-item-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.file-item-name { font-weight: 500; font-size: 13px; word-break: break-all; }
.file-item-meta { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
.file-status-badge {
- font-size: 11px; padding: 2px 8px; border-radius: var(--r-pill); color: #fff; flex-shrink: 0;
+ font-size: 11px; padding: 2px 8px; border-radius: 6px; color: #fff; flex-shrink: 0;
}
.file-status-badge.pending, .file-reviewer-chip.pending { background: #d18b00; }
.file-status-badge.approved, .file-reviewer-chip.approved { background: var(--green); }
.file-status-badge.rejected, .file-reviewer-chip.rejected { background: var(--red); }
-.file-reviewer-list { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
-.file-reviewer-chip { font-size: 11px; padding: 2px 8px; border-radius: var(--r-pill); color: #fff; }
+.file-reviewer-list { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
+.file-reviewer-chip { font-size: 11px; padding: 2px 8px; border-radius: 6px; color: #fff; }
.file-item-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.file-comments { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); }
.file-comment-list { display: flex; flex-direction: column; gap: 6px; max-height: 160px; overflow-y: auto; }
@@ -554,7 +553,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
border: none;
border-bottom: 2px solid transparent;
border-radius: 0;
- padding: 10px 14px;
+ padding: 12px 16px;
font-size: 13px;
font-weight: 500;
white-space: nowrap;
@@ -563,7 +562,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.plan-nav-item.is-active {
color: var(--accent);
border-bottom-color: var(--accent);
- font-weight: 600;
+ font-weight: 500;
}
.plan-section { display: none; }
@@ -573,20 +572,20 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.plan-panel-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
- gap: 14px;
+ gap: 12px;
margin-top: 16px;
}
.plan-panel {
background: var(--surface);
border: 1px solid var(--line-soft);
border-radius: var(--r-lg);
- padding: 14px 16px;
+ padding: 16px 16px;
}
.plan-panel-wide { grid-column: 1 / -1; }
.plan-panel-title {
font-size: 13px;
- font-weight: 600;
- margin: 0 0 10px;
+ font-weight: 500;
+ margin: 0 0 8px;
display: flex;
align-items: baseline;
gap: 8px;
@@ -611,8 +610,8 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.plan-task-row {
display: flex;
align-items: center;
- gap: 10px;
- padding: 8px 10px;
+ gap: 8px;
+ padding: 8px 12px;
background: var(--surface-alt);
border: 1px solid var(--line-soft);
border-radius: var(--r-md);
@@ -626,36 +625,35 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.plan-task-dot.fertig { background: var(--green); }
.plan-task-title { flex: 1; font-size: 13px; font-weight: 500; min-width: 0; }
.plan-task-meta {
- font-size: 11.5px;
+ font-size: 12px;
color: var(--text-muted);
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
-.plan-task-meta.overdue { color: var(--red); font-weight: 600; }
-.plan-task-no-schedule { color: var(--text-subtle); font-style: italic; }
+.plan-task-meta.overdue { color: var(--red); font-weight: 500; }
+.plan-task-no-schedule { color: var(--text-subtle); font-style: normal; }
.plan-task-assignees { display: flex; flex-shrink: 0; }
.plan-task-assignees .board-avatar { margin-left: -7px; border: 2px solid var(--surface-alt); }
.plan-task-assignees .board-avatar:first-child { margin-left: 0; }
-.plan-task-empty { font-size: 12.5px; color: var(--text-subtle); padding: 10px 0; }
+.plan-task-empty { font-size: 13px; color: var(--text-subtle); padding: 12px 0; }
/* --- Dashboard: Liste der nächsten Termine (renderPlanDashboard()) --- */
-.plan-upcoming-list { display: flex; flex-direction: column; gap: 7px; }
-.plan-upcoming-item { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; }
+.plan-upcoming-list { display: flex; flex-direction: column; gap: 8px; }
+.plan-upcoming-item { display: flex; align-items: baseline; gap: 8px; font-size: 13px; }
.plan-upcoming-date {
color: var(--text-muted);
white-space: nowrap;
font-variant-numeric: tabular-nums;
min-width: 82px;
}
-.plan-upcoming-item.overdue .plan-upcoming-date { color: var(--red); font-weight: 600; }
+.plan-upcoming-item.overdue .plan-upcoming-date { color: var(--red); font-weight: 500; }
.plan-upcoming-kind {
- font-size: 10px;
- text-transform: uppercase;
- letter-spacing: .04em;
+ font-size: 11px;
+ letter-spacing: 0;
color: var(--text-subtle);
}
-.plan-dash-team { display: flex; flex-direction: column; gap: 7px; }
-.plan-dash-team-row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
+.plan-dash-team { display: flex; flex-direction: column; gap: 8px; }
+.plan-dash-team-row { display: flex; align-items: center; gap: 8px; font-size: 13px; }
/* === Bereich "Protokolle" (js/plan/plan-protokoll.js) ===
Listenansicht (.protokoll-row je Protokoll) und Detailansicht
@@ -675,35 +673,35 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
Damit entfällt das frühere Gegeneinander von Zeilen-Gelb und
Feldrahmen. */
-.protokoll-list-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
+.protokoll-list-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.protokoll-row {
display: grid;
grid-template-columns: 64px 1fr 140px 170px 100px;
align-items: center;
- gap: 14px;
- padding: 11px 4px;
+ gap: 12px;
+ padding: 12px 4px;
border-bottom: 1px solid var(--line-soft);
cursor: pointer;
transition: background .12s var(--ease);
}
.protokoll-row:last-child { border-bottom: none; }
.protokoll-row:hover { background: var(--surface-alt); }
-.protokoll-nr { font-variant-numeric: tabular-nums; font-weight: 650; color: var(--text-muted); font-size: 13px; }
+.protokoll-nr { font-variant-numeric: tabular-nums; font-weight: 500; color: var(--text-muted); font-size: 13px; }
.protokoll-betreff { font-weight: 560; font-size: 13px; }
-.protokoll-datum { display: block; font-weight: 400; color: var(--text-subtle); font-size: 11.5px; margin-top: 2px; }
-.protokoll-verfasser { color: var(--text-muted); font-size: 12.5px; }
-.protokoll-punkte-status { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-muted); }
+.protokoll-datum { display: block; font-weight: 400; color: var(--text-subtle); font-size: 12px; margin-top: 2px; }
+.protokoll-verfasser { color: var(--text-muted); font-size: 13px; }
+.protokoll-punkte-status { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
.protokoll-status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); flex-shrink: 0; }
.protokoll-punkte-status.ist-leer .protokoll-status-dot { background: var(--green); }
-.protokoll-teilnehmer-count { color: var(--text-subtle); font-size: 12.5px; text-align: right; }
+.protokoll-teilnehmer-count { color: var(--text-subtle); font-size: 13px; text-align: right; }
.protokoll-back-link { display: flex; align-items: center; gap: 6px; color: var(--text-muted); font-size: 13px;
- margin-bottom: 14px; cursor: pointer; width: fit-content; }
+ margin-bottom: 12px; cursor: pointer; width: fit-content; }
.protokoll-back-link:hover { color: var(--text); }
.protokoll-import-banner { background: var(--protokoll-neu-bg); border: 1px solid var(--protokoll-neu-border);
- border-radius: var(--r-md); padding: 10px 14px; font-size: 12.5px; color: var(--text); margin-bottom: 14px; }
+ border-radius: var(--r-md); padding: 12px 16px; font-size: 13px; color: var(--text); margin-bottom: 12px; }
/* KI-Erkennung angefordert, aber fehlgeschlagen (kein Schlüssel, Netzwerk-
fehler, unerwartete Antwort …) — eigene, wärmere Farbe als der neutrale
@@ -714,7 +712,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
Server aus ist er wieder weg, das einmalige Ereignis ist dann bereits
zur Kenntnis genommen. */
.protokoll-ki-fallback-banner { background: color-mix(in srgb, var(--amber) 10%, transparent); border: 1px solid var(--amber);
- border-radius: var(--r-md); padding: 10px 14px; font-size: 12.5px; color: var(--text); margin-bottom: 14px; }
+ border-radius: var(--r-md); padding: 12px 16px; font-size: 13px; color: var(--text); margin-bottom: 12px; }
/* Ladehinweis im Import-Dialog (#protokollImportLoading, Test.html): ohne
ihn wirkte der Dialog während eines länger laufenden KI-Aufrufs (bis zu
@@ -728,9 +726,9 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
überschrieben und den Kasten dauerhaft sichtbar gemacht — genau das ist
beim ersten Versuch ohne diese Zeile passiert. */
.protokoll-import-loading[hidden] { display: none; }
-.protokoll-import-loading { display: flex; align-items: center; gap: 10px; margin-top: 12px;
- padding: 10px 12px; background: var(--surface-alt); border: 1px solid var(--line-soft);
- border-radius: var(--r-md); font-size: 12.5px; color: var(--text-muted); }
+.protokoll-import-loading { display: flex; align-items: center; gap: 8px; margin-top: 12px;
+ padding: 12px 12px; background: var(--surface-alt); border: 1px solid var(--line-soft);
+ border-radius: var(--r-md); font-size: 13px; color: var(--text-muted); }
.protokoll-import-spinner { width: 15px; height: 15px; flex-shrink: 0; border-radius: 50%;
border: 2px solid var(--line); border-top-color: var(--accent);
animation: protokoll-import-spin .8s linear infinite; }
@@ -740,8 +738,8 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
oben im Dialog zeigen den Fortschritt durch Hochladen → Punkte →
Aufgaben — erledigte/aktuelle Schritte gefüllt, kommende leer. Entwurf
"A — Schritt-Dialog" (Taste-Skill-Vergleich, Eriks Wahl). */
-.protokoll-todos-steps { display: flex; gap: 5px; margin: 12px 0 16px; }
-.protokoll-todos-steps .seg { flex: 1; height: 4px; border-radius: 2px; background: var(--line-soft); }
+.protokoll-todos-steps { display: flex; gap: 4px; margin: 12px 0 16px; }
+.protokoll-todos-steps .seg { flex: 1; height: 4px; border-radius: 4px; background: var(--line-soft); }
.protokoll-todos-steps .seg.done { background: var(--accent); }
/* Schritt 3 ("Aufgaben bestätigen"), Entwurfsrichtung "B — Kompakte Zeilen"
@@ -753,29 +751,29 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
Zuständigen-Auswahl) erscheinen erst nach Antippen der Zeile
(.protokoll-todo-vorschlag.open). */
.pt-sel-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
-.pt-sel-count { font-size: 12.5px; color: var(--text-muted); }
-.pt-sel-count b { color: var(--accent); font-weight: 700; }
-.pt-sel-actions button { appearance: none; border: none; background: none; font: inherit; font-size: 11.5px;
- font-weight: 650; color: var(--accent); cursor: pointer; padding: 2px 3px; }
+.pt-sel-count { font-size: 13px; color: var(--text-muted); }
+.pt-sel-count b { color: var(--accent); font-weight: 600; }
+.pt-sel-actions button { appearance: none; border: none; background: none; font: inherit; font-size: 12px;
+ font-weight: 500; color: var(--accent); cursor: pointer; padding: 2px 4px; }
.pt-sel-actions button:hover { text-decoration: underline; }
.protokoll-todo-vorschlag { border-bottom: 1px solid var(--line-soft); }
.protokoll-todo-vorschlag:last-child { border-bottom: none; }
-.pt-row-main { display: flex; align-items: center; gap: 9px; padding: 8px 6px; cursor: pointer; }
+.pt-row-main { display: flex; align-items: center; gap: 8px; padding: 8px 6px; cursor: pointer; }
.protokoll-todo-vorschlag.off .pt-row-main { opacity: .45; }
.pt-row-main .pt-vorschlag-check { flex-shrink: 0; accent-color: var(--accent); cursor: pointer; }
.pt-row-main .pt-vorschlag-titel { flex: 1; min-width: 0; border: none; background: none; font: inherit;
- font-weight: 650; font-size: 12.8px; color: var(--text); padding: 2px 0;
+ font-weight: 500; font-size: 12.8px; color: var(--text); padding: 2px 0;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-row-badges { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
-.pt-badge-date { font-size: 10.5px; font-weight: 650; padding: 2px 8px; border-radius: 999px;
+.pt-badge-date { font-size: 11px; font-weight: 500; padding: 2px 8px; border-radius: 6px;
background: var(--accent-soft); color: var(--accent); white-space: nowrap; }
/* Pille statt perfektem Kreis: ein Kürzel ist 2-4 Zeichen lang (initialsForName(),
js/utils.js), ein starrer 18px-Kreis hätte "THK" o. Ä. abgeschnitten. */
-.pt-badge-person { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
+.pt-badge-person { min-width: 18px; height: 18px; padding: 0 4px; border-radius: 999px;
background: var(--accent); color: var(--surface);
- font-size: 9px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
-.pt-chevron { color: var(--text-subtle); font-size: 10.5px; width: 12px; text-align: center;
+ font-size: 11px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
+.pt-chevron { color: var(--text-subtle); font-size: 11px; width: 12px; text-align: center;
transition: transform .15s; flex-shrink: 0; }
.protokoll-todo-vorschlag.open .pt-chevron { transform: rotate(90deg); }
.pt-row-detail { display: none; padding: 0 6px 12px; }
@@ -785,20 +783,20 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.protokoll-detail-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;
padding-bottom: 16px; border-bottom: 1px solid var(--line-soft); margin-bottom: 16px; }
-.protokoll-detail-meta { color: var(--text-muted); font-size: 12.5px; }
+.protokoll-detail-meta { color: var(--text-muted); font-size: 13px; }
-.protokoll-field-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 20px; }
-.protokoll-field { display: flex; flex-direction: column; gap: 5px; }
-.protokoll-field label { font-size: 11.5px; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .04em; }
+.protokoll-field-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }
+.protokoll-field { display: flex; flex-direction: column; gap: 4px; }
+.protokoll-field label { font-size: 12px; color: var(--text-subtle); letter-spacing: 0; }
.protokoll-block { margin-top: 20px; }
-.protokoll-block-head { margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; }
-.protokoll-block-head h4 { margin: 0; font-size: 13.5px; font-weight: 650; }
+.protokoll-block-head { margin-bottom: 8px; display: flex; align-items: center; justify-content: space-between; }
+.protokoll-block-head h4 { margin: 0; font-size: 13px; font-weight: 500; }
-.protokoll-teilnehmer-row { display: grid; grid-template-columns: 1fr 160px 100px 24px; gap: 10px; align-items: center;
- padding: 7px 0; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
+.protokoll-teilnehmer-row { display: grid; grid-template-columns: 1fr 160px 100px 24px; gap: 8px; align-items: center;
+ padding: 8px 0; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
.protokoll-teilnehmer-row:last-of-type { border-bottom: none; }
-.protokoll-anwesend-toggle { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-muted); }
+.protokoll-anwesend-toggle { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
.protokoll-anwesend-toggle input { accent-color: var(--green); }
.protokoll-row-remove { color: var(--text-subtle); text-align: center; cursor: pointer; opacity: .6; flex-shrink: 0; }
.protokoll-row-remove:hover { opacity: 1; color: var(--red); }
@@ -811,15 +809,15 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
ein kleiner Fließtext, keine Tabellenzelle — in der Spalte blieb für den
Text weder Breite noch Höhe, Thema und Text klebten übereinander und die
Formatierungsleiste saß eingeklemmt dazwischen. */
-.protokoll-split { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 14px; align-items: start; }
+.protokoll-split { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 12px; align-items: start; }
.protokoll-liste {
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
overflow: hidden; box-shadow: var(--sh-1);
}
.protokoll-liste-kopf {
- padding: 9px 12px; background: var(--surface-alt); border-bottom: 1px solid var(--line);
- font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-subtle);
+ padding: 8px 12px; background: var(--surface-alt); border-bottom: 1px solid var(--line);
+ font-size: 11px; font-weight: 600; letter-spacing: 0; color: var(--text-subtle);
}
/* Gruppen-Kopfzeile: Farbbalken links aus dem Gruppennamen gehasht
(protokollGruppeFarbe(), plan-protokoll.js — dasselbe Prinzip wie
@@ -827,7 +825,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
egal an welcher Position sie steht. Der Name selbst ist das Eingabefeld:
umbenennen wirkt auf alle Punkte der Gruppe. */
.protokoll-liste-gruppe {
- display: flex; align-items: center; gap: 7px; padding: 8px 10px 8px 11px;
+ display: flex; align-items: center; gap: 8px; padding: 8px 12px 8px 12px;
background: var(--surface-sunk); border-bottom: 1px solid var(--line-soft);
border-left: 3px solid var(--protokoll-gruppe-farbe, var(--accent));
}
@@ -838,21 +836,21 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
weiter unten: die Dark-Mode-Fassung von input[type=text] (styles.css)
hängt ein html-Element vor den Selektor und gewinnt sonst. */
.protokoll-liste-gruppe input.protokoll-gruppe-heading {
- flex: 1; min-width: 0; font-size: 12px; font-weight: 700; letter-spacing: .01em;
+ flex: 1; min-width: 0; font-size: 12px; font-weight: 600; letter-spacing: .01em;
border: none !important; background: none !important; border-radius: 4px !important;
- color: var(--text) !important; padding: 2px 3px !important;
+ color: var(--text) !important; padding: 2px 4px !important;
}
-.protokoll-liste-gruppe input.protokoll-gruppe-heading::placeholder { color: var(--text-subtle); font-weight: 550; }
+.protokoll-liste-gruppe input.protokoll-gruppe-heading::placeholder { color: var(--text-subtle); font-weight: 500; }
.protokoll-liste-gruppe input.protokoll-gruppe-heading:focus { outline: none; }
.protokoll-liste-gruppe input.protokoll-gruppe-heading:focus-visible { box-shadow: 0 0 0 2px var(--accent-soft) inset; }
.protokoll-liste-gruppe .count {
- font-size: 10px; font-variant-numeric: tabular-nums; color: var(--text-subtle);
- background: var(--surface); border: 1px solid var(--line); border-radius: 980px; padding: 0 6px; flex-shrink: 0;
+ font-size: 11px; font-variant-numeric: tabular-nums; color: var(--text-subtle);
+ background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 0 6px; flex-shrink: 0;
}
.protokoll-liste-zeile {
display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 2px 8px; align-items: baseline;
- padding: 8px 11px; cursor: pointer; border-bottom: 1px solid var(--line-soft);
+ padding: 8px 12px; cursor: pointer; border-bottom: 1px solid var(--line-soft);
border-left: 3px solid transparent;
}
.protokoll-liste-zeile:hover { background: var(--surface-alt); }
@@ -864,16 +862,16 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
auto-Spalte — die Unterzeile blieb dann auf zwei Zeichen abgeschnitten. */
.protokoll-liste-zeile .nr {
grid-column: 1; grid-row: 1;
- font-variant-numeric: tabular-nums; font-size: 11.5px; font-weight: 700; color: var(--text-muted);
+ font-variant-numeric: tabular-nums; font-size: 12px; font-weight: 600; color: var(--text-muted);
}
.protokoll-liste-zeile.ist-aktiv .nr { color: var(--accent); }
.protokoll-liste-zeile .titel {
grid-column: 2; grid-row: 1;
- font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
+ font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
-.protokoll-liste-zeile .titel.ist-leer { font-weight: 500; font-style: italic; color: var(--text-subtle); }
+.protokoll-liste-zeile .titel.ist-leer { font-weight: 500; font-style: normal; color: var(--text-subtle); }
.protokoll-liste-zeile .sub {
- grid-column: 2; grid-row: 2; font-size: 10.5px; color: var(--text-subtle);
+ grid-column: 2; grid-row: 2; font-size: 11px; color: var(--text-subtle);
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Das Neu-Kennzeichen steht rechts unter dem Status-Punkt statt in einer
@@ -889,37 +887,37 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.protokoll-punkt-dot[data-status="info"] { background: var(--status-info); }
.protokoll-liste-neu {
- padding: 8px 11px 8px 14px; color: var(--accent); font-size: 12px; font-weight: 600; cursor: pointer;
+ padding: 8px 12px 8px 16px; color: var(--accent); font-size: 12px; font-weight: 500; cursor: pointer;
border-bottom: 1px solid var(--line-soft);
}
.protokoll-liste-neu:hover { background: var(--surface-alt); color: var(--accent-hover); }
.protokoll-liste-neu.ist-gruppe { border-bottom: none; border-top: 1px solid var(--line); }
-.protokoll-liste-leer { padding: 14px 12px; font-size: 12.5px; color: var(--text-subtle); }
+.protokoll-liste-leer { padding: 16px 12px; font-size: 13px; color: var(--text-subtle); }
/* ---------- Schreibbereich ---------- */
.protokoll-schreiben {
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
overflow: hidden; box-shadow: var(--sh-1);
}
-.protokoll-schreiben.ist-leer { padding: 28px 22px; color: var(--text-muted); font-size: 13px; }
+.protokoll-schreiben.ist-leer { padding: 28px 24px; color: var(--text-muted); font-size: 13px; }
.protokoll-schreiben.ist-leer p { margin: 0 0 6px; }
.protokoll-schreiben.ist-leer p:last-child { margin-bottom: 0; }
.protokoll-schreiben-kopf {
- display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
- padding: 9px 16px; background: var(--surface-alt); border-bottom: 1px solid var(--line-soft);
+ display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
+ padding: 8px 16px; background: var(--surface-alt); border-bottom: 1px solid var(--line-soft);
}
-.protokoll-schreiben-kopf .nr { font-variant-numeric: tabular-nums; font-weight: 700; font-size: 13px; }
+.protokoll-schreiben-kopf .nr { font-variant-numeric: tabular-nums; font-weight: 600; font-size: 13px; }
.protokoll-schreiben-kopf .gruppe {
- font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text-subtle);
+ font-size: 11px; font-weight: 600; letter-spacing: 0; color: var(--text-subtle);
}
-.protokoll-schreiben-kopf .rechts { margin-left: auto; display: flex; align-items: center; gap: 9px; }
+.protokoll-schreiben-kopf .rechts { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.protokoll-feld-label {
- display: block; font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
- color: var(--text-subtle); margin-bottom: 5px;
+ display: block; font-size: 11px; font-weight: 600; letter-spacing: 0;
+ color: var(--text-subtle); margin-bottom: 4px;
}
-.protokoll-schreiben-feld { padding: 13px 16px; }
+.protokoll-schreiben-feld { padding: 12px 16px; }
.protokoll-schreiben-feld + .protokoll-schreiben-feld { border-top: 1px solid var(--line-soft); }
/* Thema und Text sitzen randlos in ihrem beschrifteten Abschnitt — der
@@ -929,13 +927,13 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
(html:not([data-theme="light"]) …, styles.css), die sonst an Spezifität
gewinnt und ein abgerundetes Eingabefeld-Rechteck durchscheinen lässt. */
.protokoll-schreiben-feld input.protokoll-punkt-thema {
- font: inherit; font-size: 17px; font-weight: 650; letter-spacing: -.01em; width: 100%; line-height: 1.3;
+ font: inherit; font-size: 19px; font-weight: 500; letter-spacing: 0; width: 100%; line-height: 1.3;
border: none !important; background: none !important; border-radius: 4px !important;
color: var(--text) !important; padding: 1px 2px !important; display: block;
}
.protokoll-schreiben-feld input.protokoll-punkt-thema::placeholder { font-weight: 500; color: var(--text-subtle); }
.protokoll-schreiben-feld .protokoll-punkt-text {
- font: inherit; font-size: 13.5px; line-height: 1.65; color: var(--text);
+ font: inherit; font-size: 13px; line-height: 1.65; color: var(--text);
min-height: 130px; max-width: 66ch; padding: 1px 2px; border-radius: 4px;
}
.protokoll-schreiben-feld .protokoll-punkt-text:empty::before { content: attr(data-placeholder); color: var(--text-subtle); }
@@ -949,7 +947,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
Inhalt nicht. */
.protokoll-schreiben-feld input.protokoll-punkt-thema.ist-geaendert,
.protokoll-schreiben-feld .protokoll-punkt-text.ist-geaendert {
- background: var(--protokoll-neu-bg) !important; padding: 3px 6px !important; margin: 0 -4px;
+ background: var(--protokoll-neu-bg) !important; padding: 4px 6px !important; margin: 0 -4px;
}
/* Die Formatierungsleiste sitzt zwischen Thema und Text — sie gehört zum
@@ -958,19 +956,19 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.protokoll-schreiben .richtext-toolbar { border-top: 1px solid var(--line-soft); }
.protokoll-schreiben-raster {
- display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
- padding: 13px 16px; border-top: 1px solid var(--line-soft);
+ display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
+ padding: 12px 16px; border-top: 1px solid var(--line-soft);
}
.protokoll-schreiben-raster input {
font: inherit !important; font-size: 13px !important; width: 100%; min-width: 0 !important;
color: var(--text) !important; background: var(--surface) !important;
- border: 1px solid var(--line) !important; border-radius: var(--r-sm) !important; padding: 6px 9px !important;
+ border: 1px solid var(--line) !important; border-radius: var(--r-sm) !important; padding: 6px 8px !important;
}
.protokoll-schreiben-raster input:focus {
outline: none; border-color: var(--accent) !important; box-shadow: 0 0 0 3px var(--accent-soft);
}
.protokoll-schreiben-fuss {
- padding: 9px 16px; border-top: 1px solid var(--line-soft); background: var(--surface-alt);
+ padding: 8px 16px; border-top: 1px solid var(--line-soft); background: var(--surface-alt);
font-size: 11px; color: var(--text-subtle);
}
.protokoll-schreiben-fuss .hint { font-size: 11px; }
@@ -978,15 +976,15 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
/* ---------- Chips, Verschieben, Entfernen ---------- */
.protokoll-chip-neu {
display: inline-block; width: fit-content; background: var(--protokoll-neu-border); color: #3d2e00;
- font-size: 9.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; padding: 1px 6px;
- border-radius: var(--r-pill);
+ font-size: 11px; font-weight: 600; letter-spacing: 0; padding: 1px 6px;
+ border-radius: 6px;
}
/* Gnadenrunde eines erledigten Punkts — bewusst Fließtext statt
Großbuchstaben-Pille: der Hinweistext ist zu lang dafür. */
.protokoll-chip-entfaellt {
display: inline-block; max-width: 100%;
background: color-mix(in srgb, var(--red) 15%, transparent); color: var(--red);
- font-size: 9.5px; font-weight: 700; line-height: 1.3; padding: 2px 7px; border-radius: var(--r-sm);
+ font-size: 11px; font-weight: 600; line-height: 1.3; padding: 2px 8px; border-radius: var(--r-sm);
}
.protokoll-gruppe-move, .protokoll-punkt-move { display: inline-flex; gap: 4px; flex-shrink: 0; }
/* button.secondary (styles.css) bringt eine eigene, leicht deckende Fläche
@@ -1005,16 +1003,16 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
Senkrecht gestapelt in der Grundform; im Kopf des Schreibbereichs ist
Platz, dort liegt er waagerecht. */
.protokoll-status-switch {
- display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 7px; padding: 2px;
+ display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 8px; padding: 2px;
background: var(--surface-sunk); gap: 1px; width: 56px;
}
-.protokoll-status-switch.ist-waagerecht { flex-direction: row; width: auto; border-radius: 980px; }
+.protokoll-status-switch.ist-waagerecht { flex-direction: row; width: auto; border-radius: 8px; }
.protokoll-status-switch button {
- appearance: none; border: none; background: none; font: inherit; font-size: 10.5px; font-weight: 700;
- letter-spacing: .01em; padding: 4px 0; border-radius: 5px; cursor: pointer; color: var(--text-subtle);
+ appearance: none; border: none; background: none; font: inherit; font-size: 11px; font-weight: 600;
+ letter-spacing: .01em; padding: 4px 0; border-radius: 6px; cursor: pointer; color: var(--text-subtle);
text-align: center; transition: background .12s, color .12s;
}
-.protokoll-status-switch.ist-waagerecht button { padding: 3px 11px; border-radius: 980px; }
+.protokoll-status-switch.ist-waagerecht button { padding: 4px 12px; border-radius: 6px; }
.protokoll-status-switch button:hover:not(.is-active) { color: var(--text); }
.protokoll-status-switch button:disabled { cursor: default; }
.protokoll-status-switch button:disabled:hover { color: var(--text-subtle); }
@@ -1032,7 +1030,7 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
}
.add-row-btn { display: flex; align-items: center; gap: 6px; color: var(--accent); font-size: 13px;
- font-weight: 600; cursor: pointer; padding: 8px 0; width: fit-content; }
+ font-weight: 500; cursor: pointer; padding: 8px 0; width: fit-content; }
.add-row-btn:hover { color: var(--accent-hover); }
.legend-swatch { width: 13px; height: 13px; border-radius: 4px; flex-shrink: 0; display: inline-block; }
@@ -1110,19 +1108,19 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
}
.plan-lage-zelle { padding: 12px 16px; min-width: 0; }
.plan-lage-zelle + .plan-lage-zelle { border-left: 1px solid var(--line-soft); }
-.plan-lage-zelle .kpi-label { font-size: 11px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--text-subtle); }
-.plan-lage-zelle .kpi-value { font-size: 22px; font-weight: 600; letter-spacing: -.01em; margin-top: 2px; font-variant-numeric: tabular-nums; }
+.plan-lage-zelle .kpi-label { font-size: 11px; font-weight: 500; letter-spacing: 0; color: var(--text-subtle); }
+.plan-lage-zelle .kpi-value { font-size: 24px; font-weight: 500; letter-spacing: 0; margin-top: 2px; font-variant-numeric: tabular-nums; }
.plan-lage-zelle .kpi-sub { font-size: 12px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.plan-lage-zelle .kpi-sub.ist-rot { color: var(--red); font-weight: 600; }
-.plan-lage-phase { display: flex; align-items: center; gap: 14px; }
+.plan-lage-zelle .kpi-sub.ist-rot { color: var(--red); font-weight: 500; }
+.plan-lage-phase { display: flex; align-items: center; gap: 12px; }
.plan-lage-ring {
flex: none; width: 54px; height: 54px; border-radius: 50%;
background: conic-gradient(var(--accent) calc(var(--p) * 1%), color-mix(in srgb, var(--text-subtle) 18%, transparent) 0);
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
}
-.plan-lage-raster { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); gap: 14px; align-items: start; margin-top: 14px; }
-.plan-lage-spalte { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
+.plan-lage-raster { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); gap: 12px; align-items: start; margin-top: 12px; }
+.plan-lage-spalte { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.plan-lage-spalte .plan-panel { box-shadow: var(--sh-1); }
@media (max-width: 1000px) {
.plan-lage-band { grid-template-columns: 1fr 1fr; }
@@ -1133,50 +1131,50 @@ html[data-theme="dark"] { --seg-hover: rgba(255,255,255,.10); }
.plan-panel-title .plan-panel-link, .plan-unterlage-kopf .plan-panel-link { margin-left: auto; }
.plan-panel-link {
appearance: none; border: 0; background: none !important; box-shadow: none !important; padding: 0;
- color: var(--accent); font: inherit; font-size: 12px; font-weight: 550; cursor: pointer;
+ color: var(--accent); font: inherit; font-size: 12px; font-weight: 500; cursor: pointer;
}
.plan-panel-link:hover { text-decoration: underline; }
.plan-panel-link:active { transform: none; }
-.plan-kommentar-fuss { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
+.plan-kommentar-fuss { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.plan-kommentar-autor { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-subtle); }
.plan-kommentar-autor:empty { display: none; }
-.plan-autor-ava { width: 24px; height: 24px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 9.5px; font-weight: 700; background: var(--accent-soft); color: var(--accent); }
+.plan-autor-ava { width: 24px; height: 24px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; font-weight: 600; background: var(--accent-soft); color: var(--accent); }
.plan-kommentar-fuss .plan-verweis-row { margin-left: auto; }
-.plan-termin-gruppe { display: flex; gap: 6px; align-items: baseline; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-subtle); padding: 10px 0 2px; }
+.plan-termin-gruppe { display: flex; gap: 6px; align-items: baseline; font-size: 11px; font-weight: 600; letter-spacing: 0; color: var(--text-subtle); padding: 12px 0 2px; }
.plan-termin-gruppe:first-child { padding-top: 0; }
.plan-termin-gruppe span { font-weight: 500; letter-spacing: 0; }
.plan-termin-gruppe.ist-rot { color: var(--red); }
-.plan-termin { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 6px; margin: 0 -6px; border-top: 1px solid var(--line-soft); border-radius: 8px; }
+.plan-termin { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 6px; margin: 0 -6px; border-top: 1px solid var(--line-soft); border-radius: 8px; }
.plan-termin-gruppe + .plan-termin { border-top: 0; }
.plan-termin.ist-klickbar { cursor: pointer; }
.plan-termin.ist-klickbar:hover { background: var(--surface-sunk); }
-.plan-termin-art { width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; font-size: 10px; font-weight: 700; background: var(--surface-sunk); color: var(--text-muted); }
+.plan-termin-art { width: 22px; height: 22px; border-radius: 8px; display: grid; place-items: center; font-size: 11px; font-weight: 600; background: var(--surface-sunk); color: var(--text-muted); }
.plan-termin-art.ist-meins { background: var(--accent-soft); color: var(--accent); }
.plan-termin-art.ist-ms { background: color-mix(in srgb, #6d4bb3 14%, transparent); color: #6d4bb3; }
.plan-termin-text { min-width: 0; display: flex; flex-direction: column; }
-.plan-termin-text b { font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.plan-termin-text span { font-size: 11.5px; color: var(--text-subtle); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.plan-termin-text b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.plan-termin-text span { font-size: 12px; color: var(--text-subtle); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plan-termin-datum { text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.plan-termin-datum em { display: block; font-style: normal; font-size: 11px; color: var(--text-subtle); }
.plan-termin-datum.ist-rot, .plan-termin-datum.ist-rot em { color: var(--red); }
.plan-termin-mehr { margin-top: 8px; }
-.plan-team-zeile { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 7px 0; border-top: 1px solid var(--line-soft); }
+.plan-team-zeile { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line-soft); }
.plan-team-zeile:first-child { border-top: 0; padding-top: 0; }
-.plan-team-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
-.plan-team-text b { font-weight: 550; }
+.plan-team-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
+.plan-team-text b { font-weight: 500; }
.plan-team-rollen { display: flex; flex-wrap: wrap; gap: 4px; }
-.plan-rolle { font-size: 10px; font-weight: 600; padding: 1px 7px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); }
+.plan-rolle { font-size: 11px; font-weight: 500; padding: 1px 8px; border-radius: 6px; background: var(--accent-soft); color: var(--accent); }
.plan-rolle.ist-neben { background: transparent; border: 1px dashed var(--line); color: var(--text-muted); }
.plan-team-offen { font-size: 12px; color: var(--text-muted); white-space: nowrap; }
-.plan-unterlage { padding: 9px 6px; margin: 0 -6px; border-top: 1px solid var(--line-soft); border-radius: 8px; cursor: pointer; }
+.plan-unterlage { padding: 8px 6px; margin: 0 -6px; border-top: 1px solid var(--line-soft); border-radius: 8px; cursor: pointer; }
.plan-unterlage:first-child { border-top: 0; padding-top: 2px; }
.plan-unterlage:hover { background: var(--surface-sunk); }
.plan-unterlage-kopf { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
-.plan-unterlage-kopf b { font-weight: 600; }
+.plan-unterlage-kopf b { font-weight: 500; }
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) .plan-termin-art.ist-ms { color: #c3a6ff; } }
html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
@@ -1184,9 +1182,9 @@ html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
allgemeine .status-edit ist auf die enge Zeile des Boards ausgelegt
(11px). Hier ist er das wichtigste Lesefeld des Lagebilds. */
#planSection-dashboard #planStatusEdit {
- font-size: 14.5px;
+ font-size: 15px;
line-height: 1.6;
- padding: 14px 16px;
+ padding: 16px 16px;
min-height: 160px;
border-radius: var(--r-md);
border-style: solid;
@@ -1197,19 +1195,19 @@ html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
sagt das der Hinweis darüber. Darunter eine Zeitleiste der früheren
Kommentare je Gewerk (renderPlanKommentarVerlauf(), plan-info.js). */
.plan-kommentar-hinweis {
- margin-bottom: 10px; padding: 8px 12px; border-radius: var(--r-sm, 8px);
- font-size: 12.5px; line-height: 1.45;
+ margin-bottom: 8px; padding: 8px 12px; border-radius: var(--r-sm, 8px);
+ font-size: 13px; line-height: 1.45;
color: var(--text);
background: color-mix(in srgb, var(--amber) 16%, transparent);
border: 1px solid color-mix(in srgb, var(--amber) 40%, transparent);
}
-.plan-kommentar-verlauf { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
-.plan-verlauf-kopf { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
-.plan-verlauf-titel { font-size: 11.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
+.plan-kommentar-verlauf { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
+.plan-verlauf-kopf { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
+.plan-verlauf-titel { font-size: 12px; font-weight: 500; letter-spacing: 0; color: var(--text-muted); }
.plan-verlauf-anzahl { font-size: 12px; color: var(--text-subtle); }
.plan-verlauf-liste { list-style: none; margin: 0; padding: 0; }
-.plan-verlauf-eintrag { display: grid; grid-template-columns: 52px 12px minmax(0, 1fr); column-gap: 10px; }
-.plan-verlauf-kw { font-size: 12px; font-weight: 600; color: var(--text); padding-top: 1px; white-space: nowrap; }
+.plan-verlauf-eintrag { display: grid; grid-template-columns: 52px 12px minmax(0, 1fr); column-gap: 8px; }
+.plan-verlauf-kw { font-size: 12px; font-weight: 500; color: var(--text); padding-top: 1px; white-space: nowrap; }
.plan-verlauf-punkt { position: relative; }
.plan-verlauf-punkt::before {
content: ""; position: absolute; left: 1.5px; top: 5px;
@@ -1221,13 +1219,13 @@ html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
content: ""; position: absolute; left: 5px; top: 17px; bottom: 0; width: 2px; background: var(--line);
}
.plan-verlauf-eintrag:last-child .plan-verlauf-punkt::after { display: none; }
-.plan-verlauf-inhalt { padding-bottom: 14px; min-width: 0; }
-.plan-verlauf-text { font-size: 13.5px; line-height: 1.5; color: var(--text); overflow-wrap: anywhere; }
+.plan-verlauf-inhalt { padding-bottom: 16px; min-width: 0; }
+.plan-verlauf-text { font-size: 13px; line-height: 1.5; color: var(--text); overflow-wrap: anywhere; }
.plan-verlauf-text p { margin: 0; }
-.plan-verlauf-meta { font-size: 11.5px; color: var(--text-subtle); margin-top: 3px; }
+.plan-verlauf-meta { font-size: 12px; color: var(--text-subtle); margin-top: 4px; }
.plan-verlauf-mehr {
border: 1px solid var(--line); background: var(--surface); color: var(--accent);
- border-radius: 999px; padding: 6px 14px; font: inherit; font-size: 12.5px; cursor: pointer;
+ border-radius: 8px; padding: 6px 16px; font: inherit; font-size: 13px; cursor: pointer;
}
.plan-verlauf-mehr:hover { background: var(--surface-alt); }
@@ -1240,29 +1238,29 @@ html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
font: inherit; color: var(--text); background: var(--surface-sunk);
border: 1px solid var(--line-soft); border-radius: var(--r-md, 12px);
- padding: 10px 12px; cursor: pointer;
+ padding: 12px 12px; cursor: pointer;
}
.plan-prot-kopf:hover { border-color: var(--accent); }
.plan-prot-nr {
- flex: none; font-size: 12px; font-weight: 700; color: var(--accent);
+ flex: none; font-size: 12px; font-weight: 600; color: var(--accent);
background: var(--accent-soft); border-radius: 8px; padding: 4px 8px;
}
.plan-prot-titel { min-width: 0; display: flex; flex-direction: column; }
-.plan-prot-titel b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.plan-prot-titel b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plan-prot-titel span { font-size: 12px; color: var(--text-subtle); }
.plan-prot-punkte { margin-top: 8px; }
.plan-prot-punkte:empty { display: none; }
.plan-prot-mehr { display: block; margin-top: 6px; }
.plan-prot-frueher {
- display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: baseline;
- width: 100%; text-align: left; font: inherit; font-size: 12.5px; color: var(--text-muted);
- background: none; border: 0; border-top: 1px solid var(--line-soft); padding: 7px 6px; cursor: pointer; border-radius: 8px;
+ display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: baseline;
+ width: 100%; text-align: left; font: inherit; font-size: 13px; color: var(--text-muted);
+ background: none; border: 0; border-top: 1px solid var(--line-soft); padding: 8px 6px; cursor: pointer; border-radius: 8px;
}
.plan-termin-gruppe + .plan-prot-frueher { border-top: 0; }
.plan-prot-frueher:hover { background: var(--surface-sunk); }
.plan-prot-frueher-titel { color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plan-prot-frueher-zahl { color: var(--amber); font-size: 12px; white-space: nowrap; }
-.plan-dash-leer { display: flex; align-items: center; gap: 10px; color: var(--text-subtle); font-size: 13px; }
+.plan-dash-leer { display: flex; align-items: center; gap: 8px; color: var(--text-subtle); font-size: 13px; }
/* Kachel "Team" nach Gewerk gruppiert (Eriks Wahl "A", plan-sections.js):
je Gewerk eine Überschrift mit Personenzahl; ein Gewerk des Projekts ohne
@@ -1270,32 +1268,32 @@ html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
.plan-team-gruppe + .plan-team-gruppe { margin-top: 6px; }
.plan-team-gewerk { display: flex; align-items: center; gap: 8px; padding: 6px 0 4px; }
.plan-team-gruppe:first-child .plan-team-gewerk { padding-top: 0; }
-.plan-gewerk-schild { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; padding: 2px 8px; border-radius: 6px; background: var(--accent-soft); color: var(--accent); }
+.plan-gewerk-schild { font-size: 11px; font-weight: 600; letter-spacing: .04em; padding: 2px 8px; border-radius: 6px; background: var(--accent-soft); color: var(--accent); }
.plan-gewerk-titel { font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.plan-gewerk-linie { flex: 1; height: 1px; background: var(--line-soft); }
.plan-gewerk-anzahl { font-size: 12px; color: var(--text-subtle); white-space: nowrap; }
.plan-team-gewerk + .plan-team-zeile { border-top: 0; }
-.plan-team-luecke { font-size: 12.5px; color: var(--amber); padding: 2px 0 6px; }
+.plan-team-luecke { font-size: 13px; color: var(--amber); padding: 2px 0 6px; }
/* Einstellungen mit Unternavigation (Eriks Wahl "C", plan-settings.js):
links vier Abschnitte mit Kurzfassung, rechts immer genau einer. */
-.plan-einst { display: flex; gap: 14px; align-items: flex-start; margin-top: 4px; }
+.plan-einst { display: flex; gap: 12px; align-items: flex-start; margin-top: 4px; }
.plan-einst-nav {
flex: none; width: 260px; position: sticky; top: 90px;
display: flex; flex-direction: column; gap: 4px; padding: 8px;
background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--r-lg);
}
.plan-einst-reiter {
- display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left;
- min-height: 56px; padding: 9px 14px; border: 0; border-radius: 12px;
+ display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left;
+ min-height: 56px; padding: 8px 16px; border: 0; border-radius: 12px;
background: transparent; color: var(--text); font: inherit; cursor: pointer;
}
-.plan-einst-reiter b { font-size: 14px; font-weight: 600; }
+.plan-einst-reiter b { font-size: 13px; font-weight: 500; }
.plan-einst-reiter span { font-size: 12px; color: var(--text-muted); line-height: 1.35; }
.plan-einst-reiter:hover { background: var(--surface-sunk); }
.plan-einst-reiter.is-active { background: var(--surface-sunk); box-shadow: inset 3px 0 0 var(--accent); }
-.plan-einst-inhalt { flex: 1; min-width: 0; padding: 22px 26px; }
-.plan-einst-titel { margin: 0 0 16px; font-size: 18px; font-weight: 650; }
+.plan-einst-inhalt { flex: 1; min-width: 0; padding: 24px 28px; }
+.plan-einst-titel { margin: 0 0 16px; font-size: 19px; font-weight: 500; }
.plan-einst-teil .form-row { max-width: 640px; }
.plan-einst-paar { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 0 12px; max-width: 640px; }
.plan-einst-paar > .form-row { min-width: 0; margin-bottom: 6px; }
@@ -1305,27 +1303,27 @@ html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
.plan-einst-schmal { max-width: 320px; }
.plan-einst-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.plan-einst-chip {
- min-height: 36px; padding: 0 16px; border-radius: 999px; font: inherit; font-size: 13px; cursor: pointer;
+ min-height: 36px; padding: 0 16px; border-radius: 6px; font: inherit; font-size: 13px; cursor: pointer;
border: 1px solid var(--line); background: var(--surface); color: var(--text);
}
-.plan-einst-chip.an { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
+.plan-einst-chip.an { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 500; }
/* Umschalter (Leistungsphasen, Beteiligte) */
-.plan-einst-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 999px; background: var(--surface-sunk); }
+.plan-einst-seg { display: inline-flex; gap: 2px; padding: 4px; border-radius: 8px; background: var(--surface-sunk); }
.plan-einst-seg button {
- border: 0; background: transparent; color: var(--text-muted); font: inherit; font-size: 12.5px;
- min-height: 30px; padding: 0 12px; border-radius: 999px; cursor: pointer; white-space: nowrap;
+ border: 0; background: transparent; color: var(--text-muted); font: inherit; font-size: 13px;
+ min-height: 30px; padding: 0 12px; border-radius: 6px; cursor: pointer; white-space: nowrap;
}
-.plan-einst-seg button.an { background: var(--surface); color: var(--accent); font-weight: 600; box-shadow: 0 1px 4px rgba(15,40,60,.12); }
+.plan-einst-seg button.an { background: var(--surface); color: var(--accent); font-weight: 500; box-shadow: 0 1px 4px rgba(15,40,60,.12); }
.plan-einst-seg button:disabled { cursor: default; }
.plan-einst-phasen { display: flex; flex-direction: column; max-width: 760px; }
-.plan-einst-phase { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line-soft); }
+.plan-einst-phase { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line-soft); }
.plan-einst-phase-name { display: flex; align-items: center; gap: 12px; min-width: 0; }
.plan-einst-phase-name b { width: 52px; flex: none; font-size: 13px; }
-.plan-einst-phase-name span { font-size: 14px; color: var(--text-muted); }
+.plan-einst-phase-name span { font-size: 13px; color: var(--text-muted); }
.plan-einst-phase.ist-an .plan-einst-phase-name span { color: var(--text); }
-.plan-einst-phase-name em { font-style: normal; font-size: 11px; font-weight: 700; color: var(--accent); background: var(--accent-soft); border-radius: 999px; padding: 2px 8px; }
+.plan-einst-phase-name em { font-style: normal; font-size: 11px; font-weight: 600; color: var(--accent); background: var(--accent-soft); border-radius: 6px; padding: 2px 8px; }
@media (max-width: 900px) {
@@ -1337,10 +1335,10 @@ html[data-theme="dark"] .plan-termin-art.ist-ms { color: #c3a6ff; }
allgemeine Feldregel in styles.css kennt type=number nicht; sie dort
aufzunehmen träfe auch kompakte Zahlenfelder anderer Bereiche. */
.plan-einst-teil input[type=number] {
- padding: 7px 10px; border: 1px solid var(--line); border-radius: var(--r-md);
+ padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-md);
font: inherit; font-size: 13px; color: var(--text); background: var(--surface);
}
-.plan-einst-teil input[type=number]:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(0,113,227,.18); }
+.plan-einst-teil input[type=number]:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
/* Dunkel ist der Akzent hell — weiße Schrift darauf wäre kaum lesbar. */
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) .plan-einst-chip.an { color: #0b141b; } }
html[data-theme="dark"] .plan-einst-chip.an { color: #0b141b; }
@@ -1351,79 +1349,79 @@ html[data-theme="dark"] .plan-einst-chip.an { color: #0b141b; }
= Unterstützung), Entfernen mit "Rückgängig". */
.plan-einst-teil[data-teil="team"] { position: relative; }
.plan-einst-team-kopfzeile { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 20px; }
-.plan-einst-team-kopfzeile .plan-einst-hint { margin-bottom: 14px; }
-.plan-einst-legende { display: flex; gap: 14px; font-size: 12px; color: var(--text-muted); margin-bottom: 16px; }
+.plan-einst-team-kopfzeile .plan-einst-hint { margin-bottom: 12px; }
+.plan-einst-legende { display: flex; gap: 12px; font-size: 12px; color: var(--text-muted); margin-bottom: 16px; }
.plan-einst-legende span { display: inline-flex; align-items: center; gap: 6px; }
.plan-einst-legende i { width: 24px; height: 14px; border-radius: 999px; box-sizing: border-box; }
.plan-einst-legende i.ist-haupt { background: var(--accent); }
.plan-einst-legende i.ist-neben { border: 1.5px dashed var(--accent); background: var(--accent-soft); }
-.plan-einst-sperre { padding: 10px 14px; border-radius: 12px; background: var(--surface-sunk); font-size: 13px; margin-bottom: 14px; }
+.plan-einst-sperre { padding: 12px 16px; border-radius: 12px; background: var(--surface-sunk); font-size: 13px; margin-bottom: 12px; }
.plan-einst-besetzung { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 16px; }
-.plan-einst-besetzt { display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 10px 12px; border-radius: 12px; background: var(--surface-sunk); border: 1px solid transparent; }
-.plan-einst-besetzt b { font-size: 12px; font-weight: 650; color: var(--text-muted); }
-.plan-einst-besetzt span { font-size: 12.5px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.plan-einst-besetzt { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 12px 12px; border-radius: 12px; background: var(--surface-sunk); border: 1px solid transparent; }
+.plan-einst-besetzt b { font-size: 12px; font-weight: 500; color: var(--text-muted); }
+.plan-einst-besetzt span { font-size: 13px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plan-einst-besetzt.ist-luecke { background: color-mix(in srgb, var(--amber) 10%, transparent); border: 1px dashed var(--amber); }
.plan-einst-besetzt.ist-luecke b, .plan-einst-besetzt.ist-luecke span { color: var(--amber); }
.plan-einst-suche { position: relative; display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; max-width: 640px; }
.plan-einst-suche[hidden] { display: none; }
.plan-einst-suche label { font-size: 12px; font-weight: 500; color: var(--text-muted); }
-.plan-einst-suche input { height: 40px; box-sizing: border-box; font-size: 14px; }
+.plan-einst-suche input { height: 40px; box-sizing: border-box; font-size: 13px; }
.plan-einst-vorschlaege {
position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; max-height: 320px; overflow: auto;
padding: 6px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line);
box-shadow: 0 16px 40px rgba(15,40,60,.18);
}
html.glas .plan-einst-vorschlaege { background: var(--glas-dicht); }
-.plan-einst-vorschlag-titel { font-size: 11.5px; font-weight: 650; color: var(--text-muted); padding: 8px 10px 4px; }
-.plan-einst-vorschlag-leer { font-size: 13px; color: var(--text-muted); padding: 10px; }
+.plan-einst-vorschlag-titel { font-size: 12px; font-weight: 500; color: var(--text-muted); padding: 8px 12px 4px; }
+.plan-einst-vorschlag-leer { font-size: 13px; color: var(--text-muted); padding: 12px; }
.plan-einst-vorschlag {
- display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; min-height: 48px; padding: 4px 10px;
+ display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; min-height: 48px; padding: 4px 12px;
border: 0; border-radius: 10px; background: transparent; color: var(--text); font: inherit; cursor: pointer;
}
.plan-einst-vorschlag:hover, .plan-einst-vorschlag:focus-visible { background: var(--surface-sunk); }
.plan-einst-vorschlag > span:last-child { display: flex; flex-direction: column; min-width: 0; }
-.plan-einst-vorschlag b { font-size: 13.5px; font-weight: 600; }
+.plan-einst-vorschlag b { font-size: 13px; font-weight: 500; }
.plan-einst-vorschlag > span:last-child > span { font-size: 12px; color: var(--text-muted); }
.plan-einst-ava {
width: 34px; height: 34px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
- font-size: 11px; font-weight: 700; background: var(--accent); color: #fff;
+ font-size: 11px; font-weight: 600; background: var(--accent); color: #fff;
}
-.plan-einst-gruppe { display: flex; align-items: center; gap: 10px; padding: 16px 0 6px; }
+.plan-einst-gruppe { display: flex; align-items: center; gap: 8px; padding: 16px 0 6px; }
.plan-einst-zeile {
- display: grid; grid-template-columns: minmax(200px, 1fr) auto 36px; gap: 10px 14px; align-items: center;
- padding: 9px 10px; margin: 0 -10px; border-radius: 12px; border-top: 1px solid var(--line-soft);
+ display: grid; grid-template-columns: minmax(200px, 1fr) auto 36px; gap: 8px 12px; align-items: center;
+ padding: 8px 12px; margin: 0 -10px; border-radius: 12px; border-top: 1px solid var(--line-soft);
transition: background-color var(--dur-lg, .2s) var(--ease-out, ease);
}
.plan-einst-gruppe + .plan-einst-zeile { border-top-color: transparent; }
.plan-einst-zeile.ist-neu { background: var(--accent-soft); }
.plan-einst-person { display: flex; align-items: center; gap: 12px; min-width: 0; }
-.plan-einst-person b { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.plan-einst-person b { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-einst-kapseln { display: flex; flex-wrap: wrap; gap: 6px; }
.plan-einst-kapsel {
- min-height: 36px; padding: 0 14px; border-radius: 999px; box-sizing: border-box; white-space: nowrap;
- border: 1px solid var(--line); background: transparent; color: var(--text-muted); font: inherit; font-size: 12.5px; cursor: pointer;
+ min-height: 36px; padding: 0 16px; border-radius: 6px; box-sizing: border-box; white-space: nowrap;
+ border: 1px solid var(--line); background: transparent; color: var(--text-muted); font: inherit; font-size: 13px; cursor: pointer;
transition: transform var(--dur, .15s) var(--ease-out, ease), background-color var(--dur, .15s);
}
.plan-einst-kapsel:hover:not(:disabled) { border-color: var(--accent); color: var(--text); }
.plan-einst-kapsel:active:not(:disabled) { transform: scale(var(--press, .97)); }
-.plan-einst-kapsel.ist-haupt { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
-.plan-einst-kapsel.ist-neben { border: 1.5px dashed var(--accent); background: var(--accent-soft); color: var(--text); font-weight: 600; }
+.plan-einst-kapsel.ist-haupt { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 500; }
+.plan-einst-kapsel.ist-neben { border: 1.5px dashed var(--accent); background: var(--accent-soft); color: var(--text); font-weight: 500; }
.plan-einst-kapsel.ist-fremd { border-color: transparent; opacity: .5; text-decoration: line-through; }
.plan-einst-kapsel:disabled { cursor: default; }
-.plan-einst-weg { width: 36px; height: 36px; border-radius: 50%; border: 0; background: transparent; color: var(--text-muted); font-size: 18px; cursor: pointer; }
+.plan-einst-weg { width: 36px; height: 36px; border-radius: 50%; border: 0; background: transparent; color: var(--text-muted); font-size: 19px; cursor: pointer; }
.plan-einst-weg:hover { background: var(--surface-sunk); color: var(--red); }
.plan-einst-leer { display: flex; flex-direction: column; gap: 6px; padding: 20px; border-radius: 14px; border: 1px dashed var(--line); margin-top: 8px; }
-.plan-einst-leer b { font-size: 14px; font-weight: 600; }
+.plan-einst-leer b { font-size: 13px; font-weight: 500; }
.plan-einst-leer span { font-size: 13px; color: var(--text-muted); line-height: 1.5; }
.plan-einst-toast {
position: sticky; bottom: 16px; margin: 16px auto 0; width: max-content; max-width: 100%;
- display: flex; align-items: center; gap: 14px; padding: 8px 8px 8px 16px; border-radius: 999px;
+ display: flex; align-items: center; gap: 12px; padding: 8px 8px 8px 16px; border-radius: 8px;
background: var(--text); color: var(--bg); font-size: 13px; box-shadow: 0 16px 40px rgba(15,40,60,.25);
}
.plan-einst-toast[hidden] { display: none; }
-.plan-einst-toast button { min-height: 32px; padding: 0 14px; border-radius: 999px; border: 0; background: color-mix(in srgb, var(--bg) 18%, transparent); color: inherit; font: inherit; font-weight: 600; cursor: pointer; }
+.plan-einst-toast button { min-height: 32px; padding: 0 16px; border-radius: 8px; border: 0; background: color-mix(in srgb, var(--bg) 18%, transparent); color: inherit; font: inherit; font-weight: 500; cursor: pointer; }
/* Dunkel ist der Akzent hell — Schrift darauf dunkel. */
@media (prefers-color-scheme: dark) {
html:not([data-theme="light"]) .plan-einst-kapsel.ist-haupt,
@@ -1448,7 +1446,7 @@ html[data-theme="dark"] .plan-einst-ava { color: #0b141b; }
zuhalten. Jetzt: beauftragt = gefüllte Akzentkapsel und die ganze Zeile
leicht getönt; nicht beauftragt = neutrale Kapsel, Zeile zurückgenommen;
"läuft" gefüllt. */
-.plan-einst-phase { padding: 9px 10px; margin: 0 -10px; border-radius: 12px; }
+.plan-einst-phase { padding: 8px 12px; margin: 0 -10px; border-radius: 12px; }
.plan-einst-phase.ist-an { background: var(--accent-soft); border-top-color: transparent; }
.plan-einst-phase.ist-an + .plan-einst-phase { border-top-color: transparent; }
.plan-einst-phase .plan-einst-seg { background: var(--surface-sunk); border: 1px solid var(--line-soft); }
@@ -1491,18 +1489,18 @@ html[data-theme="dark"] .modal-bg.als-panel { background: rgba(0,0,0,.32); }
animation: pd-rein var(--dur-lg, .2s) var(--ease-out, ease);
}
@keyframes pd-rein { from { transform: translateX(32px); opacity: 0; } to { transform: none; opacity: 1; } }
-.pd-kopf { padding: 18px 22px 14px; border-bottom: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 10px; }
-.pd-art { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 650; color: var(--text-muted); }
+.pd-kopf { padding: 20px 24px 16px; border-bottom: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 8px; }
+.pd-art { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; color: var(--text-muted); }
.pd-art .modal-kbd { margin-left: auto; font-weight: 400; }
-.pd-kasten { width: 11px; height: 11px; border-radius: 3px; background: var(--accent); }
+.pd-kasten { width: 11px; height: 11px; border-radius: 4px; background: var(--accent); }
.pd-raute { width: 10px; height: 10px; background: var(--meilenstein, #6d4bb3); transform: rotate(45deg); margin: 0 1px; }
-.pd-zu { width: 34px; height: 34px; border-radius: 50%; border: 0; background: transparent; color: var(--text-muted); font-size: 20px; line-height: 1; padding: 0; cursor: pointer; }
+.pd-zu { width: 34px; height: 34px; border-radius: 50%; border: 0; background: transparent; color: var(--text-muted); font-size: 19px; line-height: 1; padding: 0; cursor: pointer; }
.pd-zu:hover { background: var(--surface-sunk); color: var(--text); }
-.pd-kopf .pd-titel { width: 100%; box-sizing: border-box; font-size: 17px; font-weight: 600; padding: 9px 12px; }
-.pd-inhalt { flex: 1; min-height: 0; overflow: auto; padding: 2px 22px 16px; }
-.pd-abs { display: flex; flex-direction: column; gap: 8px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
+.pd-kopf .pd-titel { width: 100%; box-sizing: border-box; font-size: 19px; font-weight: 500; padding: 8px 12px; }
+.pd-inhalt { flex: 1; min-height: 0; overflow: auto; padding: 2px 24px 16px; }
+.pd-abs { display: flex; flex-direction: column; gap: 8px; padding: 16px 0; border-bottom: 1px solid var(--line-soft); }
.pd-abs:last-child { border-bottom: 0; }
-.pd-abs > h3 { margin: 0; font-size: 12px; font-weight: 650; color: var(--text-muted); }
+.pd-abs > h3 { margin: 0; font-size: 12px; font-weight: 500; color: var(--text-muted); }
.pd-abs .range-picker-display, .pd-abs select { width: 100%; box-sizing: border-box; }
.pd-abs .field-inline { display: flex; align-items: center; gap: 8px; }
.pd-abs .field-inline .range-picker-display { flex: 1; }
@@ -1515,10 +1513,10 @@ html[data-theme="dark"] .modal-bg.als-panel { background: rgba(0,0,0,.32); }
.pd-abs .fold { margin: 0; }
.pd-fuss {
display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap;
- padding: 14px 22px calc(14px + env(safe-area-inset-bottom, 0px));
+ padding: 16px 24px calc(16px + env(safe-area-inset-bottom, 0px));
border-top: 1px solid var(--line-soft); background: var(--surface-alt);
}
-.pd-loeschen { margin-right: auto; background: transparent; border: 0; color: var(--red); padding: 8px 10px; font-weight: 500; }
+.pd-loeschen { margin-right: auto; background: transparent; border: 0; color: var(--red); padding: 8px 12px; font-weight: 500; }
.pd-loeschen:hover { background: color-mix(in srgb, var(--red) 10%, transparent); }
.pd-loeschen[hidden] { display: none; }
/* Aufwand einer Aufgabe in Stunden (zählt zur Auslastung). */
@@ -1533,19 +1531,19 @@ html[data-theme="dark"] .modal-bg.als-panel { background: rgba(0,0,0,.32); }
.pd-aufwand-zeile { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pd-stepper {
display: inline-flex; align-items: center; height: 34px; border: 1px solid var(--line);
- border-radius: var(--r-pill); background: var(--surface-sunk); overflow: hidden;
+ border-radius: 8px; background: var(--surface-sunk); overflow: hidden;
transition: border-color var(--dur, 150ms), box-shadow var(--dur, 150ms);
}
.pd-stepper:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.pd-stepper .pd-stepper-knopf {
all: unset; box-sizing: border-box; width: 32px; height: 100%; display: grid; place-items: center;
- font-size: 16px; color: var(--text-muted); cursor: pointer;
+ font-size: 15px; color: var(--text-muted); cursor: pointer;
}
.pd-stepper .pd-stepper-knopf:hover { background: var(--seg-hover); color: var(--text); }
.pd-stepper .pd-stepper-knopf:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.pd-stepper input {
width: 52px; border: 0; background: transparent; padding: 0; text-align: right;
- font: inherit; font-size: 15px; font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums;
+ font: inherit; font-size: 15px; font-weight: 500; color: var(--text); font-variant-numeric: tabular-nums;
-moz-appearance: textfield; appearance: textfield;
}
.pd-stepper input::-webkit-outer-spin-button, .pd-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
@@ -1572,7 +1570,7 @@ html[data-theme="dark"] .modal-bg.als-panel { background: rgba(0,0,0,.32); }
eine Leiste statt zwei, Menüs "Mehr" und "+ Neu", Gliederung nach
Leistungsphasen mit zuklappbaren Köpfen, Filter, Hinweis "Ohne Termin". */
.tp-leiste {
- gap: 10px; padding: 8px 10px; margin-bottom: 12px; border-radius: var(--r-lg);
+ gap: 8px; padding: 8px 12px; margin-bottom: 12px; border-radius: var(--r-lg);
background: var(--surface); border: 1px solid var(--line-soft);
}
.tp-luecke { flex: 1; }
@@ -1580,11 +1578,11 @@ html[data-theme="dark"] .modal-bg.als-panel { background: rgba(0,0,0,.32); }
.tp-zeitraum { width: 200px; }
.tp-menue { position: relative; }
.tp-menue > summary {
- list-style: none; cursor: pointer; display: inline-flex; align-items: center; min-height: 34px; padding: 0 14px;
- border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--text); font-size: 13px; user-select: none;
+ list-style: none; cursor: pointer; display: inline-flex; align-items: center; min-height: 34px; padding: 0 16px;
+ border-radius: 8px; border: 1px solid var(--line); background: var(--surface); color: var(--text); font-size: 13px; user-select: none;
}
.tp-menue > summary::-webkit-details-marker { display: none; }
-.tp-neu > summary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
+.tp-neu > summary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 500; }
.tp-menue-liste {
position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 250px; padding: 6px;
border-radius: 14px; background: var(--surface); border: 1px solid var(--line-soft); box-shadow: 0 16px 40px rgba(15,40,60,.22);
@@ -1593,13 +1591,13 @@ html[data-theme="dark"] .modal-bg.als-panel { background: rgba(0,0,0,.32); }
html.glas .tp-menue-liste { background: var(--glas-dicht); }
.tp-menue-liste.nach-rechts { right: auto; left: 0; }
.tp-menue-liste button, .tp-menue-liste label {
- display: flex; align-items: center; gap: 10px; width: 100%; min-height: 38px; padding: 0 10px; box-sizing: border-box;
- border: 0; border-radius: 9px; background: transparent; color: var(--text); font: inherit; font-size: 13.5px; font-weight: 400; text-align: left; cursor: pointer;
+ display: flex; align-items: center; gap: 8px; width: 100%; min-height: 38px; padding: 0 12px; box-sizing: border-box;
+ border: 0; border-radius: 8px; background: transparent; color: var(--text); font: inherit; font-size: 13px; font-weight: 400; text-align: left; cursor: pointer;
}
.tp-menue-liste button:hover, .tp-menue-liste label:hover { background: var(--surface-sunk); }
-.tp-menue-liste button.active { color: var(--accent); font-weight: 600; }
+.tp-menue-liste button.active { color: var(--accent); font-weight: 500; }
.tp-menue-liste hr { border: 0; border-top: 1px solid var(--line-soft); margin: 6px 4px; width: auto; }
-.tp-sym-aufgabe { width: 10px; height: 10px; border-radius: 3px; background: var(--accent); flex: none; }
+.tp-sym-aufgabe { width: 10px; height: 10px; border-radius: 4px; background: var(--accent); flex: none; }
.tp-sym-ms { width: 9px; height: 9px; background: var(--meilenstein, #7a3fb8); transform: rotate(45deg); flex: none; margin: 0 1px; }
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) .tp-neu > summary { color: #0b141b; } }
html[data-theme="dark"] .tp-neu > summary { color: #0b141b; }
@@ -1608,41 +1606,41 @@ html[data-theme="dark"] .tp-neu > summary { color: #0b141b; }
#planGanttContainer .tp-projektzeile .gantt-label { font-weight: 500; color: var(--text-muted); font-size: 12px; }
/* Phasenköpfe */
#planGanttContainer .gantt-row.gantt-phase { background: var(--surface-sunk); }
-#planGanttContainer .gantt-row.gantt-phase .gantt-label { background: var(--surface-sunk); padding-left: 6px !important; font-weight: 650 !important; color: var(--text) !important; gap: 6px; }
+#planGanttContainer .gantt-row.gantt-phase .gantt-label { background: var(--surface-sunk); padding-left: 6px !important; font-weight: 500 !important; color: var(--text) !important; gap: 6px; }
#planGanttContainer .gantt-row.gantt-phase .gantt-bar.todo { top: 50%; height: 10px; margin-top: -5px; border-radius: 999px; }
-.tp-klappen { width: 24px; height: 24px; flex: none; border: 0; border-radius: 6px; background: transparent; color: var(--text-muted); font-size: 10px; cursor: pointer; padding: 0; }
+.tp-klappen { width: 24px; height: 24px; flex: none; border: 0; border-radius: 6px; background: transparent; color: var(--text-muted); font-size: 11px; cursor: pointer; padding: 0; }
.tp-klappen:hover { background: var(--surface); color: var(--text); }
-.tp-phase-info { margin-left: auto; font-size: 11.5px; font-weight: 400; color: var(--text-muted); white-space: nowrap; }
-#planGanttContainer .gantt-row.tp-gruppe .gantt-label { font-weight: 650; color: var(--text-muted); font-size: 12px; background: var(--surface-sunk); }
+.tp-phase-info { margin-left: auto; font-size: 12px; font-weight: 400; color: var(--text-muted); white-space: nowrap; }
+#planGanttContainer .gantt-row.tp-gruppe .gantt-label { font-weight: 500; color: var(--text-muted); font-size: 12px; background: var(--surface-sunk); }
#planGanttContainer .gantt-row.tp-gruppe { background: var(--surface-sunk); min-height: 30px; }
/* Unter einem Phasenkopf eingerückt */
#planGanttContainer .gantt-row.gantt-todo:not(.gantt-phase) .gantt-label,
-#planGanttContainer .gantt-row.gantt-milestone-row .gantt-label { padding-left: 30px !important; }
+#planGanttContainer .gantt-row.gantt-milestone-row .gantt-label { padding-left: 32px !important; }
#planGanttContainer .gantt-row.gantt-zu,
#planGanttContainer .gantt-row.gantt-gefiltert { display: none; }
#planGanttContainer .gantt-row.gantt-todo.done .gantt-todo-title { text-decoration: line-through; opacity: .7; }
/* Kürzel der Zuständigen rechts in der Namensspalte */
.gantt-label .gantt-leute { margin-left: auto; display: inline-flex; flex: none; padding-left: 6px; }
.gantt-label .gantt-leute span {
- min-width: 20px; height: 20px; padding: 0 3px; box-sizing: border-box; border-radius: 999px; margin-left: -4px;
- display: inline-flex; align-items: center; justify-content: center; font-size: 8.5px; font-weight: 700;
+ min-width: 20px; height: 20px; padding: 0 4px; box-sizing: border-box; border-radius: 999px; margin-left: -4px;
+ display: inline-flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 500;
background: var(--surface-sunk); color: var(--text); border: 1.5px solid var(--surface);
}
.gantt-label .gantt-todo-title { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.gantt-vorgaenger-warn {
flex: none; width: 16px; height: 16px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
- font-size: 10px; font-weight: 800; background: color-mix(in srgb, var(--amber) 20%, transparent); color: var(--amber);
+ font-size: 11px; font-weight: 600; background: color-mix(in srgb, var(--amber) 20%, transparent); color: var(--amber);
}
/* Heute deutlicher */
#planGanttContainer .gantt-grid-today { border-left-width: 2px; opacity: 1; }
/* Hinweis auf Aufgaben ohne Termin */
.tp-ohne {
- display: flex; align-items: center; gap: 8px; width: 100%; margin-top: 8px; padding: 10px 14px; box-sizing: border-box;
+ display: flex; align-items: center; gap: 8px; width: 100%; margin-top: 8px; padding: 12px 16px; box-sizing: border-box;
border: 1px dashed var(--line); border-radius: var(--r-md); background: transparent; color: var(--text-muted); font: inherit; font-size: 13px; text-align: left; cursor: pointer;
}
.tp-ohne:hover { border-color: var(--accent); color: var(--text); }
.tp-ohne[hidden] { display: none; }
-.tp-ohne-zahl { background: var(--surface-sunk); border-radius: 999px; padding: 1px 8px; font-weight: 600; color: var(--text); }
+.tp-ohne-zahl { background: var(--surface-sunk); border-radius: 6px; padding: 1px 8px; font-weight: 500; color: var(--text); }
.tp-ohne-hinweis { margin-left: auto; font-size: 12px; }
#planGanttContainer .gantt-row.gantt-phase .gantt-todo-title { flex: 1 1 auto; min-width: 70px; }
#planGanttContainer .gantt-row.gantt-phase .tp-phase-info { flex: none; }
@@ -1671,17 +1669,17 @@ html.glas[data-theme="light"] #planSection-terminplan .tp-menue-liste { backgrou
/* Aufgabenliste: Phasen-Kennzeichen je Aufgabe und Filter */
.plan-task-phase {
- flex-shrink: 0; font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 999px;
+ flex-shrink: 0; font-size: 11px; font-weight: 500; padding: 1px 8px; border-radius: 6px;
background: var(--accent-soft); color: var(--accent); white-space: nowrap;
}
-.plan-task-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -2px 0 10px; font-size: 12px; color: var(--text-muted); }
+.plan-task-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -2px 0 8px; font-size: 12px; color: var(--text-muted); }
.plan-task-filter:empty { display: none; }
.plan-task-filter > span { margin-right: 2px; }
.plan-task-filter-btn {
- min-height: 28px; padding: 0 12px; border-radius: 999px; font: inherit; font-size: 12px;
+ min-height: 28px; padding: 0 12px; border-radius: 8px; font: inherit; font-size: 12px;
border: 1px solid var(--line); background: var(--surface); color: var(--text); cursor: pointer;
}
-.plan-task-filter-btn.is-active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); font-weight: 600; }
+.plan-task-filter-btn.is-active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); font-weight: 500; }
/* Leistungsphasen farblich von Aufgaben getrennt (Eriks Wunsch): Phasen-
balken in Blauviolett (bewusst bläulicher als das Lila der Meilensteine), Aufgaben bleiben im Akzentblau, erledigte grün,
@@ -1695,16 +1693,16 @@ html[data-theme="dark"] { --gantt-phase: #a59ef2; }
/* Aufgaben-Vorlagen je Gewerk (Admin): Gewerk-Umschalter, Spaltenkopf und
bearbeitbare Zeilen — gleiche Spalten wie die Zeile „+ Schritt". */
-.vorlagen-wahl { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 10px 0 12px; }
-.vorlagen-gewerke { display: inline-flex; gap: 4px; padding: 3px; border-radius: 999px; background: var(--surface-sunk); }
-.vorlagen-gewerk { border: 0; background: transparent; color: var(--text-muted); font: inherit; font-size: 13px; font-weight: 600;
- padding: 6px 14px; border-radius: 999px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
+.vorlagen-wahl { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 8px 0 12px; }
+.vorlagen-gewerke { display: inline-flex; gap: 4px; padding: 4px; border-radius: 8px; background: var(--surface-sunk); }
+.vorlagen-gewerk { border: 0; background: transparent; color: var(--text-muted); font: inherit; font-size: 13px; font-weight: 500;
+ padding: 6px 16px; border-radius: 6px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.vorlagen-gewerk span { font-size: 11px; font-weight: 500; opacity: .75; }
.vorlagen-gewerk.is-active { background: var(--surface); color: var(--text); box-shadow: var(--sh-1); }
.vorlagen-kopf, .vorlagen-zeile, .vorlagen-neu {
display: grid !important; grid-template-columns: minmax(0, 1fr) 80px 90px 90px 120px; gap: 8px; align-items: center;
}
-.vorlagen-kopf { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); padding: 0 6px 4px; }
+.vorlagen-kopf { font-size: 11px; letter-spacing: 0; color: var(--text-muted); padding: 0 6px 4px; }
.vorlagen-zeile input { width: 100%; box-sizing: border-box; min-width: 0; }
.vorlagen-neu input[type=text], .vorlagen-neu input[type=number] { width: 100%; min-width: 0; flex: none; box-sizing: border-box; }
.vorlagen-aktionen { display: inline-flex; gap: 4px; justify-content: flex-end; align-items: center; }
@@ -1716,7 +1714,7 @@ html[data-theme="dark"] { --gantt-phase: #a59ef2; }
.template-head-grid { grid-template-columns: 1fr; }
}
-.vorlagen-summe { font-size: 12.5px; color: var(--text-muted); padding: 6px 6px 0; }
+.vorlagen-summe { font-size: 13px; color: var(--text-muted); padding: 6px 6px 0; }
.vorlagen-summe b { color: var(--text); font-variant-numeric: tabular-nums; }
/* ---------- Termin aus Mail (js/plan/plan-mail-eintrag.js) ---------- */
@@ -1747,7 +1745,7 @@ html[data-theme="dark"] { --gantt-phase: #a59ef2; }
font: inherit; font-size: .9em; line-height: 1.4;
}
.pd-mail-hinweis {
- margin: 0 0 6px; padding: 6px 10px; border-radius: 8px;
+ margin: 0 0 6px; padding: 6px 12px; border-radius: 8px;
background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--text);
}
.plan-task-notiz { display: inline-flex; color: var(--text-subtle); }
@@ -1756,8 +1754,8 @@ html[data-theme="dark"] { --gantt-phase: #a59ef2; }
.mail-auswahl { width: min(560px, calc(100vw - 32px)); }
.mail-auswahl-liste { display: flex; flex-direction: column; gap: 4px; max-height: 50vh; overflow-y: auto; margin: 12px 0; }
.mail-auswahl-zeile {
- display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center;
- padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px;
+ display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center;
+ padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px;
}
.mail-auswahl-text { display: grid; gap: 2px; min-width: 0; }
.mail-auswahl-titel { overflow-wrap: anywhere; }
@@ -1773,7 +1771,7 @@ html[data-theme="dark"] { --gantt-phase: #a59ef2; }
}
.segmented.mail-auswahl-art button:hover { background: var(--seg-hover); color: var(--text); }
.segmented.mail-auswahl-art button[aria-pressed="true"] {
- background: var(--accent-soft); color: var(--accent); font-weight: 600;
+ background: var(--accent-soft); color: var(--accent); font-weight: 500;
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 45%, transparent);
}
@media (max-width: 520px) {
@@ -1783,8 +1781,8 @@ html[data-theme="dark"] { --gantt-phase: #a59ef2; }
/* ---------- Aufgaben-Panel: „Externe Personen“ (Kollegen außerhalb des
Projekts, todoExterneSetzen() in plan-modals.js) ---------- */
-.pd-externe { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line); display: grid; gap: 8px; }
-.pd-externe-kopf { font-size: 12px; font-weight: 600; color: var(--text-muted); }
+.pd-externe { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line); display: grid; gap: 8px; }
+.pd-externe-kopf { font-size: 12px; font-weight: 500; color: var(--text-muted); }
.pd-externe-kopf .hint { font-weight: 400; margin: 0 0 0 4px; }
#todoEditExterne:empty { display: none; }
#todoEditExterneWahl { max-width: 100%; }
@@ -1799,58 +1797,62 @@ html[data-theme="dark"] { --gantt-phase: #a59ef2; }
border: 1px solid var(--line); border-radius: var(--r-lg, 14px); background: var(--surface); overflow: hidden;
}
#planSection-notizen.notizen-zieht .notizen { outline: 2px dashed var(--accent); outline-offset: 4px; }
-.notizen-liste { display: flex; flex-direction: column; gap: 8px; padding: 14px; background: var(--surface-alt); border-right: 1px solid var(--line-soft); min-width: 0; }
+.notizen-liste { display: flex; flex-direction: column; gap: 8px; padding: 16px; background: var(--surface-alt); border-right: 1px solid var(--line-soft); min-width: 0; }
.notizen-suchzeile { display: flex; gap: 8px; }
.notizen-suche {
- flex: 1; min-width: 0; padding: 7px 12px; border: 1px solid var(--line) !important; border-radius: 999px !important;
- background: var(--surface) !important; color: var(--text); font: inherit; font-size: 12.5px; box-shadow: none !important;
+ flex: 1; min-width: 0; padding: 8px 12px; border: 1px solid var(--line) !important; border-radius: 8px;
+ background: var(--surface) !important; color: var(--text); font: inherit; font-size: 13px; box-shadow: none !important;
}
.notizen-suche:focus { outline: none; border-color: var(--accent) !important; }
-button.notizen-neu { white-space: nowrap; padding: 6px 14px; font-size: 12.5px; }
+button.notizen-neu { white-space: nowrap; padding: 6px 16px; font-size: 13px; }
.notizen-eintraege { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; max-height: 62vh; }
-.notizen-gruppe { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--text-subtle); margin: 8px 4px 4px; }
+.notizen-gruppe { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 500; letter-spacing: 0; color: var(--text-subtle); margin: 8px 4px 4px; }
.notizen-pin-punkt { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); }
button.notizen-eintrag, button.notizen-eintrag:hover, button.notizen-eintrag:active {
- all: unset; box-sizing: border-box; display: grid; gap: 2px; padding: 9px 11px; border-radius: 10px; cursor: pointer; width: 100%;
+ all: unset; box-sizing: border-box; display: grid; gap: 2px; padding: 8px 12px; border-radius: 10px; cursor: pointer; width: 100%;
transition: background var(--dur, 150ms);
}
button.notizen-eintrag:hover { background: var(--surface-sunk); }
button.notizen-eintrag:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
button.notizen-eintrag.ist-aktiv { background: var(--surface); box-shadow: inset 3px 0 0 var(--accent), var(--sh-1, 0 1px 2px rgba(0,0,0,.06)); }
-.notizen-eintrag-titel { font-weight: 600; font-size: 13px; color: var(--text); display: flex; gap: 6px; align-items: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.notizen-eintrag-titel { font-weight: 500; font-size: 13px; color: var(--text); display: flex; gap: 6px; align-items: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notizen-eintrag-text { font-size: 12px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notizen-eintrag-meta { font-size: 11px; color: var(--text-subtle); }
-.notizen-chip { flex: none; font-size: 10.5px; font-weight: 600; color: var(--accent); background: var(--accent-soft); border-radius: 999px; padding: 0 7px; }
-.notizen-leer { font-size: 12.5px; color: var(--text-subtle); padding: 10px 4px; }
+.notizen-chip { flex: none; font-size: 11px; font-weight: 500; color: var(--accent); background: var(--accent-soft); border-radius: 8px; padding: 0 8px; }
+.notizen-leer { font-size: 13px; color: var(--text-subtle); padding: 12px 4px; }
.notizen-leer.ist-fehler { color: var(--red); }
-.notizen-ablage { margin-top: auto; border: 1.5px dashed var(--line); border-radius: 10px; padding: 9px; text-align: center; font-size: 12px; color: var(--text-subtle); }
+.notizen-ablage { margin-top: auto; border: 1.5px dashed var(--line); border-radius: 10px; padding: 8px; text-align: center; font-size: 12px; color: var(--text-subtle); }
.notizen-laedt { padding: 24px; color: var(--text-subtle); }
-.notizen-editor { display: flex; flex-direction: column; gap: 12px; padding: 18px 22px; min-width: 0; }
+.notizen-editor { display: flex; flex-direction: column; gap: 12px; padding: 20px 24px; min-width: 0; }
.notizen-editor-leer { margin: auto; display: grid; gap: 6px; text-align: center; color: var(--text-muted); max-width: 320px; }
.notizen-editor-kopf { display: flex; align-items: center; gap: 8px; }
.notizen-titel {
- flex: 1; min-width: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 2px 0 !important;
+ /* 4 px Innenabstand, sonst saß der Cursor auf der Feldkante und war halb
+ verdeckt; der negative Rand hält den Titel auf seiner Linie. */
+ flex: 1; min-width: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 2px 4px !important; margin-left: -4px;
font: 600 20px/1.3 var(--font-display, inherit); color: var(--text);
}
.notizen-titel:focus { outline: none; }
.notizen-titel::placeholder { color: var(--text-subtle); }
button.notizen-symbol, button.notizen-symbol:hover, button.notizen-symbol:active {
- all: unset; box-sizing: border-box; padding: 5px 11px; border-radius: 999px; border: 1px solid var(--line);
+ all: unset; box-sizing: border-box; padding: 4px 12px; border-radius: 8px; border: 1px solid var(--line);
font-size: 12px; color: var(--text-muted); cursor: pointer; white-space: nowrap; transition: background var(--dur, 150ms);
}
button.notizen-symbol:hover { background: var(--surface-sunk); color: var(--text); }
button.notizen-symbol:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
-button.notizen-symbol.ist-an { color: var(--amber); border-color: color-mix(in srgb, var(--amber) 50%, var(--line)); font-weight: 600; }
+button.notizen-symbol.ist-an { color: var(--amber); border-color: color-mix(in srgb, var(--amber) 50%, var(--line)); font-weight: 500; }
button.notizen-symbol.ist-gefahr:hover { color: var(--red); }
-button.notizen-symbol.ist-fragend { background: var(--red); color: #fff; border-color: var(--red); }
+/* Auch beim Darüberfahren weiß auf Rot — sonst gewann .ist-gefahr:hover (rote Schrift)
+ und „Wirklich löschen?“ verschwand auf der roten Fläche. */
+button.notizen-symbol.ist-fragend, button.notizen-symbol.ist-fragend:hover { background: var(--red); color: #fff; border-color: var(--red); }
.notizen-richtext { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.notizen-text {
- flex: 1; min-height: 260px; outline: none; line-height: 1.55; font-size: 14px; color: var(--text);
+ flex: 1; min-height: 260px; outline: none; line-height: 1.55; font-size: 13px; color: var(--text);
padding: 4px 2px; overflow-wrap: anywhere;
}
.notizen-text:empty::before { content: attr(data-placeholder); color: var(--text-subtle); }
-.notizen-fuss { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-top: 1px solid var(--line-soft); padding-top: 10px; font-size: 12px; color: var(--text-subtle); }
+.notizen-fuss { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; border-top: 1px solid var(--line-soft); padding-top: 12px; font-size: 12px; color: var(--text-subtle); }
.notizen-status.ist-ok { color: var(--green); }
.notizen-status.ist-warnung { color: var(--amber); }
.notizen-status.ist-fehler { color: var(--red); }
@@ -1860,3 +1862,13 @@ button.notizen-link, button.notizen-link:hover { all: unset; cursor: pointer; co
.notizen-liste { border-right: 0; border-bottom: 1px solid var(--line-soft); }
.notizen-eintraege { max-height: 240px; }
}
+
+/* ---------- Reiter des Projektkopfs wie die Seitenleiste (11/2026) ----------
+ Eriks Meldung: das Highlight sah anders aus als im übrigen Programm. Wie
+ .sidebar-nav .nav-item: inaktiv normal und gedämpft, aktiv eine Flächen-
+ stufe mit Haarlinie und dunkler Schrift (kein Akzentblau, keine
+ Unterstreichung). Unter Glas: glas.css (.plan-kopf .plan-nav-item). */
+.plan-nav { padding: 8px 24px; gap: 2px; align-items: center; }
+.plan-nav-item { height: 32px; padding: 0 12px; border-bottom: 0; border-radius: 8px; font-weight: 400; display: inline-flex; align-items: center; }
+.plan-nav-item:hover { background: var(--surface-sunk); color: var(--text); }
+.plan-nav-item.is-active { background: var(--surface-sunk); color: var(--text); font-weight: 500; border-bottom-color: transparent; box-shadow: inset 0 0 0 1px var(--line-soft); }
diff --git a/public/styles.css b/public/styles.css
index 547c13d..d8be91d 100644
--- a/public/styles.css
+++ b/public/styles.css
@@ -1,27 +1,27 @@
/* === Design-Tokens === */
:root {
- --accent: #0071e3;
- --accent-hover: #0077ed;
- --accent-active: #006ad1;
- --accent-soft: #e8f1fd;
+ --accent: #0f5a85;
+ --accent-hover: #0d5079;
+ --accent-active: #0a4565;
+ --accent-soft: #e8f0f6;
- --text: #1d1d1f;
- --text-muted: #6e6e73;
- --text-subtle: #86868b;
+ --text: #16191d;
+ --text-muted: #4d545c;
+ --text-subtle: #69707a;
- --bg: #f5f5f7;
+ --bg: #f4f5f7;
--surface: #ffffff;
- --surface-alt: #fafafc;
- --surface-sunk: #f0f0f2;
+ --surface-alt: #f9fafb;
+ --surface-sunk: #eef0f2;
- --line: #d2d2d7;
- --line-soft: #e8e8ed;
+ --line: #dcdfe3;
+ --line-soft: #e9ebee;
- --green: #248a3d;
- --amber: #b25000;
- --red: #d70015;
- --red-hover: #e8112d;
- --red-active: #b8000f;
+ --green: #1f7a3a;
+ --amber: #a64d00;
+ --red: #c4161c;
+ --red-hover: #d42a30;
+ --red-active: #a51217;
/* Flächen des Anwesenheits-Kacheln im Zustand "anwesend" — eigene Tokens,
weil eine feste rgba-Grünfläche im Dark Mode nicht trägt. */
@@ -31,8 +31,8 @@
/* Kopfband der Wochenbericht-Karten je Änderungsart. Das Band trägt weiße
Schrift, deshalb etwas dunkler als --green (#248a3d käme nur auf
Kontrast 4,4 : 1 und bliebe damit unter den 4,5 : 1 für normalen Text). */
- --band-neu: #0071e3;
- --band-fortschritt: #22823a;
+ --band-neu: #0f5a85;
+ --band-fortschritt: #1f7a3a;
--meilenstein: #7a3fb8;
/* Gelbe Markierung neu hinzugekommener Protokoll-Punkte — bewusst eigenes
@@ -58,11 +58,11 @@
--r-md: 8px;
--r-lg: 12px;
--r-xl: 16px;
- --r-pill: 980px;
+ --r-pill: 8px;
- --sh-1: 0 1px 2px rgba(0,0,0,.04), 0 1px 3px rgba(0,0,0,.06);
- --sh-2: 0 2px 8px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.04);
- --sh-3: 0 8px 28px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.06);
+ --sh-1: 0 1px 2px rgba(16,24,32,.05);
+ --sh-2: 0 2px 8px rgba(16,24,32,.06), 0 1px 2px rgba(16,24,32,.04);
+ --sh-3: 0 8px 24px rgba(16,24,32,.10), 0 2px 6px rgba(16,24,32,.05);
--ease: cubic-bezier(.4, 0, .2, 1);
@@ -87,7 +87,7 @@
praktisch null gesetzt - dort genügt es, diese Variablen zu kippen. */
--dur: 150ms;
--dur-lg: 200ms;
- --ease-out: cubic-bezier(.2, .8, .2, 1);
+ --ease-out: cubic-bezier(.22, 1, .36, 1);
--row-lift: -1px;
--press: .97;
}
@@ -105,7 +105,8 @@ body {
line-height: 1.45;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
- letter-spacing: -0.005em;
+ letter-spacing: 0;
+ font-variant-numeric: tabular-nums;
}
.container { padding: 20px 24px; }
@@ -139,9 +140,9 @@ body {
row-gap: 8px;
gap: 12px;
padding: 8px 20px;
- background: rgba(255,255,255,.82);
- -webkit-backdrop-filter: saturate(180%) blur(20px);
- backdrop-filter: saturate(180%) blur(20px);
+ background: rgba(255,255,255,.86);
+ -webkit-backdrop-filter: blur(16px);
+ backdrop-filter: blur(16px);
border-bottom: 1px solid var(--line-soft);
}
@@ -152,9 +153,9 @@ body {
.topbar-logo { height: 28px; width: auto; object-fit: contain; }
.topbar-title {
font-size: 15px;
- font-weight: 600;
+ font-weight: 500;
margin: 0;
- letter-spacing: -0.01em;
+ letter-spacing: 0;
white-space: nowrap;
}
@@ -189,7 +190,7 @@ body {
.header-toggle {
position: relative;
z-index: 10;
- padding: 6px 10px;
+ padding: 6px 12px;
min-width: 36px;
display: inline-flex;
align-items: center;
@@ -248,7 +249,7 @@ body {
}
.user-menu-info {
- padding: 8px 10px 10px;
+ padding: 8px 12px 12px;
margin-bottom: 2px;
border-bottom: 1px solid var(--line-soft);
font-size: 12px;
@@ -266,7 +267,7 @@ button.menu-item {
text-align: left;
background: transparent;
color: var(--text);
- padding: 8px 10px;
+ padding: 8px 12px;
border: none;
border-radius: var(--r-md);
font-size: 13px;
@@ -469,30 +470,30 @@ html[data-theme="dark"] body.wandtafel-aktiv {
/* ===== Kopf: Marke "Dashboard" + Sitzung/Uhrzeit + Abwesend-Mini ===== */
.dash-kopf { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
-.dash-marke { font-family: 'Outfit', -apple-system, system-ui, sans-serif; font-weight: 600; font-size: 19px; color: var(--dash-ink); }
-.dash-kopf-rechts { display: flex; align-items: center; gap: 14px; }
-.dash-datum { font-size: 12.5px; color: var(--dash-text-muted); background: var(--dash-panel-3); padding: 4px 12px; border-radius: var(--r-pill); }
+.dash-marke { font-family: 'Outfit', -apple-system, system-ui, sans-serif; font-weight: 500; font-size: 19px; color: var(--dash-ink); }
+.dash-kopf-rechts { display: flex; align-items: center; gap: 12px; }
+.dash-datum { font-size: 13px; color: var(--dash-text-muted); background: var(--dash-panel-3); padding: 4px 12px; border-radius: 6px; }
.dash-abwesend-mini { display: flex; }
.dash-abwesend-mini.ist-klickbar { cursor: pointer; border-radius: var(--r-pill); }
.dash-abwesend-mini.ist-klickbar:hover { filter: brightness(.96); }
.dash-avatar-mini {
width: 25px; height: 25px; border-radius: 50%; background: var(--dash-panel-2); color: var(--dash-ink);
- font-size: 9.5px; font-weight: 800; display: flex; align-items: center; justify-content: center;
+ font-size: 11px; font-weight: 600; display: flex; align-items: center; justify-content: center;
margin-left: -7px; border: 2px solid var(--dash-bg);
}
.dash-avatar-mini:first-child { margin-left: 0; }
/* ===== Kennzahlen-Reihe (4 Kacheln) ===== */
-.dash-kpi-reihe { flex-shrink: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
-.dash-kpi { border-radius: var(--r-xl); padding: 16px 18px; }
+.dash-kpi-reihe { flex-shrink: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
+.dash-kpi { border-radius: var(--r-xl); padding: 16px 20px; }
.dash-kpi:nth-child(1) { background: var(--dash-panel-1); }
.dash-kpi:nth-child(2) { background: var(--dash-panel-2); }
.dash-kpi:nth-child(3) { background: var(--dash-panel-3); }
.dash-kpi:nth-child(4) { background: var(--dash-kpi-4); }
.dash-kpi.ist-klickbar { cursor: pointer; }
.dash-kpi.ist-klickbar:hover { filter: brightness(.96); }
-.dash-kpi-label { font-size: 11px; font-weight: 700; color: var(--dash-text-muted); margin-bottom: 8px; }
-.dash-kpi-wert { font-family: 'Outfit', -apple-system, system-ui, sans-serif; font-weight: 600; font-size: 32px; color: var(--dash-ink); font-variant-numeric: tabular-nums; }
+.dash-kpi-label { font-size: 11px; font-weight: 600; color: var(--dash-text-muted); margin-bottom: 8px; }
+.dash-kpi-wert { font-family: 'Outfit', -apple-system, system-ui, sans-serif; font-weight: 500; font-size: 32px; color: var(--dash-ink); font-variant-numeric: tabular-nums; }
.dash-kpi-wert.ok { color: var(--dash-ink); }
.dash-kpi-wert.info { color: var(--dash-ink-soft); }
.dash-kpi-wert.warn { color: var(--dash-warn); }
@@ -503,12 +504,12 @@ html[data-theme="dark"] body.wandtafel-aktiv {
der Inhalt verteilt sich gleichmäßig über die volle Höhe statt oben zu
kleben, damit ein dünn befülltes Panel neben einem vollen nicht leer
wirkt. */
-.dash-grid { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 14px; }
-.dash-panel { border-radius: var(--r-xl); padding: 18px 20px; display: flex; flex-direction: column; min-height: 0; }
+.dash-grid { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 12px; }
+.dash-panel { border-radius: var(--r-xl); padding: 20px 20px; display: flex; flex-direction: column; min-height: 0; }
.dash-grid > .dash-panel:nth-child(1) { background: var(--dash-panel-1); }
.dash-grid > .dash-panel:nth-child(2) { background: var(--dash-panel-2); }
.dash-grid > .dash-panel:nth-child(3) { background: var(--dash-panel-3); }
-.dash-panel-titel { flex-shrink: 0; font-size: 12px; font-weight: 700; color: var(--dash-ink); margin-bottom: 12px; }
+.dash-panel-titel { flex-shrink: 0; font-size: 12px; font-weight: 600; color: var(--dash-ink); margin-bottom: 12px; }
.dash-panel-body { flex: 1; min-height: 0; display: flex; flex-direction: column; justify-content: space-evenly; overflow: hidden; }
/* Meter-Zeilen: Auslastung je Gewerk, Wochenbericht-Fortschritt je Gewerk —
@@ -535,7 +536,7 @@ html[data-theme="dark"] body.wandtafel-aktiv {
(Neu/Überfällig/Termin). Jeder Eintrag einzeln antippbar, springt direkt
ins betroffene Projekt. */
.dash-feed-eintrag {
- display: flex; align-items: flex-start; gap: 10px; padding: 9px 2px; border-top: 1px solid var(--dash-line);
+ display: flex; align-items: flex-start; gap: 8px; padding: 8px 2px; border-top: 1px solid var(--dash-line);
cursor: pointer; border-radius: var(--r-md); transition: background .15s var(--ease);
}
.dash-feed-eintrag:first-of-type { border-top: none; padding-top: 0; }
@@ -544,8 +545,8 @@ html[data-theme="dark"] body.wandtafel-aktiv {
.dash-feed-punkt.neu { background: var(--dash-ink); }
.dash-feed-punkt.ueberfaellig { background: var(--dash-crit); }
.dash-feed-punkt.termin { background: var(--dash-warn); }
-.dash-feed-text { flex: 1; font-size: 12.5px; line-height: 1.5; color: var(--dash-text); }
-.dash-feed-zeit { display: block; font-size: 10.5px; color: var(--dash-text-subtle); margin-top: 2px; }
+.dash-feed-text { flex: 1; font-size: 13px; line-height: 1.5; color: var(--dash-text); }
+.dash-feed-zeit { display: block; font-size: 11px; color: var(--dash-text-subtle); margin-top: 2px; }
/* Vollbild-Übersichten (überfällige/offene Aufgaben, Auslastung/Besprochen
je Gewerk, Abwesenheiten) — ersetzen die Normalansicht vorübergehend
@@ -693,7 +694,7 @@ button.active {
box-shadow: none;
color: var(--text);
cursor: pointer;
- font-size: 18px;
+ font-size: 19px;
transition: background .2s var(--ease);
}
@@ -712,7 +713,7 @@ button.active {
text-decoration: none;
background: transparent;
color: var(--text-muted);
- padding: 9px 12px;
+ padding: 8px 12px;
cursor: pointer;
border: none;
border-radius: var(--r-md);
@@ -746,17 +747,16 @@ button.active {
.nav-item.active {
background: var(--accent-soft);
color: var(--accent);
- font-weight: 600;
+ font-weight: 500;
}
/* .sidebar-section-label: kleine Rubrik-Überschrift oberhalb einer Gruppe von
Sidebar-Einträgen (z. B. "Dashboard", "Navigation"). */
.sidebar-section-label {
- padding: 10px 12px 2px;
+ padding: 12px 12px 2px;
font-size: 11px;
- font-weight: 700;
- letter-spacing: .04em;
- text-transform: uppercase;
+ font-weight: 600;
+ letter-spacing: 0;
color: var(--text-muted);
}
@@ -798,8 +798,8 @@ button.active {
.sidebar-subitem {
width: 100%;
- padding-left: 34px;
- font-size: 12.5px;
+ padding-left: 36px;
+ font-size: 13px;
color: var(--text-muted);
}
.sidebar-subitem:hover { color: var(--text); }
@@ -808,7 +808,7 @@ button.active {
lösen Aktionen aus und kennen deshalb keinen dauerhaft aktiven Punkt. */
.sidebar-subitem.is-active {
color: var(--accent);
- font-weight: 600;
+ font-weight: 500;
background: var(--accent-soft);
}
.sidebar-subitem.danger { color: var(--red); }
@@ -818,14 +818,14 @@ button.active {
button {
cursor: pointer;
border: none;
- border-radius: var(--r-pill);
- padding: 7px 16px;
+ border-radius: 8px;
+ padding: 8px 16px;
font-size: 13px;
font-weight: 500;
font-family: inherit;
background: var(--accent);
color: #fff;
- letter-spacing: -0.01em;
+ letter-spacing: 0;
transition: background .2s var(--ease), transform .1s var(--ease),
box-shadow .2s var(--ease);
}
@@ -835,7 +835,7 @@ button:active { background: var(--accent-active); transform: scale(.97); }
button:focus-visible {
outline: none;
- box-shadow: 0 0 0 3px rgba(0,113,227,.35);
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}
button.secondary {
@@ -850,7 +850,7 @@ button.danger:hover { background: var(--red-hover); }
button.danger:active { background: var(--red-active); }
button.small {
- padding: 3px 10px;
+ padding: 4px 12px;
font-size: 11px;
}
@@ -858,7 +858,7 @@ select,
input[type=text],
input[type=email],
input[type=date] {
- padding: 7px 10px;
+ padding: 8px 12px;
border: 1px solid var(--line);
border-radius: var(--r-md);
font-size: 13px;
@@ -874,7 +874,7 @@ input[type=email]:focus,
input[type=date]:focus {
outline: none;
border-color: var(--accent);
- box-shadow: 0 0 0 3px rgba(0,113,227,.18);
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}
select {
@@ -898,7 +898,7 @@ select {
.role-checkboxes label {
display: flex;
align-items: center;
- gap: 5px;
+ gap: 4px;
font-size: 12px;
color: var(--text-muted);
}
@@ -917,7 +917,7 @@ table {
th,
td {
border: 1px solid var(--line-soft);
- padding: 5px 7px;
+ padding: 4px 8px;
text-align: center;
vertical-align: middle;
}
@@ -925,7 +925,7 @@ td {
thead tr:nth-child(1) th {
background: var(--surface-sunk);
color: var(--text);
- font-weight: 600;
+ font-weight: 500;
border: 1px solid var(--line);
position: sticky;
top: 0;
@@ -946,7 +946,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
min-height: 34px;
border: 1px solid var(--line-soft);
border-radius: var(--r-sm);
- padding: 5px 7px;
+ padding: 4px 8px;
font-size: 11px;
font-family: inherit;
line-height: 1.4;
@@ -961,7 +961,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.status-edit:focus {
outline: none;
border-color: var(--accent);
- box-shadow: 0 0 0 3px rgba(0,113,227,.18);
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}
.status-edit.status-new { color: var(--green); }
@@ -969,7 +969,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.status-edit p { margin: 0 0 4px; }
.status-edit p:last-child { margin-bottom: 0; }
.status-edit b,
-.status-edit strong { font-weight: 600; }
+.status-edit strong { font-weight: 500; }
/* === Kommentar-Editor im Board und im Wochenbericht ======================
Ersetzt das frühere contenteditable-Feld samt execCommand-Leiste: Textfeld
@@ -977,7 +977,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
scrollbaren Verlauf der früheren Sitzungen. Aufgebaut von
renderCommentEditor() in js/board/board.js. */
-.comment-block { display: flex; flex-direction: column; gap: 10px; }
+.comment-block { display: flex; flex-direction: column; gap: 8px; }
.comment-editor {
border: 1px solid var(--line);
@@ -991,7 +991,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
align-items: center;
gap: 8px;
flex-wrap: wrap;
- padding: 6px 10px;
+ padding: 6px 12px;
font-size: 11px;
color: var(--text-muted);
background: var(--surface-alt);
@@ -999,15 +999,15 @@ tr:nth-child(even) td { background: var(--surface-alt); }
}
.comment-head-line { border: 1px solid var(--line-soft); border-radius: var(--r-md); }
.comment-who { display: flex; align-items: center; gap: 6px; color: var(--text); font-weight: 500; }
-.comment-unknown { color: var(--text-subtle); font-weight: 400; font-style: italic; }
+.comment-unknown { color: var(--text-subtle); font-weight: 400; font-style: normal; }
.comment-sep { color: var(--text-subtle); }
.comment-av {
width: 19px; height: 19px; border-radius: 50%;
background: var(--accent); color: #fff;
display: flex; align-items: center; justify-content: center;
- font-size: 9px; font-weight: 600; flex-shrink: 0;
+ font-size: 11px; font-weight: 500; flex-shrink: 0;
}
-.comment-kbd { margin-left: auto; font-size: 10px; color: var(--text-subtle); white-space: nowrap; }
+.comment-kbd { margin-left: auto; font-size: 11px; color: var(--text-subtle); white-space: nowrap; }
/* .comment-field ist seit der Umstellung auf contenteditable (Eriks Wunsch
nach echter statt mit Sternchen markierter Fett-/Kursiv-/Farbschrift,
@@ -1018,7 +1018,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.comment-editor .comment-field {
width: 100%;
display: block;
- padding: 8px 10px;
+ padding: 8px 12px;
font-family: inherit;
font-size: 12px;
line-height: 1.5;
@@ -1044,19 +1044,19 @@ tr:nth-child(even) td { background: var(--surface-alt); }
Zusammenhängen funktionieren, ohne selbst Ecken abzurunden (mal steht sie
ganz oben in ihrer Karte, mal nicht). */
.richtext-toolbar {
- display: flex; align-items: center; gap: 8px; padding: 5px 8px;
+ display: flex; align-items: center; gap: 8px; padding: 4px 8px;
background: var(--surface-sunk); border-bottom: 1px solid var(--line-soft);
}
.richtext-btn-group { display: inline-flex; gap: 2px; }
.richtext-btn {
appearance: none; border: none; background: none; color: var(--text-muted);
- width: 22px; height: 20px; border-radius: 4px; font-size: 11px; font-weight: 700; cursor: pointer; line-height: 1;
+ width: 22px; height: 20px; border-radius: 4px; font-size: 11px; font-weight: 600; cursor: pointer; line-height: 1;
}
.richtext-btn:hover { background: var(--surface-alt); color: var(--text); }
/* "Standard": setzt die Formatierung zurück — Text statt Symbol, ein
Radiergummi-Zeichen wäre missverständlich. Bleibt auch ohne Markierung
voll sichtbar, weil er dann den ganzen Text zurücksetzt. */
-.richtext-btn.richtext-btn-loeschen { width: auto; padding: 0 6px; font-weight: 600; }
+.richtext-btn.richtext-btn-loeschen { width: auto; padding: 0 6px; font-weight: 500; }
.richtext-toolbar:not(.hat-auswahl) .richtext-btn.richtext-btn-loeschen { opacity: 1; }
.richtext-divider { width: 1px; height: 14px; background: var(--line); flex-shrink: 0; }
.richtext-farben { display: inline-flex; gap: 6px; }
@@ -1070,28 +1070,28 @@ tr:nth-child(even) td { background: var(--surface-alt); }
Solange nichts markiert ist, bleiben die Knöpfe blass und der Hinweis
fordert zum Markieren auf; .hat-auswahl (von einem selectionchange-
Lauscher gesetzt, siehe js/plan/plan-protokoll.js) dreht beides um. */
-.richtext-hinweis { margin-left: auto; font-size: 10px; color: var(--text-subtle); white-space: nowrap; }
+.richtext-hinweis { margin-left: auto; font-size: 11px; color: var(--text-subtle); white-space: nowrap; }
.richtext-toolbar:not(.hat-auswahl) .richtext-btn,
.richtext-toolbar:not(.hat-auswahl) .richtext-farbe-btn { opacity: .45; }
.richtext-toolbar.hat-auswahl { background: var(--accent-soft); }
-.richtext-toolbar.hat-auswahl .richtext-hinweis { color: var(--accent); font-weight: 600; }
+.richtext-toolbar.hat-auswahl .richtext-hinweis { color: var(--accent); font-weight: 500; }
.comment-editor-foot {
display: flex;
align-items: center;
- gap: 7px;
- padding: 7px 10px;
+ gap: 8px;
+ padding: 8px 12px;
border-top: 1px solid var(--line-soft);
background: var(--surface-alt);
}
.comment-foot-spacer { margin-left: auto; }
-.comment-dirty { font-size: 10.5px; color: var(--amber); white-space: nowrap; }
+.comment-dirty { font-size: 11px; color: var(--amber); white-space: nowrap; }
.comment-readonly {
border: 1px solid var(--line-soft);
border-radius: var(--r-md);
- padding: 7px 9px;
- font-size: 11.5px;
+ padding: 8px 8px;
+ font-size: 12px;
line-height: 1.45;
background: var(--surface);
}
@@ -1109,8 +1109,8 @@ tr:nth-child(even) td { background: var(--surface-alt); }
display: flex;
align-items: center;
gap: 8px;
- padding: 7px 10px;
- font-size: 11.5px;
+ padding: 8px 12px;
+ font-size: 12px;
color: var(--text);
user-select: none;
}
@@ -1118,22 +1118,22 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.comment-history > summary:hover { background: var(--surface-alt); }
.comment-history-caret {
color: var(--text-subtle);
- font-size: 9px;
+ font-size: 11px;
transition: transform .18s var(--ease);
}
.comment-history[open] > summary .comment-history-caret { transform: rotate(90deg); }
.comment-history-count {
margin-left: auto;
- font-size: 10.5px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
background: var(--accent-soft);
color: var(--accent);
- border-radius: var(--r-pill);
+ border-radius: 6px;
padding: 1px 8px;
font-variant-numeric: tabular-nums;
}
.comment-history-count.zero { background: var(--surface-sunk); color: var(--text-subtle); }
-.comment-history-body { border-top: 1px solid var(--line-soft); padding: 4px 10px 8px; }
+.comment-history-body { border-top: 1px solid var(--line-soft); padding: 4px 12px 8px; }
.comment-history-list {
max-height: 220px;
@@ -1146,25 +1146,25 @@ tr:nth-child(even) td { background: var(--surface-alt); }
display: flex;
align-items: center;
gap: 8px;
- margin-bottom: 3px;
- font-size: 10.5px;
+ margin-bottom: 4px;
+ font-size: 11px;
}
.comment-history-week {
- font-weight: 600;
+ font-weight: 500;
color: var(--text);
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
.comment-history-meta { color: var(--text-subtle); }
-.comment-history-text { font-size: 11.5px; line-height: 1.45; color: var(--text-muted); }
+.comment-history-text { font-size: 12px; line-height: 1.45; color: var(--text-muted); }
.comment-history-text b,
-.comment-history-text strong { font-weight: 600; color: var(--text); }
+.comment-history-text strong { font-weight: 500; color: var(--text); }
.comment-take {
margin-left: auto;
- padding: 2px 9px;
- font-size: 10px;
- border-radius: var(--r-pill);
+ padding: 2px 8px;
+ font-size: 11px;
+ border-radius: 8px;
background: transparent;
color: var(--text-muted);
border: 1px solid var(--line);
@@ -1183,7 +1183,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
backdrop-filter: saturate(180%) blur(16px);
border: 1px solid var(--line-soft);
border-radius: var(--r-md);
- padding: 3px;
+ padding: 4px;
gap: 2px;
box-shadow: var(--sh-2);
z-index: 10;
@@ -1192,7 +1192,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.status:focus-within .status-toolbar { display: flex; }
.status-toolbar button {
- padding: 3px 7px;
+ padding: 4px 8px;
font-size: 11px;
line-height: 1.2;
min-width: 24px;
@@ -1210,7 +1210,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.status-toolbar button.color-blue { color: var(--accent); }
.status-toolbar button.color-black {
color: var(--text);
- font-weight: 600;
+ font-weight: 500;
}
.locked-cell {
@@ -1263,7 +1263,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.board-row-main {
display: flex;
align-items: center;
- gap: 14px;
+ gap: 12px;
padding: 12px 16px;
cursor: pointer;
transition: background .15s var(--ease);
@@ -1281,21 +1281,21 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.board-nr {
flex-shrink: 0;
width: 64px;
- font-size: 11.5px;
+ font-size: 12px;
color: var(--text-muted);
font-family: ui-monospace, 'SF Mono', monospace;
}
.board-name-wrap { flex: 1 1 260px; min-width: 0; }
.board-name {
- font-weight: 600;
- letter-spacing: -0.01em;
+ font-weight: 500;
+ letter-spacing: 0;
cursor: pointer;
}
.board-name:hover { color: var(--accent); text-decoration: underline; }
.board-status-line {
- margin-top: 3px;
+ margin-top: 4px;
font-size: 12px;
color: var(--text-muted);
display: flex;
@@ -1330,9 +1330,9 @@ tr:nth-child(even) td { background: var(--surface-alt); }
display: inline-flex;
align-items: center;
justify-content: center;
- font-size: 10px;
- font-weight: 700;
- letter-spacing: -0.02em;
+ font-size: 11px;
+ font-weight: 600;
+ letter-spacing: 0;
color: var(--text-muted);
background: var(--surface-sunk);
border: 1px solid var(--line-soft);
@@ -1352,10 +1352,10 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.phase-pill {
flex-shrink: 0;
font-size: 11px;
- font-weight: 600;
+ font-weight: 500;
font-family: ui-monospace, 'SF Mono', monospace;
- padding: 4px 10px;
- border-radius: var(--r-pill);
+ padding: 4px 12px;
+ border-radius: 6px;
background: var(--accent-soft);
color: var(--accent);
white-space: nowrap;
@@ -1364,7 +1364,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
/* --- Detailpanel (.board-drawer) --- */
.board-drawer {
- padding: 18px 24px 22px;
+ padding: 20px 24px 24px;
background: var(--surface-alt);
border-top: 1px solid var(--line-soft);
}
@@ -1372,9 +1372,8 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.board-drawer h4 {
margin: 0 0 8px;
font-size: 11px;
- font-weight: 700;
- text-transform: uppercase;
- letter-spacing: .05em;
+ font-weight: 600;
+ letter-spacing: 0;
color: var(--text-muted);
}
@@ -1391,7 +1390,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
grid-template-columns: 1fr;
grid-template-areas: "kommentar" "lph" "beteiligte";
align-content: start;
- gap: 18px;
+ gap: 16px;
}
.drawer-col-comment { grid-area: kommentar; }
.drawer-col-lph { grid-area: lph; }
@@ -1404,7 +1403,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.beauftragte-lp-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
- gap: 4px 10px;
+ gap: 4px 8px;
}
.beauftragte-lp-item {
display: flex;
@@ -1422,7 +1421,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.report-list {
display: flex;
flex-direction: column;
- gap: 10px;
+ gap: 8px;
}
.report-card {
background: var(--surface);
@@ -1439,9 +1438,9 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.report-card-head {
display: flex;
align-items: center;
- gap: 10px;
+ gap: 8px;
flex-wrap: wrap;
- padding: 9px 14px;
+ padding: 8px 16px;
background: var(--surface-alt);
border-bottom: 1px solid var(--line-soft);
}
@@ -1455,7 +1454,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
color: #fff;
}
.report-band .board-nr { color: rgba(255,255,255,.75); }
-.report-band .board-name { color: #fff; font-weight: 600; }
+.report-band .board-name { color: #fff; font-weight: 500; }
.report-band .board-name:hover { text-decoration: underline; }
.report-band .tag-chip {
background: rgba(255,255,255,.22);
@@ -1471,14 +1470,14 @@ tr:nth-child(even) td { background: var(--surface-alt); }
nebeneinander, wodurch die Karte flacher wird. Dasselbe Markup wie im
Projektboard, nur anders angeordnet. */
.report-card .board-drawer {
- padding: 14px 16px 16px;
+ padding: 16px 16px 16px;
border-top: none;
background: var(--surface);
}
.report-card .board-drawer-grid {
grid-template-columns: 1.7fr 1fr 1fr;
grid-template-areas: "kommentar lph beteiligte";
- gap: 22px;
+ gap: 20px;
}
.report-card .board-role-label { width: 58px; }
@@ -1506,26 +1505,26 @@ tr:nth-child(even) td { background: var(--surface-alt); }
(.bericht-disclosure, weiter unten) — sie ist eine Sitzungs-, keine
Projekt-Angabe und sitzt ohnehin außerhalb dieser Karte am Seitenfuß. */
.board-drawer-dicht { padding: 0; background: transparent; border-top: none; }
-.bericht-meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line-soft); }
+.bericht-meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line-soft); }
@media (max-width: 860px) { .bericht-meta-grid { grid-template-columns: 1fr; gap: 16px; } }
-.bericht-meta-label { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-subtle); margin-bottom: 8px; }
+.bericht-meta-label { font-size: 11px; font-weight: 600; letter-spacing: 0; color: var(--text-subtle); margin-bottom: 8px; }
.bericht-disclosure {
border: 1px solid var(--line-soft);
border-radius: var(--r-md);
- margin-top: 10px;
+ margin-top: 8px;
overflow: hidden;
background: var(--surface);
}
.bericht-disclosure summary {
list-style: none;
cursor: pointer;
- padding: 10px 14px;
+ padding: 12px 16px;
display: flex;
align-items: center;
gap: 8px;
font-size: 12px;
- font-weight: 650;
+ font-weight: 500;
color: var(--text-muted);
}
.bericht-disclosure summary::-webkit-details-marker { display: none; }
@@ -1544,21 +1543,21 @@ tr:nth-child(even) td { background: var(--surface-alt); }
}
.bericht-disclosure[open] summary .chev { transform: rotate(90deg); }
.bericht-disclosure[open] summary { border-bottom: 1px solid var(--line-soft); }
-.bericht-disclosure-body { padding: 10px 14px 12px; }
+.bericht-disclosure-body { padding: 12px 16px 12px; }
/* Der Kommentar bleibt das größte Element der dichten Fassung — etwas
größere Schrift als im Projektboard, wo er eine Spalte unter mehreren
teilt. Radius/Schatten wie eine freistehende Karte (Entwurf "Fokus-Modus"). */
.board-drawer-dicht .comment-editor .comment-field,
-.board-drawer-dicht .comment-readonly { font-size: 14px; line-height: 1.6; min-height: 76px; }
+.board-drawer-dicht .comment-readonly { font-size: 13px; line-height: 1.6; min-height: 76px; }
/* .comment-editor hat bereits overflow:hidden (Basis-Regel) — ein größerer
Radius hier genügt, Kopf/Fuß werden automatisch mitgerundet. */
.board-drawer-dicht .comment-editor { border-radius: var(--r-lg); box-shadow: var(--sh-1); }
.board-lph-leiste {
display: flex;
- gap: 3px;
+ gap: 4px;
align-items: stretch;
}
.board-lph-cell {
@@ -1568,7 +1567,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
flex-direction: column;
align-items: center;
gap: 1px;
- padding: 3px 2px 4px;
+ padding: 4px 2px 4px;
border: 1px solid var(--line-soft);
border-radius: var(--r-sm);
background: var(--surface-sunk);
@@ -1578,8 +1577,8 @@ tr:nth-child(even) td { background: var(--surface-alt); }
background-repeat: no-repeat;
}
.board-lph-cell-label {
- font-size: 10px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
color: var(--text-muted);
line-height: 1.2;
}
@@ -1590,7 +1589,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
border: none;
background: transparent;
text-align: center;
- font-size: 11.5px;
+ font-size: 12px;
font-variant-numeric: tabular-nums;
color: var(--text);
font-family: inherit;
@@ -1598,7 +1597,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.board-lph-cell input:focus {
outline: 1.5px solid var(--accent);
outline-offset: -1px;
- border-radius: 3px;
+ border-radius: 4px;
}
.board-lph-cell.lp-aktiv {
border-color: var(--accent);
@@ -1622,7 +1621,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.board-drawer-dicht .board-role-mini .board-role-row {
display: flex;
align-items: flex-start;
- gap: 7px;
+ gap: 8px;
margin-bottom: 4px;
}
.board-drawer-dicht .board-role-mini .board-role-label {
@@ -1631,10 +1630,9 @@ tr:nth-child(even) td { background: var(--surface-alt); }
Versalien diese Breite — bei 88 px fehlte der letzte Buchstabe. */
width: 104px;
padding-top: 4px;
- font-size: 10px;
+ font-size: 11px;
line-height: 1.25;
- letter-spacing: .02em;
- text-transform: uppercase;
+ letter-spacing: 0;
}
/* Schmale Fenster: Dort reicht die Breite für Label UND Kürzel nicht mehr,
@@ -1652,9 +1650,9 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.report-reason-badge {
margin-left: auto;
font-size: 11px;
- font-weight: 600;
- padding: 3px 10px;
- border-radius: var(--r-pill);
+ font-weight: 500;
+ padding: 4px 12px;
+ border-radius: 6px;
background: var(--accent-soft);
color: var(--accent);
white-space: nowrap;
@@ -1676,15 +1674,15 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.board-lph-list {
display: flex;
flex-direction: column;
- gap: 7px;
- margin-top: 14px;
+ gap: 8px;
+ margin-top: 12px;
}
.board-lph-row {
display: grid;
grid-template-columns: 42px 1fr 50px;
align-items: center;
- gap: 10px;
+ gap: 8px;
}
.board-lph-row.is-ansicht{ cursor: default; }
@@ -1696,7 +1694,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
color: var(--text-muted);
}
-.board-lph-row.lp-aktiv .board-lph-label { color: var(--accent); font-weight: 600; }
+.board-lph-row.lp-aktiv .board-lph-label { color: var(--accent); font-weight: 500; }
/* Der Prozentwert einer Leistungsphase an der Stelle des Eingabefeldes. Die
Breite entspricht dem Feld, damit die Balken aller Zeilen gleich weit
@@ -1709,22 +1707,22 @@ tr:nth-child(even) td { background: var(--surface-alt); }
color: var(--text-muted);
}
-.board-role-mini { display: flex; flex-direction: column; gap: 10px; }
-.board-role-mini .board-role-row { display: flex; align-items: center; gap: 10px; }
+.board-role-mini { display: flex; flex-direction: column; gap: 8px; }
+.board-role-mini .board-role-row { display: flex; align-items: center; gap: 8px; }
.board-role-mini .board-role-label {
width: 100px;
flex-shrink: 0;
- font-size: 11.5px;
+ font-size: 12px;
color: var(--text-muted);
}
.board-role-mini .board-role-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.section-title {
- font-size: 17px;
- font-weight: 600;
- margin: 24px 0 10px;
+ font-size: 19px;
+ font-weight: 500;
+ margin: 24px 0 8px;
color: var(--text);
- letter-spacing: -0.02em;
+ letter-spacing: 0;
line-height: 1.2;
}
@@ -1756,19 +1754,18 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.load-rolle { width: 100%; }
.load-rolle-titel {
- font-size: 14px;
- font-weight: 600;
+ font-size: 13px;
+ font-weight: 500;
margin: 0 0 6px;
color: var(--text-muted);
- text-transform: uppercase;
- letter-spacing: .04em;
+ letter-spacing: 0;
}
.load-zeile {
display: flex;
align-items: center;
gap: 16px;
- padding: 11px 4px;
+ padding: 12px 4px;
border-bottom: 1px solid var(--line-soft);
}
.load-zeile:last-child { border-bottom: none; }
@@ -1814,10 +1811,10 @@ tr:nth-child(even) td { background: var(--surface-alt); }
display: flex;
align-items: center;
height: 100%;
- padding: 0 7px;
+ padding: 0 8px;
min-width: 3px;
- font-size: 10px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
color: #fff;
white-space: nowrap;
overflow: hidden;
@@ -1831,22 +1828,22 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.load-band-leer {
font-size: 11px;
color: var(--text-subtle);
- padding-left: 9px;
+ padding-left: 8px;
}
.load-wert {
flex: 0 0 62px;
text-align: right;
font-size: 19px;
- font-weight: 600;
- letter-spacing: -.02em;
+ font-weight: 500;
+ letter-spacing: 0;
font-variant-numeric: tabular-nums;
}
.load-anbahnung {
- font-size: 10px;
- padding: 1px 7px;
- border-radius: var(--r-pill);
+ font-size: 11px;
+ padding: 1px 8px;
+ border-radius: 6px;
background: var(--surface-sunk);
color: var(--text-muted);
white-space: nowrap;
@@ -1860,18 +1857,18 @@ tr:nth-child(even) td { background: var(--surface-alt); }
align-items: center;
gap: 16px;
flex-wrap: wrap;
- padding: 12px 14px;
+ padding: 12px 16px;
background: var(--surface-sunk);
border-radius: var(--r-lg);
font-size: 13px;
}
.load-kopf-zahl strong {
- font-size: 17px;
+ font-size: 19px;
font-variant-numeric: tabular-nums;
}
.load-kopf-warnung {
color: var(--red);
- font-weight: 600;
+ font-weight: 500;
}
.load-kopf-warnung::before {
content: '';
@@ -1879,12 +1876,12 @@ tr:nth-child(even) td { background: var(--surface-alt); }
width: 7px; height: 7px;
border-radius: 50%;
background: var(--red);
- margin-right: 7px;
+ margin-right: 8px;
vertical-align: middle;
}
.load-luecken {
- padding: 12px 14px;
+ padding: 12px 16px;
border: 1px dashed var(--line);
border-radius: var(--r-lg);
font-size: 12px;
@@ -1902,7 +1899,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
/* Summenzeile je Mensch: ein durchgehender Riegel statt der Projektsegmente.
Sie beantwortet die Frage, die die Rollenzeilen nicht beantworten können —
wer in drei Rollen arbeitet, hat trotzdem nur eine Arbeitswoche. */
-.load-zeile-summe .load-wer-name { font-weight: 600; }
+.load-zeile-summe .load-wer-name { font-weight: 500; }
.load-seg-summe { border-right: none; }
/* Marke der vollen Kapazität im Band. Sie sitzt am rechten Rand, weil das
@@ -1927,7 +1924,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.load-legende-item em {
font-style: normal;
color: var(--text-subtle);
- margin-left: 3px;
+ margin-left: 4px;
}
/* Legende der Projektfarben, nur für die tatsächlich vorkommenden Projekte.
@@ -1936,7 +1933,7 @@ tr:nth-child(even) td { background: var(--surface-alt); }
display: flex;
flex-wrap: wrap;
gap: 6px 16px;
- padding-top: 14px;
+ padding-top: 16px;
border-top: 1px solid var(--line-soft);
font-size: 11px;
color: var(--text-muted);
@@ -1949,33 +1946,32 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.load-legende-item i {
width: 9px;
height: 9px;
- border-radius: 2px;
+ border-radius: 4px;
flex: 0 0 auto;
}
@media (max-width: 720px) {
.load-wer { flex-basis: 128px; }
- .load-zeile { gap: 10px; }
- .load-wert { flex-basis: 52px; font-size: 16px; }
+ .load-zeile { gap: 8px; }
+ .load-wert { flex-basis: 52px; font-size: 15px; }
}
.load-row-title {
grid-column: 1 / -1;
width: 100%;
- font-size: 14px;
- font-weight: 600;
+ font-size: 13px;
+ font-weight: 500;
margin: 0 0 2px 0;
padding-top: 4px;
color: var(--text-muted);
- text-transform: uppercase;
- letter-spacing: .04em;
+ letter-spacing: 0;
}
.load-card {
background: var(--surface);
border: 1px solid var(--line-soft);
border-radius: var(--r-xl);
- padding: 20px 22px;
+ padding: 20px 24px;
min-width: 0;
width: 100%;
box-shadow: var(--sh-2);
@@ -1989,24 +1985,24 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.load-card h3 {
margin: 0 0 4px;
- font-size: 14px;
- font-weight: 600;
- letter-spacing: -0.01em;
+ font-size: 13px;
+ font-weight: 500;
+ letter-spacing: 0;
line-height: 1.25;
}
.load-num {
font-size: 30px;
- font-weight: 600;
+ font-weight: 500;
color: var(--text);
- letter-spacing: -0.03em;
+ letter-spacing: 0;
line-height: 1.1;
}
.load-detail {
font-size: 11px;
color: var(--text-muted);
- margin-top: 10px;
+ margin-top: 8px;
}
.load-detail div {
@@ -2049,17 +2045,17 @@ tr:nth-child(even) td { background: var(--surface-alt); }
.modal h2 {
margin-top: 0;
- font-size: 20px;
- font-weight: 600;
- letter-spacing: -0.02em;
+ font-size: 19px;
+ font-weight: 500;
+ letter-spacing: 0;
line-height: 1.15;
}
.form-row {
- margin-bottom: 14px;
+ margin-bottom: 12px;
display: flex;
flex-direction: column;
- gap: 5px;
+ gap: 4px;
}
.form-row label {
@@ -2099,7 +2095,7 @@ select:disabled:hover {
color: #fff;
font-size: 13px;
line-height: 1.45;
- padding: 11px 15px;
+ padding: 12px 16px;
border-radius: var(--r-md);
box-shadow: var(--sh-3);
}
@@ -2110,13 +2106,13 @@ select:disabled:hover {
.lock-notice {
display: flex;
align-items: center;
- gap: 10px;
+ gap: 8px;
flex-wrap: wrap;
background: var(--surface-alt);
border: 1px solid var(--red);
color: var(--red);
border-radius: var(--r-md);
- padding: 9px 13px;
+ padding: 8px 12px;
margin-bottom: 12px;
font-size: 13px;
}
@@ -2138,17 +2134,17 @@ select:disabled:hover {
}
.lp-matrix th.lp-lph {
font-size: 12px;
- font-weight: 600;
+ font-weight: 500;
text-align: left;
padding: 6px 8px;
white-space: nowrap;
}
.lp-matrix td {
- padding: 3px 8px;
+ padding: 4px 8px;
}
.lp-matrix td input[type=text] {
width: 64px;
- padding: 4px 7px;
+ padding: 4px 8px;
font-size: 13px;
}
.lp-matrix tbody th.lp-lph,
@@ -2179,7 +2175,7 @@ select:disabled:hover {
background: var(--surface);
border: 1px solid var(--line-soft);
border-radius: var(--r-xl);
- padding: 20px 22px;
+ padding: 20px 24px;
box-shadow: var(--sh-2);
transition: box-shadow .2s var(--ease);
}
@@ -2371,13 +2367,13 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
der Footer als Ganzes soll rechtsbündig sein. */
.project-card-footer button { margin-left: 0; }
-.tag-input { width: 110px; font-size: 12px; padding: 3px 8px; }
+.tag-input { width: 110px; font-size: 12px; padding: 4px 8px; }
/* === Hinweise & Hilfsklassen === */
.legend {
font-size: 11px;
color: var(--text-muted);
- margin: 10px 0;
+ margin: 8px 0;
display: flex;
gap: 16px;
flex-wrap: wrap;
@@ -2386,7 +2382,7 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
.legend span {
display: inline-flex;
align-items: center;
- gap: 5px;
+ gap: 4px;
}
@@ -2400,13 +2396,13 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
anwesend, Tabelle attendance); der Zähler in der Kopfzeile macht sichtbar,
wenn noch niemand geklickt hat. */
#weekAttendance .bericht-disclosure { margin-top: 16px; }
-.attendance-actions { display: flex; gap: 8px; margin-bottom: 10px; }
+.attendance-actions { display: flex; gap: 8px; margin-bottom: 8px; }
.attendance-grid {
display: flex;
flex-wrap: wrap;
gap: 8px;
- padding: 12px 14px;
+ padding: 12px 16px;
}
.attendance-tile {
@@ -2416,7 +2412,7 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
align-items: center;
gap: 4px;
width: 84px;
- padding: 9px 5px 8px;
+ padding: 8px 4px 8px;
border: 1px solid var(--line);
border-radius: var(--r-md);
background: var(--surface);
@@ -2435,17 +2431,17 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
background: var(--surface-sunk);
color: var(--text-muted);
display: flex; align-items: center; justify-content: center;
- font-size: 11px; font-weight: 600;
+ font-size: 11px; font-weight: 500;
transition: background .15s var(--ease), color .15s var(--ease);
}
.attendance-name {
- font-size: 10.5px;
+ font-size: 11px;
line-height: 1.25;
text-align: center;
word-break: break-word;
}
.attendance-note {
- font-size: 9.5px;
+ font-size: 11px;
color: var(--amber);
line-height: 1.2;
text-align: center;
@@ -2456,7 +2452,7 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
position: absolute;
top: 4px; right: 6px;
font-size: 11px;
- font-weight: 700;
+ font-weight: 600;
color: var(--green);
line-height: 1;
}
@@ -2496,7 +2492,7 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
/* Fehlermeldung direkt am Formularfeld (Passwort-Dialog, Aufgaben-Dialog)
statt als alert() — der Fehler steht dort, wo er entstanden ist. */
-.field-error { font-size: 11.5px; color: var(--red); }
+.field-error { font-size: 12px; color: var(--red); }
.hint {
color: var(--text-subtle);
@@ -2507,7 +2503,7 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
.del-proj {
color: var(--red);
cursor: pointer;
- font-weight: 600;
+ font-weight: 500;
}
.lock-notice button { margin-left: 12px; }
@@ -2516,10 +2512,10 @@ a.secondary:hover { background: var(--surface-sunk); border-color: var(--text-su
input[type=text].edit-name {
border: 1px solid transparent;
background: transparent;
- font-weight: 600;
+ font-weight: 500;
width: 100%;
font-size: 12px;
- padding: 3px 5px;
+ padding: 4px 4px;
border-radius: var(--r-sm);
transition: background .15s var(--ease), border-color .15s var(--ease), box-shadow .15s var(--ease);
}
@@ -2529,7 +2525,7 @@ input[type=text].edit-name:hover { background: rgba(0,0,0,.03); }
input[type=text].edit-name:focus {
background: var(--surface);
border-color: var(--accent);
- box-shadow: 0 0 0 3px rgba(0,113,227,.18);
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
outline: none;
}
@@ -2554,102 +2550,97 @@ input[type=text].edit-name:focus {
html:not([data-theme="light"]) { color-scheme: dark; }
html:not([data-theme="light"]) {
- /* Auf Eriks Wunsch ("das gesamte dark mode Farbschema an das der
- Wandtafel anpassen") übernimmt der GESAMTE App-Dark-Mode die
- Logo-Blau-Familie des Dashboards (--dash-* in body.wandtafel-aktiv
- weiter oben) statt des vorherigen, generischen Apple-Blaus — alle
- Komponenten der App lesen ausschließlich über diese Tokens, eine
- Änderung hier genügt also für die ganze Anwendung. Rot/Gelb/Grün
- bleiben als eigenständige Statusfarben bestehen (müssen unabhängig
- von der Markenfarbe sofort erkennbar sein, siehe Ampel-Logik in
- js/load/load.js), nur in denselben gedeckteren Tönen wie am Dashboard. */
- --accent: #7fc3dd;
- --accent-hover: #96cfe3;
- --accent-active: #5fa3c0;
- --accent-soft: #16222c;
+ /* „Bauplan“ (unslop-Überarbeitung, Eriks Wahl „volle Überarbeitung“):
+ Flächen fast neutral (Graphit, leicht kühl), die Farbe tragen der
+ Akzent (Logo-Blau) und die Inhalte — Terminplan, Auslastung, Status.
+ Ersetzt die frühere Logo-Blau-Fläche aus der Wandtafel; die Wandtafel
+ selbst behält ihre eigenen dash- und wt-Tokens. */
+ --accent: #86bfdf;
+ --accent-hover: #9dcbe5;
+ --accent-active: #6aa9cc;
+ --accent-soft: #1b2731;
- --text: #e7eef3;
- --text-muted: #9fb3c0;
- --text-subtle: #70838f;
+ --text: #eceef0;
+ --text-muted: #a5abb2;
+ --text-subtle: #878d95;
- --bg: #10181f;
- --surface: #141c23;
- --surface-alt: #16222c;
- --surface-sunk: #1c2730;
+ --bg: #121416;
+ --surface: #181a1d;
+ --surface-alt: #1c1f22;
+ --surface-sunk: #23262a;
- --line: #2c3e49;
- --line-soft: #1f2b33;
+ --line: #2e3237;
+ --line-soft: #22262a;
- --green: #4cd080;
- --amber: #e8a15c;
- --red: #ef6f63;
- --red-hover: #f58a7f;
- --red-active: #c65349;
+ --green: #4cc38a;
+ --amber: #e0a159;
+ --red: #e5484d;
+ --red-hover: #ee6a6e;
+ --red-active: #c23a3f;
- --attend-bg: rgba(76,208,128,.14);
- --attend-bg-hover: rgba(76,208,128,.22);
+ --attend-bg: rgba(76,195,138,.14);
+ --attend-bg-hover: rgba(76,195,138,.22);
/* Auf Weiß gesetzt — deshalb dunkler als --band-neu/--green gebraucht
(Kontrastgrund wie im Hell-Modus): --band-neu ist das dunkle
Logo-Blau selbst (dasselbe #116896 wie am Dashboard). */
- --band-neu: #116896;
- --band-fortschritt: #1f7a4f;
- --meilenstein: #c19cf0;
+ --band-neu: #0f5a85;
+ --band-fortschritt: #1f7a3a;
--meilenstein: #c19cf0;
--protokoll-neu-bg: rgba(255,214,10,.14);
--protokoll-neu-border: #ffd60a;
- --sh-1: 0 1px 2px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.4);
- --sh-2: 0 2px 10px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.4);
- --sh-3: 0 12px 40px rgba(0,0,0,.7), 0 2px 10px rgba(0,0,0,.5);
+ --sh-1: 0 1px 2px rgba(0,0,0,.4);
+ --sh-2: 0 2px 8px rgba(0,0,0,.45);
+ --sh-3: 0 12px 32px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.35);
}
}
html[data-theme="dark"] {
color-scheme: dark;
- --accent: #7fc3dd;
- --accent-hover: #96cfe3;
- --accent-active: #5fa3c0;
- --accent-soft: #16222c;
+ --accent: #86bfdf;
+ --accent-hover: #9dcbe5;
+ --accent-active: #6aa9cc;
+ --accent-soft: #1b2731;
- --text: #e7eef3;
- --text-muted: #9fb3c0;
- --text-subtle: #70838f;
+ --text: #eceef0;
+ --text-muted: #a5abb2;
+ --text-subtle: #878d95;
- --bg: #10181f;
- --surface: #141c23;
- --surface-alt: #16222c;
- --surface-sunk: #1c2730;
+ --bg: #121416;
+ --surface: #181a1d;
+ --surface-alt: #1c1f22;
+ --surface-sunk: #23262a;
- --line: #2c3e49;
- --line-soft: #1f2b33;
+ --line: #2e3237;
+ --line-soft: #22262a;
- --green: #4cd080;
- --amber: #e8a15c;
- --red: #ef6f63;
- --red-hover: #f58a7f;
- --red-active: #c65349;
+ --green: #4cc38a;
+ --amber: #e0a159;
+ --red: #e5484d;
+ --red-hover: #ee6a6e;
+ --red-active: #c23a3f;
- --attend-bg: rgba(76,208,128,.14);
- --attend-bg-hover: rgba(76,208,128,.22);
+ --attend-bg: rgba(76,195,138,.14);
+ --attend-bg-hover: rgba(76,195,138,.22);
- --band-neu: #116896;
- --band-fortschritt: #1f7a4f;
+ --band-neu: #0f5a85;
+ --band-fortschritt: #1f7a3a;
--protokoll-neu-bg: rgba(255,214,10,.14);
--protokoll-neu-border: #ffd60a;
- --sh-1: 0 1px 2px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.4);
- --sh-2: 0 2px 10px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.4);
- --sh-3: 0 12px 40px rgba(0,0,0,.7), 0 2px 10px rgba(0,0,0,.5);
+ --sh-1: 0 1px 2px rgba(0,0,0,.4);
+ --sh-2: 0 2px 8px rgba(0,0,0,.45);
+ --sh-3: 0 12px 32px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.35);
}
/* Gemeinsame Dark-Style-Regeln (System oder manuell) */
@media (prefers-color-scheme: dark) {
html:not([data-theme="light"]) .app-topbar {
- background: rgba(28,28,30,.75);
+ background: rgba(18,20,22,.84);
border-bottom: 1px solid var(--line);
}
html:not([data-theme="light"]) .toolbar-divider { background: var(--line); }
@@ -2685,7 +2676,7 @@ html[data-theme="dark"] {
html:not([data-theme="light"]) .nav-item:hover { background: rgba(255,255,255,.08); }
html:not([data-theme="light"]) .nav-item.active { background: var(--accent-soft); }
- html:not([data-theme="light"]) button:focus-visible { box-shadow: 0 0 0 3px rgba(10,132,255,.45); }
+ html:not([data-theme="light"]) button:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 40%, transparent); }
html:not([data-theme="light"]) button.secondary { background: rgba(255,255,255,.10); color: var(--text); }
html:not([data-theme="light"]) button.secondary:hover { background: rgba(255,255,255,.15); }
html:not([data-theme="light"]) button.secondary:active { background: rgba(255,255,255,.20); }
@@ -2759,7 +2750,7 @@ html[data-theme="dark"] {
}
html[data-theme="dark"] .app-topbar {
- background: rgba(28,28,30,.75);
+ background: rgba(18,20,22,.84);
border-bottom: 1px solid var(--line);
}
html[data-theme="dark"] .toolbar-divider { background: var(--line); }
@@ -2795,7 +2786,7 @@ html[data-theme="dark"] .topbar-logo { filter: brightness(.92); }
html[data-theme="dark"] .nav-item:hover { background: rgba(255,255,255,.08); }
html[data-theme="dark"] .nav-item.active { background: var(--accent-soft); }
-html[data-theme="dark"] button:focus-visible { box-shadow: 0 0 0 3px rgba(10,132,255,.45); }
+html[data-theme="dark"] button:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 40%, transparent); }
html[data-theme="dark"] button.secondary { background: rgba(255,255,255,.10); color: var(--text); }
html[data-theme="dark"] button.secondary:hover { background: rgba(255,255,255,.15); }
html[data-theme="dark"] button.secondary:active { background: rgba(255,255,255,.20); }
@@ -2985,7 +2976,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
top: 0;
bottom: 0;
border-right: 1px solid var(--line-soft);
- font-size: 10px;
+ font-size: 11px;
color: var(--text-muted);
padding: 2px 4px;
white-space: nowrap;
@@ -2995,7 +2986,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.gantt-month {
background: var(--surface-sunk);
- font-weight: 600;
+ font-weight: 500;
}
.gantt-day {
@@ -3010,7 +3001,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
}
.gantt-day.gantt-week {
- font-weight: 600;
+ font-weight: 500;
color: var(--text);
border-right: 1px solid var(--line);
}
@@ -3152,7 +3143,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
}
.gantt-todo-add input[type=text],
.gantt-todo-add input[type=date] {
- padding: 4px 7px;
+ padding: 4px 8px;
font-size: 12px;
}
.gantt-todo-add input[type=text] {
@@ -3217,16 +3208,16 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.gantt-dep-path.highlight {
stroke-width: 3.5px;
opacity: 1;
- filter: drop-shadow(0 0 3px rgba(0, 113, 227, 0.4));
+
}
.gantt-dep-badge {
display: inline-flex;
align-items: center;
- gap: 3px;
- font-size: 10px;
+ gap: 4px;
+ font-size: 11px;
padding: 1px 6px;
- border-radius: var(--r-pill);
+ border-radius: 6px;
background: var(--accent-soft);
color: var(--accent);
margin-left: 6px;
@@ -3235,7 +3226,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: middle;
- border: 1px solid rgba(0, 113, 227, 0.2);
+ border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
}
.gantt-dep-badge.conflict {
@@ -3244,8 +3235,8 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
border-color: rgba(215, 0, 21, 0.2);
}
.gantt-todo-actions button {
- padding: 2px 7px;
- font-size: 10px;
+ padding: 2px 8px;
+ font-size: 11px;
}
.gantt-milestone {
@@ -3266,7 +3257,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
position: absolute;
top: 16px;
transform: translateX(-50%);
- font-size: 10px;
+ font-size: 11px;
color: var(--text-muted);
white-space: nowrap;
pointer-events: none;
@@ -3318,7 +3309,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
border: 1px solid var(--line);
border-radius: var(--r-lg);
box-shadow: var(--sh-3);
- padding: 10px;
+ padding: 12px;
font-size: 13px;
}
@@ -3330,7 +3321,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
}
.range-picker-title {
- font-weight: 600;
+ font-weight: 500;
font-size: 13px;
}
@@ -3349,7 +3340,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
/* KW-Spalte: klein und gedämpft, damit die Tage die Hauptsache bleiben. */
.range-picker-kw {
display: grid; place-items: center;
- font-size: 10px; font-weight: 600; color: var(--text-subtle);
+ font-size: 11px; font-weight: 500; color: var(--text-subtle);
border-right: 1px solid var(--line-soft);
font-variant-numeric: tabular-nums;
}
@@ -3357,15 +3348,15 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.range-picker-weekday {
text-align: center;
- font-size: 10px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
color: var(--text-muted);
padding: 2px 0;
}
.range-picker-day {
text-align: center;
- padding: 5px 0;
+ padding: 4px 0;
border-radius: var(--r-sm);
cursor: pointer;
user-select: none;
@@ -3380,7 +3371,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.range-picker-day.sel-end {
background: var(--accent);
color: #fff;
- font-weight: 600;
+ font-weight: 500;
}
.range-picker-footer {
@@ -3417,8 +3408,8 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
gap: 6px;
background: var(--surface);
border: 1px solid var(--line-soft);
- border-radius: var(--r-pill);
- padding: 3px 10px;
+ border-radius: 6px;
+ padding: 4px 12px;
font-size: 12px;
}
@@ -3453,7 +3444,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
gap: 4px;
background: var(--surface-sunk);
border: 1px solid var(--line-soft);
- border-radius: var(--r-pill);
+ border-radius: 6px;
padding: 2px 8px;
font-size: 11px;
font-weight: 400;
@@ -3462,7 +3453,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.tag-chip .tag-remove {
cursor: pointer;
- font-weight: 600;
+ font-weight: 500;
color: var(--text-subtle);
line-height: 1;
transition: color .15s var(--ease);
@@ -3488,9 +3479,9 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
}
.dash-gruss {
margin: 0;
- font-size: 22px;
- font-weight: 600;
- letter-spacing: -.02em;
+ font-size: 24px;
+ font-weight: 500;
+ letter-spacing: 0;
}
.dash-gruss em {
font-style: normal;
@@ -3504,9 +3495,9 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
}
.dash-sitzung {
font-size: 11px;
- font-weight: 600;
- padding: 2px 9px;
- border-radius: var(--r-pill);
+ font-weight: 500;
+ padding: 2px 8px;
+ border-radius: 6px;
background: var(--surface-sunk);
color: var(--text-muted);
}
@@ -3520,7 +3511,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.dash-band {
display: flex;
align-items: center;
- gap: 22px;
+ gap: 20px;
flex-wrap: wrap;
padding: 16px 20px;
margin-bottom: 24px;
@@ -3537,14 +3528,14 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
margin: 0;
flex: 1 1 300px;
min-width: 0;
- font-size: 17px;
+ font-size: 19px;
}
/* Die Zahl größer als der Satz: Sie ist die Nachricht, und ab 19 px fett
gilt für den Kontrast die Schwelle für große Schrift — die Ampelfarbe
erreicht auf der abgesetzten Bandfläche sonst nur 4,1:1 im dunklen Thema. */
.dash-befund b {
font-size: 1.15em;
- font-weight: 600;
+ font-weight: 500;
font-variant-numeric: tabular-nums;
}
.dash-befund b.ist-rot { color: var(--red); }
@@ -3554,7 +3545,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.dash-zahl { display: flex; flex-direction: column; gap: 1px; min-width: 74px; }
.dash-zahl b {
font-size: 19px;
- font-weight: 600;
+ font-weight: 500;
line-height: 1.15;
font-variant-numeric: tabular-nums;
}
@@ -3574,21 +3565,20 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.dash-abschnitt-kopf {
display: flex;
align-items: baseline;
- gap: 10px;
+ gap: 8px;
margin-bottom: 8px;
}
.dash-abschnitt-titel {
margin: 0;
- font-size: 11.5px;
- font-weight: 600;
- letter-spacing: .06em;
- text-transform: uppercase;
+ font-size: 12px;
+ font-weight: 500;
+ letter-spacing: 0;
color: var(--text-muted);
}
.dash-abschnitt-zahl {
font-size: 11px;
- padding: 1px 7px;
- border-radius: var(--r-pill);
+ padding: 1px 8px;
+ border-radius: 6px;
background: var(--surface-sunk);
color: var(--text-muted);
font-variant-numeric: tabular-nums;
@@ -3606,14 +3596,14 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
box-shadow: var(--sh-1);
overflow: hidden;
}
-.dash-leer { padding: 16px 18px; font-size: 13px; color: var(--text-subtle); }
+.dash-leer { padding: 16px 20px; font-size: 13px; color: var(--text-subtle); }
/* ---------- Meine Aufgaben: Zeilen statt halbseitiger Karten ---------- */
.dash-auf {
display: flex;
align-items: center;
- gap: 14px;
- padding: 11px 16px;
+ gap: 12px;
+ padding: 12px 16px;
border-bottom: 1px solid var(--line-soft);
text-decoration: none;
color: inherit;
@@ -3626,7 +3616,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.dash-auf-text { flex: 1 1 auto; min-width: 0; }
.dash-auf-titel {
display: block;
- font-size: 13.5px;
+ font-size: 13px;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
@@ -3635,14 +3625,14 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.dash-auf-meta {
display: flex;
align-items: center;
- gap: 7px;
+ gap: 8px;
flex-wrap: wrap;
margin-top: 1px;
font-size: 11px;
color: var(--text-subtle);
}
.dash-auf-tag {
- font-size: 10px;
+ font-size: 11px;
padding: 0 6px;
border-radius: var(--r-sm);
background: var(--surface-sunk);
@@ -3673,7 +3663,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
line-height: 1.3;
font-variant-numeric: tabular-nums;
}
-.dash-auf-frist em { display: block; font-style: normal; font-size: 10.5px; color: var(--text-subtle); }
+.dash-auf-frist em { display: block; font-style: normal; font-size: 11px; color: var(--text-subtle); }
.dash-auf-frist.ist-ueberfaellig, .dash-auf-frist.ist-ueberfaellig em { color: var(--red); }
.dash-auf-frist.ist-bald { color: var(--amber); }
@@ -3681,8 +3671,8 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
.dash-rand-zeile {
display: flex;
align-items: center;
- gap: 10px;
- padding: 10px 14px;
+ gap: 8px;
+ padding: 12px 16px;
border-bottom: 1px solid var(--line-soft);
}
.dash-rand-zeile:last-child { border-bottom: none; }
@@ -3693,15 +3683,15 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
border-radius: 50%;
display: grid;
place-items: center;
- font-size: 10.5px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
background: var(--surface-sunk);
color: var(--text-muted);
}
.dash-rand-text { flex: 1; min-width: 0; }
.dash-rand-name {
display: block;
- font-size: 12.5px;
+ font-size: 13px;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
@@ -3709,7 +3699,7 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
}
.dash-rand-meta {
display: block;
- font-size: 10.5px;
+ font-size: 11px;
color: var(--text-subtle);
overflow: hidden;
text-overflow: ellipsis;
@@ -3717,9 +3707,9 @@ html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255,2
}
.dash-chip {
flex: 0 0 auto;
- font-size: 10px;
- padding: 1px 7px;
- border-radius: var(--r-pill);
+ font-size: 11px;
+ padding: 1px 8px;
+ border-radius: 6px;
background: var(--surface-sunk);
color: var(--text-muted);
white-space: nowrap;
@@ -3800,36 +3790,35 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
background: var(--surface);
border: 1px solid var(--line-soft);
border-radius: var(--r-lg);
- padding: 16px 18px;
+ padding: 16px 20px;
box-shadow: var(--sh-1);
}
.settings-card-title {
- margin: 0 0 10px;
- font-size: 14px;
- font-weight: 600;
+ margin: 0 0 8px;
+ font-size: 13px;
+ font-weight: 500;
display: flex;
align-items: baseline;
- gap: 10px;
+ gap: 8px;
flex-wrap: wrap;
}
/* Reichweite einer Einstellung — „firmenweit" heißt: wirkt bei allen. */
.settings-scope {
font-size: 11px;
font-weight: 500;
- letter-spacing: .04em;
- text-transform: uppercase;
+ letter-spacing: 0;
color: var(--text-muted);
background: var(--surface-alt);
- border-radius: var(--r-pill);
+ border-radius: 8px;
padding: 2px 8px;
}
-.settings-kv { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; }
+.settings-kv { display: flex; flex-direction: column; gap: 2px; margin-bottom: 8px; }
.settings-kv-row {
display: flex;
- gap: 10px;
- font-size: 12.5px;
- padding: 5px 0;
+ gap: 8px;
+ font-size: 13px;
+ padding: 4px 0;
border-bottom: 1px solid var(--line-soft);
}
.settings-kv-row:last-child { border-bottom: none; }
@@ -3842,8 +3831,8 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
display: flex;
align-items: center;
gap: 8px;
- font-size: 12.5px;
- margin-bottom: 10px;
+ font-size: 13px;
+ margin-bottom: 8px;
}
.settings-inline-field select { min-width: 120px; }
@@ -3851,28 +3840,28 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
ein umrandeter Block je Anbieter statt eines durchgehenden Feld-Rasters —
ChatGPT und Claude sind zwei getrennte Zugänge, keine vier gleichrangigen
Felder. Design-Entwurf mit Erik abgestimmt (Artifact d7ab2945). */
-.ai-provider { border: 1px solid var(--line-soft); border-radius: var(--r-md); padding: 14px 16px; }
+.ai-provider { border: 1px solid var(--line-soft); border-radius: var(--r-md); padding: 16px 16px; }
.ai-provider + .ai-provider { margin-top: 12px; }
-.ai-provider-head { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
+.ai-provider-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.ai-provider-info { min-width: 0; }
.ai-provider-mark {
- width: 26px; height: 26px; border-radius: 7px;
+ width: 26px; height: 26px; border-radius: 8px;
display: flex; align-items: center; justify-content: center;
- font-size: 12px; font-weight: 700; color: #fff; flex-shrink: 0; letter-spacing: -.02em;
+ font-size: 12px; font-weight: 600; color: #fff; flex-shrink: 0; letter-spacing: 0;
}
.ai-provider-mark.chatgpt { background: #10a37f; }
.ai-provider-mark.claude { background: #c96442; }
-.ai-provider-name { font-weight: 600; font-size: 13px; }
-.ai-provider-sub { font-size: 11.5px; color: var(--text-subtle); }
+.ai-provider-name { font-weight: 500; font-size: 13px; }
+.ai-provider-sub { font-size: 12px; color: var(--text-subtle); }
/* Status-Pill: derselbe Punkt-plus-Text-Aufbau wie an anderen Stellen der
App (z. B. .protokoll-status-dot), hier als Pill neben dem Anbieternamen. */
.ai-status-chip {
margin-left: auto;
display: inline-flex; align-items: center; gap: 6px;
- font-size: 11.5px; font-weight: 500;
- padding: 3px 10px 3px 8px;
- border-radius: var(--r-pill);
+ font-size: 12px; font-weight: 500;
+ padding: 4px 12px 4px 8px;
+ border-radius: 6px;
background: var(--surface-alt);
color: var(--text-muted);
flex-shrink: 0;
@@ -3885,8 +3874,8 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
.ai-provider-row input[type=password],
.ai-provider-row input[type=text] {
flex: 1; min-width: 0;
- padding: 7px 10px;
- font-size: 12.5px;
+ padding: 8px 12px;
+ font-size: 13px;
border: 1px solid var(--line);
border-radius: var(--r-sm);
background: var(--surface);
@@ -3924,7 +3913,7 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
.ai-text-btn {
flex-shrink: 0;
border: none; background: none;
- font-size: 11.5px; color: var(--text-subtle);
+ font-size: 12px; color: var(--text-subtle);
cursor: pointer; padding: 0 2px;
}
.ai-text-btn:hover { color: var(--red); }
@@ -3937,18 +3926,18 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
er die Karte in echt benutzte — deshalb jetzt eine sichtbare Wahl statt
eines kleinen Links, den man erst entdecken muss. */
.ai-mode-toggle {
- display: inline-flex; background: var(--surface-sunk); border-radius: var(--r-pill);
- padding: 3px; gap: 2px; margin-top: 12px;
+ display: inline-flex; background: var(--surface-sunk); border-radius: 8px;
+ padding: 4px; gap: 2px; margin-top: 12px;
}
.ai-mode-toggle button {
- border: none; background: none; padding: 5px 13px; border-radius: var(--r-pill);
+ border: none; background: none; padding: 4px 12px; border-radius: 6px;
font-size: 12px; font-weight: 500; color: var(--text-muted); cursor: pointer; font-family: inherit;
}
-.ai-mode-toggle button.is-active { background: var(--surface); color: var(--text); font-weight: 600; box-shadow: var(--sh-1); }
+.ai-mode-toggle button.is-active { background: var(--surface); color: var(--text); font-weight: 500; box-shadow: var(--sh-1); }
.ai-url-panel { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line-soft); display: none; }
.ai-url-panel.is-open { display: block; }
-.ai-url-panel label { display: block; font-size: 11px; color: var(--text-subtle); margin-bottom: 5px; }
+.ai-url-panel label { display: block; font-size: 11px; color: var(--text-subtle); margin-bottom: 4px; }
.ai-url-panel .ai-provider-row { margin-bottom: 0; }
/* Zweites Label-/Zeilenpaar im selben Panel (Modellname, unter der
Server-Adresse): braucht Abstand nach oben, den das erste (am
@@ -3977,14 +3966,14 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
Protokoll-Import-Banner: ein Toast neben einer sich gleichzeitig
ändernden Ansicht wird leicht übersehen. :empty blendet die Zeile aus,
solange kein Fehler ansteht, ohne eigenes hidden-Attribut in JS. */
-.ai-test-error { font-size: 11.5px; color: var(--red); margin-top: 8px; }
+.ai-test-error { font-size: 12px; color: var(--red); margin-top: 8px; }
.ai-test-error:empty { display: none; }
/* Bestätigung nach dem Speichern. Bewusst kein alert(): ein gelungener
Speichervorgang soll den Arbeitsfluss nicht anhalten. */
.settings-note {
- margin-top: 14px;
- font-size: 12.5px;
+ margin-top: 12px;
+ font-size: 13px;
color: var(--green);
opacity: 0;
transition: opacity .25s var(--ease);
@@ -4004,37 +3993,37 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
display: flex;
align-items: center;
justify-content: space-between;
- gap: 10px;
- font-size: 12.5px;
+ gap: 8px;
+ font-size: 13px;
}
-.settings-field input { width: 88px; padding: 4px 7px; font-size: 12.5px; text-align: right; }
+.settings-field input { width: 88px; padding: 4px 8px; font-size: 13px; text-align: right; }
.settings-check {
display: flex;
align-items: center;
gap: 8px;
- font-size: 12.5px;
+ font-size: 13px;
margin: 4px 0 2px;
}
.settings-subtitle {
margin: 16px 0 4px;
- font-size: 12.5px;
- font-weight: 600;
+ font-size: 13px;
+ font-weight: 500;
}
-.settings-matrix-wrap { overflow-x: auto; margin-bottom: 10px; }
+.settings-matrix-wrap { overflow-x: auto; margin-bottom: 8px; }
.settings-matrix { border-collapse: collapse; font-size: 12px; }
.settings-matrix th, .settings-matrix td {
- padding: 3px 6px;
+ padding: 4px 6px;
border-bottom: 1px solid var(--line-soft);
text-align: center;
}
.settings-matrix thead th { color: var(--text-muted); font-weight: 500; white-space: nowrap; }
.settings-matrix tbody th { text-align: left; font-weight: 500; white-space: nowrap; }
-.settings-matrix input { width: 62px; padding: 3px 6px; font-size: 12px; text-align: right; }
+.settings-matrix input { width: 62px; padding: 4px 6px; font-size: 12px; text-align: right; }
-.settings-holiday-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
+.settings-holiday-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
/* Abweichende Stelle im Auslastungs-Tab (js/load/load.js) — steht nur da,
wenn die Person nicht voll beschäftigt ist. */
@@ -4043,8 +4032,8 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
font-weight: 500;
color: var(--text-muted);
background: var(--surface-alt);
- border-radius: var(--r-pill);
- padding: 1px 7px;
+ border-radius: 6px;
+ padding: 1px 8px;
margin-left: 6px;
}
@@ -4053,7 +4042,7 @@ html[data-theme="dark"] .absence-type-fortbildung { background: rgba(255,159,10,
eigenstaendigen Seite public/admin-users.html; die Regeln der dortigen
Seiten-Huelle (.admin-page/.admin-header/.admin-body) sind mit ihr
entfallen, weil der Abschnitt jetzt in der normalen App-Huelle liegt. */
-.admin-toolbar { margin-bottom: 14px; }
+.admin-toolbar { margin-bottom: 12px; }
td.actions-cell { white-space: nowrap; width: 1%; text-align: right; }
/* Vor- und Nachname nebeneinander (Benutzer anlegen/bearbeiten), auf
@@ -4085,7 +4074,7 @@ tr.is-menu-open { background: var(--surface-alt); }
.user-menu {
position: fixed; z-index: 250; min-width: 220px; max-width: 280px;
background: var(--surface); border: 1px solid var(--line);
- border-radius: var(--r-md); box-shadow: var(--sh-3); padding: 5px;
+ border-radius: var(--r-md); box-shadow: var(--sh-3); padding: 4px;
transform-origin: top right;
animation: user-menu-auf var(--dur) var(--ease-out);
}
@@ -4094,9 +4083,9 @@ tr.is-menu-open { background: var(--surface-alt); }
@keyframes user-menu-auf-oben { from { opacity: 0; transform: scale(.96) translateY(4px); } to { opacity: 1; transform: none; } }
.user-menu-item {
all: unset; box-sizing: border-box;
- display: flex; gap: 10px; align-items: flex-start; width: 100%;
- padding: 7px 10px; border-radius: var(--r-sm);
- color: var(--text); font-size: 13.5px; line-height: 1.35; cursor: pointer;
+ display: flex; gap: 8px; align-items: flex-start; width: 100%;
+ padding: 8px 12px; border-radius: var(--r-sm);
+ color: var(--text); font-size: 13px; line-height: 1.35; cursor: pointer;
}
.user-menu-item:hover:not([aria-disabled="true"]), .user-menu-item:focus-visible { background: var(--surface-sunk); }
.user-menu-item:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
@@ -4107,18 +4096,18 @@ tr.is-menu-open { background: var(--surface-alt); }
.user-menu-item.is-danger:hover:not([aria-disabled="true"]),
.user-menu-item.is-danger:focus-visible { background: color-mix(in srgb, var(--red) 10%, transparent); }
.user-menu-item[aria-disabled="true"], .user-menu-item[aria-disabled="true"] .user-menu-ic { color: var(--text-subtle); cursor: not-allowed; }
-.user-menu-trenner { border: 0; border-top: 1px solid var(--line-soft); margin: 5px 4px; }
-.user-menu-confirm { padding: 10px 10px 8px; display: grid; gap: 10px; }
+.user-menu-trenner { border: 0; border-top: 1px solid var(--line-soft); margin: 4px 4px; }
+.user-menu-confirm { padding: 12px 12px 8px; display: grid; gap: 8px; }
.user-menu-confirm p { margin: 0; font-size: 13px; line-height: 1.4; }
.user-menu-confirm-row { display: flex; gap: 6px; justify-content: flex-end; }
-.badge-active { color: var(--green); font-weight: 600; }
+.badge-active { color: var(--green); font-weight: 500; }
.badge-inactive { color: var(--text-muted); }
-.badge-warn { color: var(--amber); font-weight: 600; }
+.badge-warn { color: var(--amber); font-weight: 500; }
/* Das einmalig angezeigte Passwort laesst sich mit einem Klick markieren. */
#generatedPasswordBox {
display: none;
- margin-bottom: 14px;
- padding: 12px 14px;
+ margin-bottom: 12px;
+ padding: 12px 16px;
border-radius: var(--r-md);
background: var(--surface-alt);
border: 1px solid var(--line-soft);
@@ -4135,14 +4124,14 @@ tr.is-menu-open { background: var(--surface-alt); }
grid-column: 1 / -1;
margin-top: 12px;
border-top: 1px solid var(--line-soft);
- padding-top: 10px;
+ padding-top: 12px;
}
.timeline-block > summary {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
- font-size: 12.5px;
+ font-size: 13px;
color: var(--text-muted);
list-style: none;
user-select: none;
@@ -4155,13 +4144,13 @@ tr.is-menu-open { background: var(--surface-alt); }
.timeline-block > summary:hover { color: var(--text); }
.timeline-block[open] > summary .comment-history-caret { transform: rotate(90deg); }
-.timeline-body { padding-top: 10px; }
+.timeline-body { padding-top: 12px; }
/* Die Schiene scrollt waagerecht; die Karte selbst darf dabei nicht breiter
werden, deshalb min-width:0 am Elternraster (siehe .board-drawer). */
.timeline-rail {
display: flex;
- gap: 10px;
+ gap: 8px;
overflow-x: auto;
padding-bottom: 6px;
scroll-snap-type: x proximity;
@@ -4172,7 +4161,7 @@ tr.is-menu-open { background: var(--surface-alt); }
display: flex;
flex-direction: column;
gap: 6px;
- padding: 10px 11px;
+ padding: 12px 12px;
border: 1px solid var(--line-soft);
border-radius: var(--r-md);
background: var(--surface-alt);
@@ -4184,7 +4173,7 @@ tr.is-menu-open { background: var(--surface-alt); }
justify-content: space-between;
gap: 6px;
}
-.timeline-kw { font-weight: 600; white-space: nowrap; }
+.timeline-kw { font-weight: 500; white-space: nowrap; }
.timeline-datum { color: var(--text-muted); font-size: 11px; white-space: nowrap; }
/* Der Kommentar wird auf sechs Zeilen begrenzt, damit alle Kacheln einer
@@ -4201,11 +4190,11 @@ tr.is-menu-open { background: var(--surface-alt); }
.timeline-text p { margin: 0; }
/* Gewerk über dem Kommentar: Systemtext, nicht Teil des Kommentars. */
.kommentar-gewerk {
- font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
+ font-size: 11px; font-weight: 600; letter-spacing: 0;
color: var(--text-subtle); margin-top: 4px;
}
.kommentar-gewerk:first-child { margin-top: 0; }
-.timeline-leer { color: var(--text-muted); font-style: italic; }
+.timeline-leer { color: var(--text-muted); font-style: normal; }
.timeline-lph-list { display: flex; flex-direction: column; gap: 1px; }
.timeline-lph {
@@ -4216,12 +4205,12 @@ tr.is-menu-open { background: var(--surface-alt); }
color: var(--text-muted);
}
.timeline-termine { display: flex; flex-direction: column; gap: 1px; }
-.timeline-termin { color: var(--text-muted); font-size: 11.5px; }
+.timeline-termin { color: var(--text-muted); font-size: 12px; }
/* Gegenüber der Kachel DAVOR geänderte Werte. Dezent, aber auffindbar: Bei
zehn Leistungsphasen findet man die eine geänderte Zahl sonst nicht. */
.timeline-lph.is-changed,
-.timeline-termin.is-changed { color: var(--accent); font-weight: 600; }
+.timeline-termin.is-changed { color: var(--accent); font-weight: 500; }
/* "übernehmen" in der Verlaufs-Kachel: übernimmt die einzige Funktion, die
der entfallene Aufklapper "Frühere Sitzungen" über das Anzeigen hinaus
@@ -4231,11 +4220,11 @@ tr.is-menu-open { background: var(--surface-alt); }
align-self: flex-start;
padding: 1px 8px;
border: 1px solid var(--line);
- border-radius: var(--r-pill);
+ border-radius: 8px;
background: transparent;
color: var(--text-muted);
font-family: inherit;
- font-size: 10.5px;
+ font-size: 11px;
cursor: pointer;
}
.timeline-take:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
@@ -4260,12 +4249,12 @@ tr.is-menu-open { background: var(--surface-alt); }
.comment-foot-author .comment-av { margin-right: 4px; }
.comment-foot-author .comment-sep { margin: 0 4px; }
-.timeline-people { display: flex; flex-wrap: wrap; gap: 3px; margin-top: auto; padding-top: 2px; }
+.timeline-people { display: flex; flex-wrap: wrap; gap: 4px; margin-top: auto; padding-top: 2px; }
.timeline-chip {
- font-size: 10.5px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
padding: 1px 6px;
- border-radius: var(--r-pill);
+ border-radius: 6px;
background: var(--surface-sunk);
color: var(--text-muted);
}
@@ -4286,7 +4275,7 @@ tr.is-menu-open { background: var(--surface-alt); }
Karten — genau wie im freigegebenen Entwurf: eine Kopfleiste mit eigenem
Hintergrund/Trennlinie, darunter die Leiste als Spalte MIT dem Ergebnis
verbunden (Trennlinie statt eigenem Rahmen). */
-.bericht-titelzeile { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
+.bericht-titelzeile { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.bericht-titelzeile button { margin-left: auto; }
.bericht-panel {
@@ -4296,10 +4285,10 @@ tr.is-menu-open { background: var(--surface-alt); }
.bericht-topbar {
display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
- padding: 10px 20px; border-bottom: 1px solid var(--line-soft);
+ padding: 12px 20px; border-bottom: 1px solid var(--line-soft);
}
.bericht-gewerk-select {
- font-size: 12px; font-weight: 600; padding: 5px 10px;
+ font-size: 12px; font-weight: 500; padding: 4px 12px;
/* background-color statt background (Kurzform): die Kurzform setzt das vom
globalen select-Selektor gesetzte Pfeil-Icon (background-image/-repeat/
-position) auf die Vorgabewerte zurück, wodurch das 10x6px-Pfeilchen
@@ -4313,23 +4302,23 @@ tr.is-menu-open { background: var(--surface-alt); }
display: flex; align-items: center; justify-content: center;
}
.bericht-ring span { width: 18px; height: 18px; border-radius: 50%; background: var(--surface); display: block; }
-.bericht-fortschritt-text { font-size: 11.5px; color: var(--text-muted); font-weight: 600; white-space: nowrap; }
+.bericht-fortschritt-text { font-size: 12px; color: var(--text-muted); font-weight: 500; white-space: nowrap; }
/* Reines Textlink, kein Knopf — im Entwurf steht an dieser Stelle nur der
Fortschritt, nicht noch eine zusätzliche Schaltfläche daneben. */
.bericht-reset-link {
- font-size: 11.5px; font-weight: 600; border: none; background: none;
+ font-size: 12px; font-weight: 500; border: none; background: none;
color: var(--text-subtle); cursor: pointer; padding: 0; text-decoration: underline;
text-decoration-color: var(--line);
}
.bericht-reset-link:hover { color: var(--text); }
.bericht-search-btn {
margin-left: auto; border: 1px solid var(--line); background: var(--surface-alt);
- color: var(--text-subtle); font-size: 12px; padding: 5px 10px;
- border-radius: var(--r-pill); cursor: pointer;
+ color: var(--text-subtle); font-size: 12px; padding: 4px 12px;
+ border-radius: 8px; cursor: pointer;
}
.bericht-search-btn:hover { color: var(--text); border-color: var(--text-subtle); }
.bericht-suche-input {
- margin-left: auto; border: 1px solid var(--line); border-radius: var(--r-pill);
+ margin-left: auto; border: 1px solid var(--line); border-radius: 8px;
background: var(--surface-sunk); color: var(--text); font-size: 12px;
padding: 6px 12px; width: 170px;
}
@@ -4337,34 +4326,34 @@ tr.is-menu-open { background: var(--surface-alt); }
/* ---------- Planung (Terminplan-Sandbox, js/planung/planung.js) ---------- */
.planung-row {
- display: flex; align-items: center; gap: 14px;
- padding: 13px 16px; border-radius: var(--r-md);
+ display: flex; align-items: center; gap: 12px;
+ padding: 12px 16px; border-radius: var(--r-md);
background: var(--surface); border: 1px solid var(--line-soft);
margin-bottom: 8px; cursor: pointer; transition: background .15s var(--ease);
}
.planung-row:hover { background: var(--surface-alt); }
.planung-row-icon {
- width: 34px; height: 34px; border-radius: 9px; flex: 0 0 auto;
- display: flex; align-items: center; justify-content: center; font-size: 14px;
+ width: 34px; height: 34px; border-radius: 8px; flex: 0 0 auto;
+ display: flex; align-items: center; justify-content: center; font-size: 13px;
}
.planung-row-icon.honorar { background: var(--accent-soft); color: var(--accent); }
.planung-row-icon.leer { background: var(--surface-sunk); color: var(--text-subtle); }
.planung-row-main { flex: 1; min-width: 0; }
-.planung-row-name { font-size: 14px; font-weight: 600; margin: 0; }
+.planung-row-name { font-size: 13px; font-weight: 500; margin: 0; }
.planung-row-meta { font-size: 12px; color: var(--text-muted); margin: 2px 0 0; }
.planung-row-stat { text-align: right; font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.planung-row-stat b { display: block; color: var(--text); font-size: 13px; font-variant-numeric: tabular-nums; }
-.planung-choice-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
+.planung-choice-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.choice-card {
- border: 1.5px solid var(--line); border-radius: var(--r-md); padding: 14px 14px 12px;
+ border: 1.5px solid var(--line); border-radius: var(--r-md); padding: 16px 16px 12px;
cursor: pointer; background: var(--surface-alt); transition: border-color .15s ease;
}
.choice-card:hover { border-color: var(--accent); }
.choice-card.is-gewaehlt { border-color: var(--accent); }
-.choice-card-icon { font-size: 18px; margin-bottom: 8px; display: block; }
-.choice-card-title { font-size: 13px; font-weight: 600; margin-bottom: 3px; }
-.choice-card-desc { font-size: 11.5px; color: var(--text-muted); line-height: 1.4; }
+.choice-card-icon { font-size: 19px; margin-bottom: 8px; display: block; }
+.choice-card-title { font-size: 13px; font-weight: 500; margin-bottom: 4px; }
+.choice-card-desc { font-size: 12px; color: var(--text-muted); line-height: 1.4; }
.empty-hint { text-align: center; padding: 60px 20px; color: var(--text-subtle); font-size: 13px; }
.empty-hint .big { font-size: 15px; color: var(--text-muted); margin-bottom: 6px; display: block; }
@@ -4384,17 +4373,17 @@ tr.is-menu-open { background: var(--surface-alt); }
.pc-drop {
display: block; border: 1.5px dashed var(--line); border-radius: var(--r-md);
- padding: 20px 14px; text-align: center; color: var(--text-muted);
- background: var(--surface-alt); cursor: pointer; font-size: 12.5px;
+ padding: 20px 16px; text-align: center; color: var(--text-muted);
+ background: var(--surface-alt); cursor: pointer; font-size: 13px;
transition: border-color .15s var(--ease), color .15s var(--ease), background .15s var(--ease);
}
.pc-drop:hover, .pc-drop.is-dragover { border-color: var(--accent); color: var(--text); background: var(--accent-soft); }
-.pc-drop-name { font-weight: 650; color: var(--text); margin-top: 4px; font-size: 13px; word-break: break-word; }
+.pc-drop-name { font-weight: 500; color: var(--text); margin-top: 4px; font-size: 13px; word-break: break-word; }
-.pc-section { margin-top: 18px; }
-.pc-label { display: block; font-size: 11.5px; font-weight: 650; color: var(--text-muted); margin-bottom: 5px; }
+.pc-section { margin-top: 16px; }
+.pc-label { display: block; font-size: 12px; font-weight: 500; color: var(--text-muted); margin-bottom: 4px; }
-.pc-merkmal-chip { font-size: 12.5px; padding: 5px 2px; color: var(--text-muted); }
+.pc-merkmal-chip { font-size: 13px; padding: 4px 2px; color: var(--text-muted); }
.pc-zusatz { margin-top: 8px; }
.pc-zusatz .pc-input { width: 100%; }
@@ -4406,13 +4395,13 @@ tr.is-menu-open { background: var(--surface-alt); }
Pfeil-Muster, das als "komisch" auffiel, war genau das. */
.pc-select, .pc-input {
border: 1px solid var(--line); border-radius: var(--r-md); background-color: var(--surface);
- color: var(--text); font-size: 13px; font-family: inherit; padding: 8px 10px;
+ color: var(--text); font-size: 13px; font-family: inherit; padding: 8px 12px;
}
.pc-select:focus, .pc-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent); }
.pc-btn {
border: 1px solid var(--line); background: var(--surface); color: var(--text);
- font-size: 13px; font-weight: 600; padding: 9px 16px; border-radius: var(--r-md); cursor: pointer;
+ font-size: 13px; font-weight: 500; padding: 8px 16px; border-radius: var(--r-md); cursor: pointer;
}
.pc-btn:hover { background: var(--surface-alt); }
.pc-btn:disabled { opacity: .6; cursor: default; }
@@ -4422,21 +4411,21 @@ tr.is-menu-open { background: var(--surface-alt); }
.pc-verdict {
display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
- width: 20px; height: 20px; border-radius: 50%; font-size: 12px; font-weight: 700; color: #fff;
+ width: 20px; height: 20px; border-radius: 50%; font-size: 12px; font-weight: 600; color: #fff;
}
.pc-verdict.ok { background: var(--green); }
.pc-verdict.fail { background: var(--red); }
.pc-results { min-height: 420px; display: flex; flex-direction: column; }
.pc-results-empty { margin: auto; text-align: center; color: var(--text-subtle); padding: 40px 20px; }
-.pc-results-empty .big { font-size: 14px; color: var(--text-muted); margin-bottom: 4px; display: block; }
-.pc-result-head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; }
-.pc-result-head .filename { font-weight: 650; }
+.pc-results-empty .big { font-size: 13px; color: var(--text-muted); margin-bottom: 4px; display: block; }
+.pc-result-head { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; }
+.pc-result-head .filename { font-weight: 500; }
.pc-result-head .meta { color: var(--text-subtle); font-size: 12px; margin-left: auto; }
.pc-result-row { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line-soft); }
.pc-result-row:last-child { border-bottom: none; }
-.pc-result-row .titel { font-weight: 650; margin-bottom: 2px; font-size: 13px; }
-.pc-result-row .begruendung { color: var(--text-muted); font-size: 12.5px; }
+.pc-result-row .titel { font-weight: 500; margin-bottom: 2px; font-size: 13px; }
+.pc-result-row .begruendung { color: var(--text-muted); font-size: 13px; }
.pc-result-text { flex: 1 1 auto; min-width: 0; }
/* pc-result-shot: Screenshot des Planausschnitts, den die KI für das Merkmal
als Beleg gewählt hat (server.js, pruefePlanMitKI(), bildIndex) — nur
@@ -4462,22 +4451,22 @@ tr.is-menu-open { background: var(--surface-alt); }
.bericht-rail {
background: var(--surface-alt);
border-right: 1px solid var(--line-soft);
- padding: 10px 8px; display: flex; flex-direction: column; gap: 2px;
+ padding: 12px 8px; display: flex; flex-direction: column; gap: 2px;
position: sticky; top: 64px; max-height: calc(100vh - 64px); overflow-y: auto;
}
.bericht-rail-gruppe {
- font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
- color: var(--text-subtle); padding: 12px 8px 5px;
+ font-size: 11px; font-weight: 600; letter-spacing: 0;
+ color: var(--text-subtle); padding: 12px 8px 4px;
}
.bericht-rail-gruppe:first-child { padding-top: 2px; }
.bericht-rail-item {
position: relative; display: flex; align-items: center; gap: 8px;
- padding: 6px 8px; border-radius: var(--r-sm); cursor: pointer; color: var(--text); font-size: 12.5px;
+ padding: 6px 8px; border-radius: var(--r-sm); cursor: pointer; color: var(--text); font-size: 13px;
}
.bericht-rail-item:hover { background: var(--surface-sunk); }
.bericht-rail-item:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.bericht-rail-item.is-aktiv { background: var(--accent-soft); }
-.bericht-rail-item.is-aktiv .bericht-rail-name { color: var(--accent); font-weight: 650; }
+.bericht-rail-item.is-aktiv .bericht-rail-name { color: var(--accent); font-weight: 500; }
/* Abgehakt: zurückgenommen, aber erkennbar — man muss im Meeting noch sehen
können, was man schon besprochen hat. */
.bericht-rail-item.is-ab { opacity: .55; }
@@ -4492,19 +4481,19 @@ tr.is-menu-open { background: var(--surface-alt); }
neben der Leiste (Eriks Wunsch). Früher hielt max-width: 640px sie als
schmale Lesespalte — auf breiten Monitoren blieb dabei die halbe Fläche
leer. */
-.bericht-main { padding: 26px 36px 30px; min-width: 0; }
+.bericht-main { padding: 28px 36px 32px; min-width: 0; }
-.bericht-head-line { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
+.bericht-head-line { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.bericht-head-nr {
- font-family: ui-monospace, 'SF Mono', monospace; font-size: 11.5px;
+ font-family: ui-monospace, 'SF Mono', monospace; font-size: 12px;
color: var(--text-subtle);
}
.bericht-change-pill {
- font-size: 10.5px; font-weight: 700; color: #fff; padding: 2px 9px; border-radius: var(--r-pill);
+ font-size: 11px; font-weight: 600; color: #fff; padding: 2px 8px; border-radius: 6px;
}
.bericht-change-pill.is-new, .bericht-change-pill.is-status { background: var(--band-neu); }
.bericht-change-pill.is-progress { background: var(--band-fortschritt); }
-.bericht-h1 { font-size: 21px; font-weight: 650; letter-spacing: -0.012em; margin: 0 0 3px; }
+.bericht-h1 { font-size: 19px; font-weight: 500; letter-spacing: 0; margin: 0 0 4px; }
.bericht-sub { color: var(--text-subtle); font-size: 12px; margin-bottom: 16px; }
.bericht-abwesend-hinweis {
@@ -4519,30 +4508,30 @@ tr.is-menu-open { background: var(--surface-alt); }
Bildsprache wie der Verlauf im Projekt-Dashboard (.plan-verlauf-*). */
.bericht-zuletzt {
background: var(--surface-sunk); border-radius: var(--r-md);
- padding: 8px 12px; margin-bottom: 14px; font-size: 12.5px; line-height: 1.5; color: var(--text-muted);
+ padding: 8px 12px; margin-bottom: 12px; font-size: 13px; line-height: 1.5; color: var(--text-muted);
}
-.bericht-zuletzt-kw { display: block; font-size: 11px; font-weight: 650; color: var(--text); margin-bottom: 2px; }
+.bericht-zuletzt-kw { display: block; font-size: 11px; font-weight: 500; color: var(--text); margin-bottom: 2px; }
/* Lange Kommentare nicht endlos: höchstens fünf Zeilen, der Rest steht im Verlauf. */
.bericht-zuletzt-text { max-height: calc(1.5em * 5); overflow: hidden; overflow-wrap: anywhere; }
.bericht-zuletzt-text p { margin: 0; }
.bericht-verlauf { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--line-soft); }
.bv-kopf { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
-.bv-titel { font-size: 15px; font-weight: 650; margin: 0; color: var(--text); }
+.bv-titel { font-size: 15px; font-weight: 500; margin: 0; color: var(--text); }
.bv-anzahl { font-size: 12px; color: var(--text-subtle); }
.bv-mehr, .bv-uebernehmen {
- border: 0; background: transparent; font: inherit; font-size: 12px; font-weight: 600;
+ border: 0; background: transparent; font: inherit; font-size: 12px; font-weight: 500;
color: var(--accent); cursor: pointer; padding: 4px 8px; border-radius: var(--r-md);
}
.bv-mehr:hover, .bv-uebernehmen:hover { background: var(--surface-alt); }
.bv-liste { list-style: none; margin: 0; padding: 0; }
.bv-zeile {
display: grid; grid-template-columns: 120px 14px minmax(0, 1fr) minmax(0, 220px) auto;
- column-gap: 14px; align-items: start; padding: 10px 0;
+ column-gap: 12px; align-items: start; padding: 12px 0;
}
.bv-kw { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.bv-kw b { font-size: 13px; color: var(--text); }
-.bv-kw span { font-size: 11.5px; color: var(--text-subtle); }
+.bv-kw span { font-size: 12px; color: var(--text-subtle); }
/* Punkt und Linie: die Linie läuft von Punkt zu Punkt über den Zeilenabstand */
.bv-punkt { position: relative; align-self: stretch; }
.bv-punkt::before {
@@ -4554,13 +4543,13 @@ tr.is-menu-open { background: var(--surface-alt); }
content: ""; position: absolute; left: 6px; top: 16px; bottom: -14px; width: 2px; background: var(--line);
}
.bv-zeile:last-child .bv-punkt::after { display: none; }
-.bv-inhalt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
-.bv-text { font-size: 13.5px; line-height: 1.5; color: var(--text); overflow-wrap: anywhere; }
+.bv-inhalt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
+.bv-text { font-size: 13px; line-height: 1.5; color: var(--text); overflow-wrap: anywhere; }
.bv-text p { margin: 0; }
-.bv-ruhe { font-size: 11.5px; color: var(--text-subtle); }
+.bv-ruhe { font-size: 12px; color: var(--text-subtle); }
.bv-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.bv-chip {
- font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; white-space: nowrap;
+ font-size: 11px; font-weight: 500; padding: 2px 8px; border-radius: 6px; white-space: nowrap;
background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent);
}
.bv-uebernehmen { justify-self: end; }
@@ -4571,10 +4560,10 @@ tr.is-menu-open { background: var(--surface-alt); }
.bv-chips:empty { display: none; }
}
-.bericht-detail-fuss { display: flex; align-items: center; gap: 14px; margin-top: 20px; }
+.bericht-detail-fuss { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.bericht-fuss-spacer { flex: 1; }
-.person-chip-label { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
+.person-chip-label { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.protokoll-text {
width: 100%; font-family: ui-monospace, 'SF Mono', monospace;
font-size: 12px; line-height: 1.5; resize: vertical;
@@ -4592,7 +4581,7 @@ tr.is-menu-open { background: var(--surface-alt); }
.leistung-kpis {
display: flex;
flex-wrap: wrap;
- gap: 10px;
+ gap: 8px;
margin-bottom: 12px;
}
.leistung-kpi {
@@ -4601,7 +4590,7 @@ tr.is-menu-open { background: var(--surface-alt); }
gap: 2px;
flex: 1 1 160px;
min-width: 150px;
- padding: 10px 12px;
+ padding: 12px 12px;
background: var(--surface-alt);
border: 1px solid var(--line-soft);
border-radius: var(--r-md);
@@ -4610,18 +4599,17 @@ tr.is-menu-open { background: var(--surface-alt); }
font-size: 11px;
font-weight: 500;
color: var(--text-muted);
- text-transform: uppercase;
- letter-spacing: .03em;
+ letter-spacing: 0;
}
.leistung-kpi-value {
font-size: 19px;
- font-weight: 600;
+ font-weight: 500;
font-variant-numeric: tabular-nums;
line-height: 1.2;
}
.leistung-kpi-value.accent { color: var(--accent); }
.leistung-kpi-sub {
- font-size: 11.5px;
+ font-size: 12px;
color: var(--text-subtle);
font-variant-numeric: tabular-nums;
}
@@ -4634,7 +4622,7 @@ tr.is-menu-open { background: var(--surface-alt); }
border-radius: var(--r-pill);
background: var(--surface-sunk);
overflow: hidden;
- margin: 0 0 14px;
+ margin: 0 0 12px;
}
.leistung-balken > span {
display: block;
@@ -4644,15 +4632,15 @@ tr.is-menu-open { background: var(--surface-alt); }
transition: width .25s var(--ease);
}
-.leistung-table { font-size: 12.5px; }
+.leistung-table { font-size: 13px; }
.leistung-table th.num,
.leistung-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
-.leistung-table td.strong { font-weight: 600; }
+.leistung-table td.strong { font-weight: 500; }
.leistung-table tfoot th,
.leistung-table tfoot td {
border-top: 1px solid var(--line);
padding: 6px 8px;
- font-weight: 600;
+ font-weight: 500;
background: var(--surface-alt);
}
@@ -4660,9 +4648,9 @@ tr.is-menu-open { background: var(--surface-alt); }
beauftragte Phase, keine Anteile). Bewusst als Text und nicht als "0 EUR":
unbekannt ist nicht dasselbe wie nichts erbracht. */
.leistung-leer {
- font-size: 12.5px;
+ font-size: 13px;
color: var(--text-muted);
- padding: 10px 12px;
+ padding: 12px 12px;
background: var(--surface-alt);
border-left: 2px solid var(--amber);
border-radius: 0 var(--r-sm) var(--r-sm) 0;
@@ -4678,7 +4666,7 @@ tr.is-menu-open { background: var(--surface-alt); }
.auftrag-chip {
display: inline-flex;
align-items: center;
- border-radius: var(--r-pill);
+ border-radius: 6px;
padding: 1px 8px;
font-size: 11px;
font-weight: 500;
@@ -4720,7 +4708,7 @@ tr.is-menu-open { background: var(--surface-alt); }
.sitzung-chip {
display: inline-flex;
align-items: center;
- border-radius: var(--r-pill);
+ border-radius: 6px;
padding: 1px 8px;
font-size: 11px;
font-weight: 500;
@@ -4778,16 +4766,16 @@ tr.is-menu-open { background: var(--surface-alt); }
display: flex;
flex-wrap: wrap;
align-items: center;
- gap: 10px;
+ gap: 8px;
padding: 8px 2px 2px;
}
.plan-verweis{
background: none;
border: 1px solid var(--line);
- border-radius: var(--r-pill);
- padding: 3px 12px;
+ border-radius: 8px;
+ padding: 4px 12px;
font-size: 12px;
- font-weight: 600;
+ font-weight: 500;
color: var(--accent);
cursor: pointer;
}
@@ -4831,7 +4819,7 @@ tr.is-menu-open { background: var(--surface-alt); }
.plan-verweis-row{
display: flex;
justify-content: flex-end;
- padding-top: 10px;
+ padding-top: 12px;
}
.plan-verweis-row:empty{ display: none; }
@@ -4859,19 +4847,18 @@ tr.is-menu-open { background: var(--surface-alt); }
.fristen-gruppe-titel {
display: flex;
align-items: center;
- gap: 9px;
- padding: 9px 16px 6px;
+ gap: 8px;
+ padding: 8px 16px 6px;
background: var(--surface-alt);
- font-size: 10.5px;
- font-weight: 600;
- letter-spacing: .06em;
- text-transform: uppercase;
+ font-size: 11px;
+ font-weight: 500;
+ letter-spacing: 0;
color: var(--text-muted);
}
.fristen-gruppe-titel span {
- font-size: 10px;
- padding: 1px 7px;
- border-radius: var(--r-pill);
+ font-size: 11px;
+ padding: 1px 8px;
+ border-radius: 6px;
background: var(--surface-sunk);
color: var(--text-muted);
letter-spacing: 0;
@@ -4889,8 +4876,8 @@ tr.is-menu-open { background: var(--surface-alt); }
.fristen-zeile {
display: flex;
align-items: center;
- gap: 14px;
- padding: 9px 16px;
+ gap: 12px;
+ padding: 8px 16px;
border-bottom: 1px solid var(--line-soft);
text-decoration: none;
color: inherit;
@@ -4910,7 +4897,7 @@ tr.is-menu-open { background: var(--surface-alt); }
line-height: 1.25;
font-variant-numeric: tabular-nums;
}
-.fristen-datum b { font-size: 13px; font-weight: 600; }
+.fristen-datum b { font-size: 13px; font-weight: 500; }
.fristen-datum em {
font-style: normal;
font-size: 11px;
@@ -4922,10 +4909,10 @@ tr.is-menu-open { background: var(--surface-alt); }
.fristen-art {
flex: 0 0 auto;
- font-size: 10px;
- font-weight: 600;
+ font-size: 11px;
+ font-weight: 500;
padding: 2px 8px;
- border-radius: var(--r-pill);
+ border-radius: 6px;
background: var(--surface-sunk);
color: var(--text-muted);
white-space: nowrap;
@@ -4938,7 +4925,7 @@ tr.is-menu-open { background: var(--surface-alt); }
.fristen-titel {
flex: 1 1 auto;
min-width: 0;
- font-size: 13.5px;
+ font-size: 13px;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
@@ -4997,14 +4984,14 @@ tr.is-menu-open { background: var(--surface-alt); }
display: flex;
align-items: center;
gap: 12px;
- padding: 18px 24px 14px;
+ padding: 20px 24px 16px;
border-bottom: 1px solid var(--line-soft);
}
.wiz-kopf h2 { margin: 0; flex: 1; }
.wiz-schliessen {
- font-size: 20px;
+ font-size: 19px;
line-height: 1;
- padding: 2px 9px;
+ padding: 2px 8px;
background: none;
border: none;
color: var(--text-subtle);
@@ -5033,12 +5020,12 @@ tr.is-menu-open { background: var(--surface-alt); }
display: grid;
place-items: center;
font-size: 11px;
- font-weight: 600;
+ font-weight: 500;
background: var(--surface-sunk);
color: var(--text-muted);
font-variant-numeric: tabular-nums;
}
-.wiz-stufe.ist-aktiv { color: var(--text); font-weight: 600; }
+.wiz-stufe.ist-aktiv { color: var(--text); font-weight: 500; }
.wiz-stufe.ist-aktiv b { background: var(--accent); color: #fff; }
.wiz-stufe.ist-fertig b { background: var(--green); color: #fff; }
.wiz-strich {
@@ -5050,12 +5037,12 @@ tr.is-menu-open { background: var(--surface-alt); }
}
.wiz-inhalt {
- padding: 20px 24px 22px;
+ padding: 20px 24px 24px;
min-height: 300px;
max-height: 58vh;
overflow-y: auto;
}
-.wiz-titel { margin: 0 0 3px; font-size: 19px; font-weight: 600; letter-spacing: -.02em; }
+.wiz-titel { margin: 0 0 4px; font-size: 19px; font-weight: 500; letter-spacing: 0; }
.wiz-unter { margin: 0 0 20px; font-size: 13px; color: var(--text-muted); }
.wiz-zeile { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.wiz-pflicht { color: var(--red); }
@@ -5067,7 +5054,7 @@ tr.is-menu-open { background: var(--surface-alt); }
display: flex;
align-items: center;
gap: 12px;
- padding: 14px 24px;
+ padding: 16px 24px;
border-top: 1px solid var(--line-soft);
background: var(--surface-alt);
}
@@ -5080,38 +5067,38 @@ tr.is-menu-open { background: var(--surface-alt); }
flex-wrap: wrap;
justify-content: flex-end;
}
-.wiz-fehlt { font-size: 11.5px; color: var(--amber); text-align: right; }
+.wiz-fehlt { font-size: 12px; color: var(--amber); text-align: right; }
/* Auswahl-Chips (Gewerke, Phasen, Schlagwörter, Grundlage) */
.wiz-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.wiz-chip {
font: inherit;
font-size: 12px;
- padding: 5px 11px;
+ padding: 4px 12px;
cursor: pointer;
border: 1px solid var(--line);
- border-radius: var(--r-pill);
+ border-radius: 6px;
background: var(--surface);
color: var(--text-muted);
}
.wiz-chip:hover { border-color: var(--accent); background: var(--surface); }
.wiz-chip[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: #fff; }
-.wiz-chip-gewerk { font-weight: 600; letter-spacing: .02em; padding: 6px 14px; }
+.wiz-chip-gewerk { font-weight: 500; letter-spacing: .02em; padding: 6px 16px; }
/* Beteiligte je Rolle */
.wiz-rollen { display: flex; flex-direction: column; gap: 12px; }
.wiz-rolle { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.wiz-rolle-name {
flex: 0 0 116px;
- font-size: 11.5px;
- font-weight: 600;
- padding-top: 7px;
+ font-size: 12px;
+ font-weight: 500;
+ padding-top: 8px;
color: var(--text-muted);
}
.wiz-person {
font: inherit;
font-size: 11px;
- font-weight: 600;
+ font-weight: 500;
cursor: pointer;
width: 34px; height: 34px;
border-radius: 50%;
@@ -5130,20 +5117,20 @@ tr.is-menu-open { background: var(--surface-alt); }
.wiz-fremd { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line-soft); }
.wiz-fremd label {
display: block;
- font-size: 11.5px;
- font-weight: 600;
+ font-size: 12px;
+ font-weight: 500;
margin-bottom: 6px;
color: var(--text-muted);
}
.wiz-fremd select { width: 100%; max-width: 420px; }
-.wiz-fremd-liste { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
+.wiz-fremd-liste { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.wiz-fremd-chip {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 11px;
- padding: 3px 6px 3px 10px;
- border-radius: var(--r-pill);
+ padding: 4px 6px 4px 12px;
+ border-radius: 6px;
border: 1px dashed var(--line);
color: var(--text-muted);
}
@@ -5161,16 +5148,16 @@ tr.is-menu-open { background: var(--surface-alt); }
/* Hinweis anstelle eines Schritts, der gerade nicht möglich ist */
.wiz-sperre {
- padding: 18px 20px;
+ padding: 20px 20px;
border: 1px dashed var(--line);
border-radius: var(--r-lg);
background: var(--surface-alt);
}
-.wiz-sperre b { display: block; font-size: 14px; margin-bottom: 6px; }
+.wiz-sperre b { display: block; font-size: 13px; margin-bottom: 6px; }
.wiz-sperre p { margin: 0 0 8px; font-size: 13px; color: var(--text-muted); max-width: 58ch; }
.wiz-sperre p:last-child { margin-bottom: 0; }
-.wiz-schalter { display: flex; align-items: center; gap: 9px; font-size: 13.5px; cursor: pointer; }
+.wiz-schalter { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.wiz-schalter input { width: 16px; height: 16px; accent-color: var(--accent); }
/* Terminplan-Tabelle */
@@ -5183,9 +5170,9 @@ tr.is-menu-open { background: var(--surface-alt); }
.wiz-plan-zeile {
display: grid;
grid-template-columns: 78px 62px 1fr 64px 170px;
- gap: 10px;
- padding: 7px 12px;
- font-size: 12.5px;
+ gap: 8px;
+ padding: 8px 12px;
+ font-size: 13px;
border-bottom: 1px solid var(--line-soft);
font-variant-numeric: tabular-nums;
}
@@ -5195,27 +5182,26 @@ tr.is-menu-open { background: var(--surface-alt); }
.wiz-plan-zeile span:nth-child(4) { text-align: right; }
.wiz-plan-kopf {
background: var(--surface-alt);
- font-size: 10.5px;
- font-weight: 600;
- letter-spacing: .05em;
- text-transform: uppercase;
+ font-size: 11px;
+ font-weight: 500;
+ letter-spacing: 0;
color: var(--text-subtle);
}
-.wiz-plan-summe { background: var(--surface-alt); font-weight: 600; }
+.wiz-plan-summe { background: var(--surface-alt); font-weight: 500; }
/* Zusammenfassung */
-.wiz-pruef { font-size: 13.5px; }
+.wiz-pruef { font-size: 13px; }
.wiz-pruef-zeile {
display: flex;
justify-content: space-between;
- gap: 18px;
- padding: 7px 0;
+ gap: 16px;
+ padding: 8px 0;
border-bottom: 1px solid var(--line-soft);
}
.wiz-pruef-zeile:last-child { border-bottom: none; }
.wiz-pruef-zeile span { color: var(--text-muted); flex: 0 0 auto; }
.wiz-pruef-zeile b { font-weight: 500; text-align: right; min-width: 0; overflow-wrap: anywhere; }
-.wiz-pruef-zeile b.fehlt { color: var(--text-subtle); font-weight: 400; font-style: italic; }
+.wiz-pruef-zeile b.fehlt { color: var(--text-subtle); font-weight: 400; font-style: normal; }
/* Abschluss */
.wiz-fertig { text-align: center; padding: 44px 24px; }
@@ -5229,8 +5215,8 @@ tr.is-menu-open { background: var(--surface-alt); }
background: var(--green);
color: #fff;
}
-.wiz-fertig h3 { margin: 0 0 8px; font-size: 20px; font-weight: 600; }
-.wiz-fertig p { margin: 0 auto 20px; color: var(--text-muted); max-width: 46ch; font-size: 13.5px; }
+.wiz-fertig h3 { margin: 0 0 8px; font-size: 19px; font-weight: 500; }
+.wiz-fertig p { margin: 0 auto 20px; color: var(--text-muted); max-width: 46ch; font-size: 13px; }
@media (max-width: 760px) {
.wiz-zeile { grid-template-columns: 1fr; }
@@ -5406,17 +5392,17 @@ html[data-theme="dark"] .login-seite { --login-zahl: #4f7695; --login-jahr: var(
position: relative; z-index: 1;
width: 100%; max-width: 1180px; min-height: 100%; margin: 0 auto;
display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
- gap: clamp(32px, 7vw, 110px); align-items: center;
+ gap: clamp(32px, 7vw, 108px); align-items: center;
padding-block: calc(48px + env(safe-area-inset-top, 0px)) calc(48px + env(safe-area-inset-bottom, 0px));
}
.login-titel { margin: 0 0 6px; font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 500; font-size: 30px; letter-spacing: -.01em; }
-.login-unter { margin: 0 0 30px; color: var(--text-muted); }
+.login-unter { margin: 0 0 28px; color: var(--text-muted); }
-.login-form { display: grid; gap: 18px; }
-.login-feld { display: grid; gap: 7px; }
-.login-feld label { font-size: 13.5px; font-weight: 600; color: var(--text); }
+.login-form { display: grid; gap: 16px; }
+.login-feld { display: grid; gap: 8px; }
+.login-feld label { font-size: 13.5px; font-weight: 500; color: var(--text); }
.login-feld input {
- width: 100%; box-sizing: border-box; min-height: 46px; padding: 11px 13px;
+ width: 100%; box-sizing: border-box; min-height: 46px; padding: 12px 12px;
font: inherit; font-size: 15px; color: var(--text);
background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg);
transition: border-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
@@ -5428,18 +5414,18 @@ html[data-theme="dark"] .login-seite { --login-zahl: #4f7695; --login-jahr: var(
.login-pw input { padding-right: 96px; }
.login-pw-toggle {
position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
- font: inherit; font-size: 12.5px; font-weight: 600; color: var(--accent);
- background: transparent; border: 0; border-radius: var(--r-md); padding: 7px 10px; cursor: pointer;
+ font: inherit; font-size: 12.5px; font-weight: 500; color: var(--accent);
+ background: transparent; border: 0; border-radius: var(--r-md); padding: 8px 12px; cursor: pointer;
}
.login-pw-toggle:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.login-pw-toggle:focus-visible, .login-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
-.login-caps { margin: 0; font-size: 12.5px; font-weight: 600; color: var(--amber); }
+.login-caps { margin: 0; font-size: 12.5px; font-weight: 500; color: var(--amber); }
.login-fehler {
- margin: 0; padding: 10px 12px; border-radius: var(--r-lg); font-size: 13.5px; line-height: 1.45;
+ margin: 0; padding: 12px 12px; border-radius: var(--r-lg); font-size: 13.5px; line-height: 1.45;
color: var(--red); background: color-mix(in srgb, var(--red) 10%, transparent);
}
.login-btn {
- display: inline-flex; align-items: center; justify-content: center; gap: 10px;
+ display: inline-flex; align-items: center; justify-content: center; gap: 8px;
width: 100%; min-height: 48px; margin-top: 4px;
font: inherit; font-size: 15px; font-weight: 650; color: #fff;
background: var(--accent); border: 0; border-radius: var(--r-lg); cursor: pointer;
@@ -5457,7 +5443,7 @@ html[data-theme="dark"] .login-btn { color: #0b1c26; }
}
.login-btn.laedt .login-spinner { display: block; }
@keyframes login-dreh { to { transform: rotate(360deg); } }
-.login-hilfe { margin: 18px 0 0; font-size: 13px; color: var(--text-muted); }
+.login-hilfe { margin: 16px 0 0; font-size: 13px; color: var(--text-muted); }
.login-woche { justify-self: end; text-align: right; animation: login-auf .7s var(--ease-out) both; }
@keyframes login-auf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@@ -5465,21 +5451,21 @@ html[data-theme="dark"] .login-btn { color: #0b1c26; }
.login-kw-label { display: block; font-weight: 500; font-size: 22px; color: var(--text-muted); letter-spacing: .02em; }
.login-kw-zahl {
display: block; font-weight: 300; font-size: clamp(150px, 21vw, 300px); line-height: .86;
- letter-spacing: -.05em; color: var(--login-zahl); font-variant-numeric: tabular-nums;
+ letter-spacing: 0; color: var(--login-zahl); font-variant-numeric: tabular-nums;
}
.login-kw-jahr { display: block; font-weight: 500; font-size: 20px; color: var(--login-jahr); }
-.login-tage { list-style: none; margin: 30px 0 0; padding: 0; display: flex; gap: 8px; justify-content: flex-end; }
+.login-tage { list-style: none; margin: 28px 0 0; padding: 0; display: flex; gap: 8px; justify-content: flex-end; }
.login-tage li {
- display: grid; justify-items: center; gap: 2px; width: 58px; padding: 10px 0 9px;
+ display: grid; justify-items: center; gap: 2px; width: 58px; padding: 12px 0 8px;
border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line);
}
-.login-tage li span { font-size: 12px; font-weight: 600; color: var(--text-muted); }
+.login-tage li span { font-size: 12px; font-weight: 500; color: var(--text-muted); }
.login-tage li b { font-weight: 500; font-size: 20px; font-variant-numeric: tabular-nums; }
.login-tage li.ist-heute { background: var(--accent); border-color: var(--accent); }
.login-tage li.ist-heute span, .login-tage li.ist-heute b { color: #fff; }
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) .login-tage li.ist-heute span, html:not([data-theme="light"]) .login-tage li.ist-heute b { color: #0b1c26; } }
html[data-theme="dark"] .login-tage li.ist-heute span, html[data-theme="dark"] .login-tage li.ist-heute b { color: #0b1c26; }
-.login-datum { margin: 18px 0 0; color: var(--text-muted); font-size: 15px; }
+.login-datum { margin: 16px 0 0; color: var(--text-muted); font-size: 15px; }
@media (max-width: 880px) {
.login-raster { grid-template-columns: 1fr; gap: 28px; padding-block: calc(28px + env(safe-area-inset-top, 0px)) 48px; align-content: start; }
@@ -5493,13 +5479,13 @@ html[data-theme="dark"] .login-tage li.ist-heute span, html[data-theme="dark"] .
/* ---------- Dashboard: Meine Projekte + Monatskalender (Entwurf B) ---------- */
.dash-zonen { grid-template-columns: minmax(0, 1fr) 340px; }
-.dash-proj { margin-bottom: 10px; }
-.dash-proj-kopf { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 12px 16px 4px; }
-.dash-proj-kopf { align-items: center; padding-bottom: 10px; }
-.dash-proj.ist-zu .dash-proj-kopf { padding-top: 10px; }
+.dash-proj { margin-bottom: 8px; }
+.dash-proj-kopf { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; flex-wrap: wrap; padding: 12px 16px 4px; }
+.dash-proj-kopf { align-items: center; padding-bottom: 12px; }
+.dash-proj.ist-zu .dash-proj-kopf { padding-top: 12px; }
.dash-proj-toggle { flex: 1 1 260px; min-width: 0; display: flex; align-items: baseline; gap: 0; padding: 0; border: 0; background: none; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.dash-proj-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--r-sm); }
-.dash-proj-titel { font-weight: 650; font-size: 14px; }
+.dash-proj-titel { font-weight: 500; font-size: 13px; }
/* Die allgemeine Knopfregel (button:hover → Akzentfläche, :active →
Stauchen) ist spezifischer als eine einzelne Klasse und färbte den
Projektkopf beim Zeigen blau ein — der Titel verschwand darin. Diese
@@ -5517,51 +5503,53 @@ button.dash-kal-nav:active, button.dash-kal-tag:active { transform: none; }
.dash-proj-toggle:hover .dash-proj-titel,
.dash-proj-toggle:hover .dash-proj-chev { color: var(--accent); }
button.dash-proj-alle:hover { text-decoration: underline; }
-.dash-proj-chev { display: inline-block; width: 16px; margin-right: 6px; font-size: 17px; line-height: 1; text-align: center; color: var(--text-subtle); transform: rotate(90deg); transition: transform var(--dur, 150ms) var(--ease-out, ease); }
+.dash-proj-chev { display: inline-block; width: 16px; margin-right: 6px; font-size: 19px; line-height: 1; text-align: center; color: var(--text-subtle); transform: rotate(90deg); transition: transform var(--dur, 150ms) var(--ease-out, ease); }
.dash-proj.ist-zu .dash-proj-chev { transform: rotate(0deg); }
.dash-proj.ist-zu .dash-proj-inhalt { display: none; }
.dash-proj-kurz { display: none; gap: 6px; }
.dash-proj.ist-zu .dash-proj-kurz { display: flex; }
-.dash-proj-zahl { font-size: 10.5px; padding: 1px 7px; border-radius: var(--r-pill); background: var(--surface-sunk); color: var(--text-muted); white-space: nowrap; }
-.dash-proj-zahl.ist-rot { background: color-mix(in srgb, var(--red) 12%, transparent); color: var(--red); font-weight: 600; }
-.dash-proj-oeffnen { font-size: 11.5px; color: var(--accent); text-decoration: none; }
+.dash-proj-zahl { font-size: 11px; padding: 1px 8px; border-radius: 6px; background: var(--surface-sunk); color: var(--text-muted); white-space: nowrap; }
+.dash-proj-zahl.ist-rot { background: color-mix(in srgb, var(--red) 12%, transparent); color: var(--red); font-weight: 500; }
+/* Offene Aufgaben im Akzentblau (Eriks Wunsch); „0 offen“ bleibt grau. */
+.dash-proj-zahl.ist-offen { background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); font-weight: 500; }
+.dash-proj-oeffnen { font-size: 12px; color: var(--accent); text-decoration: none; }
.dash-proj-oeffnen:hover { text-decoration: underline; }
-.dash-proj-alle { margin-left: auto; padding: 2px 4px; border: 0; background: none; color: var(--accent); font: inherit; font-size: 11.5px; cursor: pointer; }
+.dash-proj-alle { margin-left: auto; padding: 2px 4px; border: 0; background: none; color: var(--accent); font: inherit; font-size: 12px; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .dash-proj-chev { transition: none; } }
.dash-proj-nr { font-family: ui-monospace, 'SF Mono', monospace; font-size: 11px; color: var(--text-subtle); font-weight: 500; margin-right: 8px; }
.dash-rollen { display: flex; gap: 4px; flex-wrap: wrap; }
-.dash-rolle { font-size: 10.5px; font-weight: 600; padding: 1px 8px; border-radius: var(--r-pill); background: var(--accent-soft); color: var(--accent); }
+.dash-rolle { font-size: 11px; font-weight: 500; padding: 1px 8px; border-radius: 6px; background: var(--accent-soft); color: var(--accent); }
.dash-rolle.ist-neben { background: transparent; border: 1px dashed var(--line); color: var(--text-muted); }
.dash-proj-sub { padding: 2px 16px 8px; }
-.dash-proj-phase { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--text-muted); max-width: 320px; }
+.dash-proj-phase { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-muted); max-width: 320px; }
.dash-proj-phase .dash-auf-bar i { background: var(--green); }
.dash-proj-phase.is-leer { color: var(--text-subtle); }
.dash-proj-termine { border-top: 1px solid var(--line-soft); }
-.dash-proj-mehr { display: block; padding: 8px 16px; font-size: 11.5px; color: var(--accent); text-decoration: none; border-top: 1px solid var(--line-soft); }
-.dash-termin { display: flex; align-items: center; gap: 10px; padding: 8px 16px; border-bottom: 1px solid var(--line-soft); color: inherit; text-decoration: none; }
+.dash-proj-mehr { display: block; padding: 8px 16px; font-size: 12px; color: var(--accent); text-decoration: none; border-top: 1px solid var(--line-soft); }
+.dash-termin { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--line-soft); color: inherit; text-decoration: none; }
.dash-termin:last-child { border-bottom: none; }
a.dash-termin:hover { background: var(--surface-sunk); }
-.dash-termin-art { flex: 0 0 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--surface-sunk); color: var(--text-muted); }
+.dash-termin-art { flex: 0 0 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font-size: 11px; font-weight: 600; background: var(--surface-sunk); color: var(--text-muted); }
.dash-termin-art.ist-meins { background: var(--accent-soft); color: var(--accent); }
.dash-termin-art.ist-ms { background: color-mix(in srgb, var(--meilenstein) 14%, transparent); color: var(--meilenstein); }
.dash-termin-text { flex: 1; min-width: 0; }
.dash-termin-titel { display: block; font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dash-termin-meta { display: block; font-size: 11px; color: var(--text-subtle); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dash-termin-datum { flex: 0 0 auto; text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; }
-.dash-termin-datum em { display: block; font-style: normal; font-size: 10.5px; color: var(--text-subtle); }
+.dash-termin-datum em { display: block; font-style: normal; font-size: 11px; color: var(--text-subtle); }
.dash-termin-datum.ist-ueberfaellig, .dash-termin-datum.ist-ueberfaellig em { color: var(--red); }
.dash-termin-datum.ist-bald { color: var(--amber); }
-.dash-kal { padding: 12px 14px 10px; }
+.dash-kal { padding: 12px 16px 12px; }
.dash-kal-kopf { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
-.dash-kal-kopf b { font-size: 13.5px; }
+.dash-kal-kopf b { font-size: 13px; }
.dash-kal-nav { width: 26px; height: 26px; padding: 0; border: 1px solid var(--line); background: var(--surface); color: var(--text); border-radius: var(--r-sm); cursor: pointer; }
.dash-kal-raster { display: grid; grid-template-columns: 26px repeat(7, 1fr); gap: 2px; font-variant-numeric: tabular-nums; }
-.dash-kal-wt { font-size: 10.5px; color: var(--text-subtle); text-align: center; padding-bottom: 4px; }
-.dash-kal-kw { font-size: 10px; color: var(--text-subtle); display: grid; place-items: center; }
-.dash-kal-tag { position: relative; aspect-ratio: 1; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--text); font: inherit; font-size: 12.5px; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
+.dash-kal-wt { font-size: 11px; color: var(--text-subtle); text-align: center; padding-bottom: 4px; }
+.dash-kal-kw { font-size: 11px; color: var(--text-subtle); display: grid; place-items: center; }
+.dash-kal-tag { position: relative; aspect-ratio: 1; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--text); font: inherit; font-size: 13px; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.dash-kal-tag:hover { background: var(--surface-sunk); }
.dash-kal-tag.ist-fremd, .dash-kal-tag.ist-frei { color: var(--text-subtle); }
-.dash-kal-tag.ist-heute { color: var(--accent); font-weight: 700; box-shadow: inset 0 0 0 1.5px var(--accent); }
+.dash-kal-tag.ist-heute { color: var(--accent); font-weight: 600; box-shadow: inset 0 0 0 1.5px var(--accent); }
.dash-kal-tag.ist-gewaehlt { background: var(--accent); color: var(--surface); }
.dash-kal-tag:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.dash-kal-punkte { display: flex; gap: 2px; height: 5px; }
@@ -5572,12 +5560,12 @@ i.ist-ms { background: var(--meilenstein); }
i.ist-rot { background: var(--red); }
i.ist-ab { background: var(--text-subtle); }
.dash-kal-tag.ist-gewaehlt .dash-kal-punkte i { background: currentColor; }
-.dash-kal-legende { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; font-size: 10.5px; color: var(--text-muted); }
-.dash-kal-legende span { display: flex; align-items: center; gap: 5px; }
+.dash-kal-legende { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; font-size: 11px; color: var(--text-muted); }
+.dash-kal-legende span { display: flex; align-items: center; gap: 4px; }
.dash-kal-liste { border-top: 1px solid var(--line-soft); }
-.dash-kal-liste-titel { padding: 10px 16px 4px; font-size: 11.5px; font-weight: 600; color: var(--text-muted); }
-.dash-kal-hinweis { padding: 2px 16px 6px; font-size: 11.5px; color: var(--amber); }
-.dash-kal-liste .dash-termin { padding: 7px 16px; }
+.dash-kal-liste-titel { padding: 12px 16px 4px; font-size: 12px; font-weight: 500; color: var(--text-muted); }
+.dash-kal-hinweis { padding: 2px 16px 6px; font-size: 12px; color: var(--amber); }
+.dash-kal-liste .dash-termin { padding: 8px 16px; }
/* Griff zum Ändern der Spaltenbreite im GANTT (js/gantt.js). Ein breiter,
unsichtbarer Greifbereich über der Spaltengrenze; sichtbar wird er erst
@@ -5588,7 +5576,7 @@ i.ist-ab { background: var(--text-subtle); }
}
.gantt-spalten-griff::after {
content: ""; position: absolute; top: 3px; bottom: 3px; left: 3px; width: 3px;
- border-radius: 2px; background: var(--accent); opacity: 0; transition: opacity .15s;
+ border-radius: 4px; background: var(--accent); opacity: 0; transition: opacity .15s;
}
.gantt-spalten-griff:hover::after,
.gantt-spalte-zieht .gantt-spalten-griff::after { opacity: .7; }
@@ -5600,7 +5588,7 @@ i.ist-ab { background: var(--text-subtle); }
#glockeBtn.hat-neue { color: var(--accent); }
.glocke-zahl {
position: absolute; top: -3px; right: -3px; min-width: 17px; height: 17px; padding: 0 4px;
- border-radius: 999px; background: var(--red); color: #fff; font-size: 10px; font-weight: 700;
+ border-radius: 999px; background: var(--red); color: #fff; font-size: 11px; font-weight: 600;
line-height: 17px; text-align: center; box-shadow: 0 0 0 2px var(--bg);
}
.glocke-menue {
@@ -5609,23 +5597,23 @@ i.ist-ab { background: var(--text-subtle); }
background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--r-lg);
box-shadow: var(--sh-3);
}
-.glocke-kopf { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px 8px; position: sticky; top: 0; background: inherit; }
+.glocke-kopf { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px 8px; position: sticky; top: 0; background: inherit; }
.glocke-kopf b { font-size: 13px; }
-.glocke-alle { padding: 2px 4px; border: 0; background: none !important; color: var(--accent); font: inherit; font-size: 11.5px; cursor: pointer; box-shadow: none !important; }
+.glocke-alle { padding: 2px 4px; border: 0; background: none !important; color: var(--accent); font: inherit; font-size: 12px; cursor: pointer; box-shadow: none !important; }
.glocke-alle:hover { text-decoration: underline; }
-.glocke-leer { padding: 10px 14px 16px; font-size: 12.5px; color: var(--text-subtle); line-height: 1.5; }
+.glocke-leer { padding: 12px 16px 16px; font-size: 13px; color: var(--text-subtle); line-height: 1.5; }
.glocke-eintrag {
- display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 10px 14px;
+ display: flex; align-items: flex-start; gap: 8px; width: 100%; padding: 12px 16px;
border: 0; border-top: 1px solid var(--line-soft); border-radius: 0; background: none; color: var(--text);
font: inherit; text-align: left; cursor: pointer; box-shadow: none;
}
.glocke-eintrag:hover { background: var(--surface-sunk); }
.glocke-eintrag:active { transform: none; }
-.glocke-punkt { flex: 0 0 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: transparent; }
+.glocke-punkt { flex: 0 0 8px; height: 8px; margin-top: 4px; border-radius: 50%; background: transparent; }
.glocke-eintrag.ist-neu .glocke-punkt { background: var(--accent); }
.glocke-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.glocke-titel { font-size: 13px; font-weight: 500; }
-.glocke-eintrag.ist-neu .glocke-titel { font-weight: 650; }
+.glocke-eintrag.ist-neu .glocke-titel { font-weight: 500; }
.glocke-meta { font-size: 11px; color: var(--text-subtle); }
.dash-neu .glocke-eintrag:first-child { border-top: 0; }
#dashNeu:empty { display: none; }
@@ -5636,7 +5624,7 @@ i.ist-ab { background: var(--text-subtle); }
.glocke-aktionen { display: flex; gap: 6px; }
.glocke-loeschen {
flex: 0 0 34px; padding: 0; border: 0; border-radius: 0; background: none !important; box-shadow: none !important;
- color: var(--text-subtle); font-size: 18px; line-height: 1; cursor: pointer; opacity: .55;
+ color: var(--text-subtle); font-size: 19px; line-height: 1; cursor: pointer; opacity: .55;
}
.glocke-zeile:hover .glocke-loeschen, .glocke-loeschen:focus-visible { opacity: 1; }
.glocke-loeschen:hover { color: var(--red); }
@@ -5901,47 +5889,47 @@ font[color="#b25000" i] { color: var(--rt-orange) !important; }
renderLoad() in js/load/load.js). Je Person: Projektanzahl, Wert dieser
Woche, zwölf Wochensäulen mit gestrichelter 100-%-Linie, Hinweis auf die
Spitze und die größten Projekte. */
-.load-erklaerung { margin: 4px 0 14px; max-width: 900px; line-height: 1.5; }
-.load-karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
+.load-erklaerung { margin: 4px 0 12px; max-width: 900px; line-height: 1.5; }
+.load-karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; }
.load-karte {
background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--r-lg);
- padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; min-width: 0;
+ padding: 16px 20px; display: flex; flex-direction: column; gap: 8px; min-width: 0;
}
.load-karte.ist-ohne { opacity: .75; }
.load-karte-kopf { display: flex; align-items: center; gap: 12px; }
.load-ava {
width: 36px; height: 36px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
- font-size: 11.5px; font-weight: 700; background: var(--accent); color: #fff;
+ font-size: 12px; font-weight: 600; background: var(--accent); color: #fff;
}
.load-karte-wer { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
-.load-karte-wer b { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.load-karte-wer b { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.load-karte-wer > span { font-size: 12px; color: var(--text-muted); }
.load-karte-wer .load-capacity { align-self: flex-start; margin: 2px 0 0; }
.load-jetzt { display: flex; flex-direction: column; align-items: flex-end; text-align: right; flex: none; }
-.load-jetzt b { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.1; }
+.load-jetzt b { font-size: 24px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.1; }
.load-jetzt span { font-size: 11px; color: var(--text-muted); }
.load-saeulen {
position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px;
align-items: end; height: 86px; padding-top: 4px;
}
-.load-saeule { display: block; border-radius: 4px 4px 2px 2px; opacity: .85; min-height: 0; }
+.load-saeule { display: block; border-radius: 4px 4px 4px 4px; opacity: .85; min-height: 0; }
.load-saeule.ist-jetzt { opacity: 1; }
.load-saeule.ist-teil { background-image: repeating-linear-gradient(135deg, transparent 0 4px, rgba(255,255,255,.35) 4px 7px); }
.load-saeule.ist-abwesend { height: 100%; opacity: 1; background: repeating-linear-gradient(135deg, var(--surface-sunk) 0 5px, var(--line) 5px 10px); }
.load-linie { position: absolute; left: 0; right: 0; border-top: 1.5px dashed var(--text-muted); opacity: .55; pointer-events: none; }
-.load-kws { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px; font-size: 10px; color: var(--text-muted); text-align: center; font-variant-numeric: tabular-nums; }
-.load-kws .ist-jetzt { color: var(--accent); font-weight: 700; }
-.load-hinweis { font-size: 12.5px; padding: 8px 10px; border-radius: 10px; line-height: 1.4; }
+.load-kws { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px; font-size: 11px; color: var(--text-muted); text-align: center; font-variant-numeric: tabular-nums; }
+.load-kws .ist-jetzt { color: var(--accent); font-weight: 600; }
+.load-hinweis { font-size: 13px; padding: 8px 12px; border-radius: 10px; line-height: 1.4; }
.load-hinweis.ist-rot { background: color-mix(in srgb, var(--red) 12%, transparent); color: var(--red); }
.load-hinweis.ist-gelb { background: color-mix(in srgb, var(--amber) 12%, transparent); color: var(--amber); }
.load-hinweis.ist-ok { background: color-mix(in srgb, var(--green) 10%, transparent); color: var(--green); }
.load-hinweis.ist-leer { background: var(--surface-sunk); color: var(--text-muted); }
.load-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.load-chip {
- display: inline-flex; align-items: center; min-height: 24px; max-width: 100%; padding: 0 9px; border-radius: 999px;
- background: var(--surface-sunk); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+ display: inline-flex; align-items: center; min-height: 24px; max-width: 100%; padding: 0 8px; border-radius: 6px;
+ background: var(--surface-sunk); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
-.load-chip.ist-mehr { color: var(--text-muted); border: 0; font: inherit; font-size: 11.5px; cursor: pointer; }
+.load-chip.ist-mehr { color: var(--text-muted); border: 0; font: inherit; font-size: 12px; cursor: pointer; }
.load-chip.ist-mehr:hover { color: var(--accent); }
.load-chips:not(.ist-offen) .load-chip.ist-weitere { display: none; }
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) .load-ava { color: #0b141b; } }
@@ -5958,41 +5946,41 @@ html[data-theme="dark"] .load-ava { color: #0b141b; }
.rr-rolle {
display: flex; flex-direction: column; gap: 2px; text-align: left; width: 100%;
border: 1px solid var(--line); background: var(--surface); color: var(--text);
- border-radius: 12px; padding: 10px 12px; font: inherit; cursor: pointer;
+ border-radius: 12px; padding: 12px 12px; font: inherit; cursor: pointer;
}
.rr-rolle:hover { border-color: var(--accent); }
.rr-rolle.ist-aktiv { border-color: var(--accent); background: var(--accent-soft); }
-.rr-rolle b { font-weight: 600; }
+.rr-rolle b { font-weight: 500; }
.rr-rolle small { color: var(--text-muted); font-size: 12px; }
-.rr-balken { display: block; height: 4px; border-radius: 2px; background: var(--surface-sunk); overflow: hidden; margin-top: 4px; }
+.rr-balken { display: block; height: 4px; border-radius: 4px; background: var(--surface-sunk); overflow: hidden; margin-top: 4px; }
.rr-balken i { display: block; height: 100%; background: var(--accent); }
.rr-plus {
border: 1.5px dashed var(--line) !important; background: transparent; color: var(--accent);
- border-radius: 12px; padding: 10px 12px; text-align: left; font: inherit; font-weight: 600; cursor: pointer; width: 100%;
+ border-radius: 12px; padding: 12px 12px; text-align: left; font: inherit; font-weight: 500; cursor: pointer; width: 100%;
}
.rr-plus:hover { border-color: var(--accent) !important; background: var(--accent-soft); }
-.rr-neu { border: 1.5px solid var(--accent); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 8px; background: var(--surface); }
+.rr-neu { border: 1.5px solid var(--accent); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 8px; background: var(--surface); }
.rr-neu input, .rr-neu select { width: 100%; box-sizing: border-box; }
.rr-neu label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--text-muted); }
.rr-neu-knoepfe { display: flex; gap: 6px; }
-.rr-detail { border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
-.rr-detail-kopf { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
+.rr-detail { border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
+.rr-detail-kopf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rr-titel {
- font: inherit; font-size: 18px; font-weight: 600; flex: 1 1 180px; min-width: 0;
+ font: inherit; font-size: 19px; font-weight: 500; flex: 1 1 180px; min-width: 0;
border: 1px solid transparent !important; background: transparent !important; color: var(--text); border-radius: 8px; padding: 4px 8px;
}
.rr-titel:hover:not(:disabled), .rr-titel:focus { border-color: var(--line) !important; background: var(--surface-sunk) !important; }
.rr-titel:disabled { color: var(--text); opacity: 1; }
-.rr-vergleich-wahl { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-muted); }
-.rr-meldung { font-size: 12.5px; color: var(--text-muted); min-width: 80px; }
+.rr-vergleich-wahl { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
+.rr-meldung { font-size: 13px; color: var(--text-muted); min-width: 80px; }
.rr-gruppen { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.rr-gruppe { background: var(--surface-sunk); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 4px; }
.rr-gruppe-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.rr-gruppe-kopf small { color: var(--text-muted); }
.rr-luecke { flex: 1; }
-.rr-zeile { display: flex; align-items: center; gap: 10px; padding: 4px 0; }
+.rr-zeile { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.rr-name { flex: 1; min-width: 0; }
-.rr-name small { display: block; color: var(--text-muted); font-size: 11.5px; }
+.rr-name small { display: block; color: var(--text-muted); font-size: 12px; }
.rr-schalter {
width: 36px; height: 20px; border-radius: 999px; border: 0 !important; padding: 0; flex: none; position: relative; cursor: pointer;
background: color-mix(in srgb, var(--text) 22%, transparent); transition: background var(--dur, 150ms);
@@ -6006,7 +5994,7 @@ html[data-theme="dark"] .load-ava { color: #0b141b; }
.rr-schalter:disabled { opacity: .55; cursor: not-allowed; }
.rr-schalter:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.rr-vergleich { font-size: 11px; color: var(--text-muted); min-width: 34px; text-align: right; }
-.rr-vergleich.ist-anders { color: var(--accent); font-weight: 700; }
+.rr-vergleich.ist-anders { color: var(--accent); font-weight: 600; }
/* =========================================================================
RUNDGANG (js/einfuehrung.js) — abgedunkelte Ebene mit Aussparung um das
@@ -6024,26 +6012,26 @@ html[data-theme="dark"] .load-ava { color: #0b141b; }
.tour.ohne-ziel .tour-loch { display: none; }
.tour-blase {
position: fixed; width: min(360px, calc(100vw - 24px)); box-sizing: border-box;
- background: var(--surface); color: var(--text); border-radius: 16px; padding: 16px 18px;
+ background: var(--surface); color: var(--text); border-radius: 16px; padding: 16px 20px;
box-shadow: var(--sh-3); display: flex; flex-direction: column; gap: 8px; outline: none;
transition: left .25s var(--ease-out, ease), top .25s var(--ease-out, ease);
}
html.glas .tour-blase { background: var(--glas-dicht, var(--surface)); -webkit-backdrop-filter: blur(24px) saturate(160%); backdrop-filter: blur(24px) saturate(160%); }
.tour-blase.ist-unten { left: 12px !important; right: 12px; width: auto; top: auto !important; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
.tour-kopf { display: flex; align-items: center; justify-content: space-between; }
-.tour-schritt { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); font-weight: 600; }
-.tour-x { border: 0 !important; background: transparent; color: var(--text-muted); font-size: 20px; line-height: 1; padding: 0 4px; cursor: pointer; }
+.tour-schritt { font-size: 11px; letter-spacing: 0; color: var(--text-muted); font-weight: 500; }
+.tour-x { border: 0 !important; background: transparent; color: var(--text-muted); font-size: 19px; line-height: 1; padding: 0 4px; cursor: pointer; }
.tour-x:hover { color: var(--text); }
-.tour-blase h3 { margin: 0; font-size: 17px; font-weight: 650; text-wrap: balance; }
-.tour-text { font-size: 13.5px; line-height: 1.55; color: var(--text); }
-.tour-hinweise { margin: 8px 0 0; padding-left: 18px; color: var(--text-muted); }
+.tour-blase h3 { margin: 0; font-size: 19px; font-weight: 500; text-wrap: balance; }
+.tour-text { font-size: 13px; line-height: 1.55; color: var(--text); }
+.tour-hinweise { margin: 8px 0 0; padding-left: 20px; color: var(--text-muted); }
.tour-punkte { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 2px; }
.tour-punkte i { width: 6px; height: 6px; border-radius: 50%; background: var(--line); }
.tour-punkte i.ist-erledigt { background: color-mix(in srgb, var(--accent) 45%, transparent); }
-.tour-punkte i.ist-aktiv { background: var(--accent); width: 16px; border-radius: 3px; }
+.tour-punkte i.ist-aktiv { background: var(--accent); width: 16px; border-radius: 4px; }
.tour-knoepfe { display: flex; align-items: center; gap: 6px; margin-top: 4px; }
.tour-luecke { flex: 1; }
-.tour-skip { border: 0 !important; background: transparent; color: var(--text-muted); font: inherit; font-size: 12.5px; padding: 4px 0; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
+.tour-skip { border: 0 !important; background: transparent; color: var(--text-muted); font: inherit; font-size: 13px; padding: 4px 0; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.tour-skip:hover { color: var(--text); }
@media (prefers-reduced-motion: reduce) { .tour-loch, .tour-blase { transition: none; } }
@@ -6063,7 +6051,7 @@ html.glas .tour-blase { background: var(--glas-dicht, var(--surface)); -webkit-b
--abw-verdeckt: #8d9aa6;
}
/* showTab() setzt display:block inline — Abstände deshalb über Geschwister. */
-#abwesenheit > * + * { margin-top: 14px; }
+#abwesenheit > * + * { margin-top: 12px; }
#abwesenheit .legend { margin: 6px 0 0; }
.abw-u { --abw-c: var(--abw-urlaub); }
.abw-k { --abw-c: var(--abw-krank); }
@@ -6080,62 +6068,62 @@ html.glas .tour-blase { background: var(--glas-dicht, var(--surface)); -webkit-b
Kachel. Die Liste rechts bestimmt die Höhe nicht mit (height 0 +
min-height 100 %), sie scrollt innen, wenn die Erfassung kürzer ist. */
.abw-zwei { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: stretch; }
-.abw-spalte { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
+.abw-spalte { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.abw-spalte > .board-list { flex: 1; }
.abw-karten-titel { margin: 0 !important; }
.abw-listen-karte { height: 0; min-height: 100%; }
-.abw-listen-kopf { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 16px 16px 12px; border-bottom: 1px solid var(--line-soft); }
+.abw-listen-kopf { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding: 16px 16px 12px; border-bottom: 1px solid var(--line-soft); }
.abw-listen-zeilen { flex: 1; min-height: 0; overflow-y: auto; }
.abw-karte { padding: 16px; gap: 12px; }
-.abw-fuer { display: flex; align-items: center; gap: 10px; font-size: 13px; flex-wrap: wrap; }
+.abw-fuer { display: flex; align-items: center; gap: 8px; font-size: 13px; flex-wrap: wrap; }
.abw-kreis { cursor: default; }
-.abw-fuer-wahl { margin-left: auto; border-radius: var(--r-pill); font-size: 12.5px; padding: 4px 10px; max-width: 220px; }
-.abw-datumzeile { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; }
+.abw-fuer-wahl { margin-left: auto; border-radius: 8px; font-size: 13px; padding: 4px 12px; max-width: 220px; }
+.abw-datumzeile { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: center; }
.abw-datum {
- display: grid; text-align: left; gap: 0; padding: 10px 13px; cursor: pointer;
+ display: grid; text-align: left; gap: 0; padding: 12px 12px; cursor: pointer;
border: 1px solid var(--line-soft); border-radius: 14px; background: var(--surface-alt); color: var(--text);
font: inherit;
}
.abw-datum:hover { background: var(--surface-sunk); }
-.abw-datum small { font-size: 10.5px; color: var(--text-subtle); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
-.abw-datum b { font-size: 21px; font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 600; letter-spacing: -.01em; }
+.abw-datum small { font-size: 11px; color: var(--text-subtle); letter-spacing: 0; font-weight: 500; }
+.abw-datum b { font-size: 19px; font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 500; letter-spacing: 0; }
.abw-datum span { font-size: 12px; color: var(--text-muted); }
.abw-pfeil { color: var(--text-subtle); }
.abw-arten { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.abw-arten button {
- display: grid; justify-items: center; gap: 5px; padding: 8px 6px; cursor: pointer; font: inherit; font-size: 12.5px;
+ display: grid; justify-items: center; gap: 4px; padding: 8px 6px; cursor: pointer; font: inherit; font-size: 13px;
border: 1px solid var(--line-soft); border-radius: 12px; background: var(--surface-alt); color: var(--text);
}
-.abw-arten button i { width: 18px; height: 6px; border-radius: 3px; background: var(--abw-c); }
-.abw-arten button.ist-an { background: color-mix(in srgb, var(--abw-c) 18%, transparent); border-color: var(--abw-c); font-weight: 600; }
+.abw-arten button i { width: 18px; height: 6px; border-radius: 4px; background: var(--abw-c); }
+.abw-arten button.ist-an { background: color-mix(in srgb, var(--abw-c) 18%, transparent); border-color: var(--abw-c); font-weight: 500; }
.abw-unten { display: flex; gap: 8px; align-items: center; }
-.abw-notiz { flex: 1; min-width: 0; border-radius: var(--r-pill); }
-.abw-fehler { font-size: 12.5px; color: var(--red); }
-.abw-warnung { display: flex; gap: 9px; align-items: flex-start; font-size: 12.5px; border-radius: 12px; padding: 8px 12px; background: color-mix(in srgb, var(--amber) 15%, transparent); }
+.abw-notiz { flex: 1; min-width: 0; border-radius: 8px; }
+.abw-fehler { font-size: 13px; color: var(--red); }
+.abw-warnung { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; border-radius: 12px; padding: 8px 12px; background: color-mix(in srgb, var(--amber) 15%, transparent); }
.abw-warnung::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--amber); margin-top: 6px; }
/* Liste: Zeilen der Projektliste, mit Punkt in Artfarbe und Kapsel */
.abw-zeile.ist-aktiv .board-row-main { background: var(--accent-soft); }
.abw-zeile-name { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.abw-punkt { width: 9px; height: 9px; border-radius: 50%; background: var(--abw-c); flex: none; }
-.abw-tag { font-size: 11px; font-weight: 500; padding: 1px 8px; border-radius: var(--r-pill); border: 1px solid var(--line); color: var(--text-muted); }
+.abw-tag { font-size: 11px; font-weight: 500; padding: 1px 8px; border-radius: 6px; border: 1px solid var(--line); color: var(--text-muted); }
.board-row-actions.abw-fragt { opacity: 1; }
-.abw-leer { padding: 14px 16px; font-size: 12.5px; color: var(--text-muted); }
-.abw-reiter { display: inline-flex; gap: 2px; padding: 3px; border-radius: var(--r-pill); background: var(--surface-sunk); }
-.abw-reiter button { border: 0; background: none; padding: 3px 11px; border-radius: var(--r-pill); font: inherit; font-size: 12px; color: var(--text-muted); cursor: pointer; }
-.abw-reiter button.ist-an { background: var(--surface); color: var(--text); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
+.abw-leer { padding: 16px 16px; font-size: 13px; color: var(--text-muted); }
+.abw-reiter { display: inline-flex; gap: 2px; padding: 4px; border-radius: 8px; background: var(--surface-sunk); }
+.abw-reiter button { border: 0; background: none; padding: 4px 12px; border-radius: 6px; font: inherit; font-size: 12px; color: var(--text-muted); cursor: pointer; }
+.abw-reiter button.ist-an { background: var(--surface); color: var(--text); font-weight: 500; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
/* Team je Gewerk */
.abw-team-kopf {
- margin-top: 26px !important; flex-wrap: wrap; gap: 10px;
+ margin-top: 24px !important; flex-wrap: wrap; gap: 8px;
/* Hinterlegt wie die Karten darunter (.board-list) */
background: var(--surface); border: 1px solid var(--line-soft);
border-radius: var(--r-xl); box-shadow: var(--sh-2);
- padding: 12px 16px; margin-bottom: 14px;
+ padding: 12px 16px; margin-bottom: 12px;
}
.abw-team-steuer { display: inline-flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.abw-monat { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
-.abw-monat strong { min-width: 120px; text-align: center; font-weight: 600; }
+.abw-monat strong { min-width: 120px; text-align: center; font-weight: 500; }
.abw-rund { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); color: var(--text); cursor: pointer; display: grid; place-items: center; padding: 0; flex: none; }
/* Eigener Hover: sonst färbt die allgemeine button:hover-Regel den Kreis
akzentblau. Pfeile als Symbol (icon()) statt der Schriftzeichen ‹ ›, die im
@@ -6144,8 +6132,8 @@ html.glas .tour-blase { background: var(--glas-dicht, var(--surface)); -webkit-b
.abw-rund:active { background: var(--surface-sunk); }
.abw-rund .icon { display: grid; place-items: center; }
.abw-rund svg { width: 16px; height: 16px; display: block; }
-.abw-gewerk-kopf { display: flex; align-items: baseline; gap: 10px; }
-.abw-gewerk-kopf small { color: var(--text-muted); font-size: 12.5px; }
+.abw-gewerk-kopf { display: flex; align-items: baseline; gap: 8px; }
+.abw-gewerk-kopf small { color: var(--text-muted); font-size: 13px; }
#abwesenheit .abw-gewerk-kopf + .abw-tl-karte { margin-top: 8px; }
.abw-tl-karte { overflow-x: auto; }
.abw-tl { display: grid; min-width: 880px; font-size: 11px; }
@@ -6153,10 +6141,10 @@ html.glas .tour-blase { background: var(--glas-dicht, var(--surface)); -webkit-b
.abw-tl { margin-bottom: -1px; }
.abw-tl-tag, .abw-tl-kopf { height: 36px !important; }
.abw-tl-tag { display: grid; align-content: center; justify-items: center; line-height: 1.1; color: var(--text-subtle); font-variant-numeric: tabular-nums; }
-.abw-tl-tag small { font-size: 9px; text-transform: uppercase; letter-spacing: .04em; }
-.abw-tl-tag b { font-size: 11.5px; color: var(--text-muted); font-weight: 600; }
-.abw-tl-tag.ist-heute b { background: var(--red); color: #fff; border-radius: var(--r-pill); padding: 0 5px; }
-.abw-tl-wer { position: sticky; left: 0; z-index: 3; display: flex; align-items: center; gap: 10px; padding: 0 14px; background: var(--surface); }
+.abw-tl-tag small { font-size: 11px; letter-spacing: 0; }
+.abw-tl-tag b { font-size: 12px; color: var(--text-muted); font-weight: 500; }
+.abw-tl-tag.ist-heute b { background: var(--red); color: #fff; border-radius: 6px; padding: 0 4px; }
+.abw-tl-wer { position: sticky; left: 0; z-index: 3; display: flex; align-items: center; gap: 8px; padding: 0 16px; background: var(--surface); }
html.glas .abw-tl-wer { background: var(--glas-deckend, var(--surface)); }
.abw-tl-kopf { color: var(--text-subtle); font-size: 11px; }
.abw-tl-wer.ist-gewaehlt { box-shadow: inset 3px 0 0 var(--accent); }
@@ -6165,16 +6153,16 @@ html.glas .abw-tl-wer { background: var(--glas-deckend, var(--surface)); }
.abw-tl-wer.ist-klickbar:hover .abw-tl-wer-name { color: var(--accent); }
.abw-tl-wer.ist-klickbar:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.abw-tl-wer-text { display: flex; flex-direction: column; min-width: 0; }
-.abw-tl-wer-name { font-weight: 600; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.abw-tl-wer-meta { font-size: 11.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.abw-tl-wer-name { font-weight: 500; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.abw-tl-wer-meta { font-size: 12px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.abw-tl .ist-frei { background: color-mix(in srgb, var(--text-subtle) 7%, transparent); }
.abw-tl-zelle.ist-heute::after { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: var(--red); opacity: .5; z-index: 1; }
.abw-tl-zelle.ist-klickbar { cursor: pointer; }
.abw-tl-zelle.ist-klickbar:hover { background: var(--surface-sunk); }
.abw-balken {
position: absolute; top: 14px; bottom: 14px; left: 2px; z-index: 2; cursor: pointer;
- display: flex; align-items: center; padding: 0 10px; white-space: nowrap; overflow: hidden;
- border-radius: var(--r-pill); font-size: 11px; font-weight: 600; color: var(--text);
+ display: flex; align-items: center; padding: 0 12px; white-space: nowrap; overflow: hidden;
+ border-radius: var(--r-pill); font-size: 11px; font-weight: 500; color: var(--text);
background: color-mix(in srgb, var(--abw-c) 20%, transparent); box-shadow: inset 0 0 0 1px var(--abw-c);
}
.abw-balken::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--abw-c); margin-right: 6px; }
@@ -6200,7 +6188,7 @@ html.glas .abw-tl-wer { background: var(--glas-deckend, var(--surface)); }
.dash-proj-griff:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.dash-proj-griff svg { width: 14px; height: 14px; }
.dash-proj.ist-gezogen { opacity: .5; }
-#dashReihenfolgeReset:not([hidden]) + #dashAlleKnopf { margin-left: 10px; }
+#dashReihenfolgeReset:not([hidden]) + #dashAlleKnopf { margin-left: 8px; }
/* Kürzel-Kreis einer Person mit mehreren Rollen (beteiligtenAvatarHtml(),
js/utils.js): Segmente in den Rollenfarben, weiße Schrift mit Schatten. */
@@ -6217,18 +6205,18 @@ html.glas .abw-tl-wer { background: var(--glas-deckend, var(--surface)); }
/* „Weitere laden“ im Verlauf (weitereLadenKnopf(), js/store.js): holt je
fünf ältere Sitzungen nach — beim Start sind nur die jüngsten geladen. */
-.verlauf-weitere-zeile, .plan-verlauf-mehr-zeile { display: flex; justify-content: center; margin-top: 10px; }
+.verlauf-weitere-zeile, .plan-verlauf-mehr-zeile { display: flex; justify-content: center; margin-top: 8px; }
button.verlauf-weitere { white-space: nowrap; }
/* ---------- Einstellungen: Kalender in Outlook ---------- */
-.kalender-adresse { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 10px 0 6px; }
+.kalender-adresse { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 8px 0 6px; }
.kalender-adresse input { flex: 1; min-width: 220px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.kalender-adresse .button-link {
- display: inline-flex; align-items: center; padding: 7px 16px; border-radius: var(--r-pill);
+ display: inline-flex; align-items: center; padding: 8px 16px; border-radius: 8px;
background: var(--accent); color: #fff; font-size: 13px; font-weight: 500; text-decoration: none; white-space: nowrap;
}
.kalender-adresse .button-link:hover { background: var(--accent-hover); }
-.kalender-anleitung { margin: 6px 0 10px; font-size: 13px; }
+.kalender-anleitung { margin: 6px 0 8px; font-size: 13px; }
.kalender-anleitung summary { cursor: pointer; color: var(--accent); }
.kalender-anleitung ol { margin: 8px 0; padding-left: 20px; display: grid; gap: 6px; }
.kalender-aktionen { display: flex; gap: 8px; }
@@ -6236,18 +6224,18 @@ button.verlauf-weitere { white-space: nowrap; }
/* ---------- Admin → Teams (loadAdminTeams(), js/admin/admin.js) ----------
Eigene Klassen statt .settings-field: das Adressfeld ist lang (≈ 300
Zeichen) und braucht eine breite, mehrzeilige Fläche. */
-#adminTeamsInhalt { display: grid; gap: 14px; margin: 12px 0 6px; }
+#adminTeamsInhalt { display: grid; gap: 12px; margin: 12px 0 6px; }
.teams-status {
- display: flex; align-items: center; gap: 12px; padding: 12px 14px;
+ display: flex; align-items: center; gap: 12px; padding: 12px 16px;
border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface-sunk);
}
.teams-punkt { width: 10px; height: 10px; border-radius: 50%; background: var(--text-subtle); flex: none; }
.teams-status.ist-an .teams-punkt { background: var(--green); box-shadow: 0 0 0 4px color-mix(in srgb, var(--green) 20%, transparent); }
.teams-status-text { display: grid; gap: 2px; flex: 1; min-width: 0; }
-.teams-status-text b { font-size: 13.5px; }
+.teams-status-text b { font-size: 13px; }
.teams-status-text span { font-size: 12px; color: var(--text-muted); overflow-wrap: anywhere; }
button.teams-text-knopf, button.teams-text-knopf:hover, button.teams-text-knopf:active {
- all: unset; cursor: pointer; font-size: 12.5px; color: var(--accent); white-space: nowrap; padding: 4px 2px;
+ all: unset; cursor: pointer; font-size: 13px; color: var(--accent); white-space: nowrap; padding: 4px 2px;
}
button.teams-text-knopf:hover { text-decoration: underline; }
button.teams-text-knopf:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
@@ -6255,10 +6243,10 @@ button.teams-text-knopf.ist-gefahr { color: var(--red); }
.teams-feld[hidden] { display: none; }
.teams-feld { display: grid; gap: 6px; }
-.teams-feld label { font-size: 12px; font-weight: 600; color: var(--text-muted); }
+.teams-feld label { font-size: 12px; font-weight: 500; color: var(--text-muted); }
.teams-feld textarea {
width: 100%; box-sizing: border-box; resize: vertical; min-height: 64px;
- padding: 10px 12px; border: 1px solid var(--line) !important; border-radius: var(--r-md) !important;
+ padding: 12px 12px; border: 1px solid var(--line) !important; border-radius: var(--r-md) !important;
background: var(--surface) !important; color: var(--text); box-shadow: none !important;
font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-all;
}
@@ -6271,7 +6259,7 @@ button.teams-text-knopf.ist-gefahr { color: var(--red); }
.teams-schalter { display: flex; align-items: center; gap: 12px; cursor: pointer; }
.teams-schalter input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.teams-schalter-bahn {
- flex: none; width: 38px; height: 22px; border-radius: 11px; background: var(--line); position: relative;
+ flex: none; width: 38px; height: 22px; border-radius: 12px; background: var(--line); position: relative;
transition: background var(--dur, 150ms);
}
.teams-schalter-bahn::after {
@@ -6284,8 +6272,213 @@ button.teams-text-knopf.ist-gefahr { color: var(--red); }
.teams-schalter input:disabled + .teams-schalter-bahn { opacity: .45; }
.teams-schalter:has(input:disabled) { cursor: default; }
.teams-schalter-text { display: grid; gap: 2px; }
-.teams-schalter-text b { font-size: 13px; font-weight: 600; }
+.teams-schalter-text b { font-size: 13px; font-weight: 500; }
.teams-schalter-text span { font-size: 12px; color: var(--text-muted); }
.teams-schalter:has(input:disabled) .teams-schalter-text { opacity: .55; }
-.teams-aktionen { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
+.teams-aktionen { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
+
+/* ===========================================================================
+ BAUPLAN — unslop-Überarbeitung (Eriks Wahl „volle Überarbeitung“, 11/2026)
+ ---------------------------------------------------------------------------
+ Richtung: Planköpfe und Raster eines Bauplans. Flächen fast neutral
+ (Graphit, leicht kühl), ein Akzent (Logo-Blau), Farbe nur in den
+ Inhalten (Terminplan, Auslastung, Status). Schriftskala 11/12/13/15/19/24,
+ Gewichte 400/500 (600 selten), keine gesperrten Großbuchstaben, Abstände
+ im 4px-Raster, Rundungen 4–8 (Bedienelemente) / 12–16 (Karten).
+ Kennzeichen: Kalenderwochen, Maße und Kennzahlen in gleich breiten
+ Monospace-Ziffern — überall dieselbe „KW 44“-Marke.
+ Die Durchgänge wurden auf styles.css/plan-styles.css/glas.css angewandt;
+ die Wandtafel (body.wandtafel-aktiv mit ihren dash- und wt-Tokens) ist ausgenommen.
+ Methode nach „unslop“ von Damir Sokolovsky (@heydamir), CC BY 4.0.
+ =========================================================================== */
+:root { --font-mono: ui-monospace, 'SF Mono', 'JetBrains Mono', Menlo, Consolas, monospace; }
+
+/* Kennzeichen: KW-Marke */
+.gantt-day.gantt-week span,
+.range-picker-kw, .range-picker-kw-kopf,
+.dash-kal-kw, .bv-kw, .timeline-kw, .plan-verlauf-kw, .bericht-zuletzt-kw, .load-kws {
+ font-family: var(--font-mono);
+ font-variant-numeric: tabular-nums;
+ font-weight: 400;
+ letter-spacing: 0;
+}
+.gantt-day.gantt-week span { font-size: 11px; color: var(--text-muted); }
+.range-picker-kw, .dash-kal-kw { color: var(--text-subtle); font-size: 11px; }
+
+/* Kennzahlen und Maße in denselben Ziffern */
+.board-nr, .plan-header .projnr, .dash-proj-nr, .dash-auf-pct, .dash-termin-datum,
+.gantt-dates, .plan-task-date, .load-zahl, .load-num, .kpi-value, .plan-kpi-tile .kpi-value,
+.dash-band-zahl {
+ font-variant-numeric: tabular-nums;
+}
+.board-nr, .dash-proj-nr { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0; color: var(--text-muted); }
+
+/* Navigation: ruhige Auswahl — Flächenstufe statt Akzentfläche */
+.nav-item.active { background: var(--surface-sunk); color: var(--text); box-shadow: inset 0 0 0 1px var(--line-soft); }
+.nav-item.active .nav-icon { color: var(--accent); }
+.nav-item { min-height: 32px; }
+.sidebar-section-label { padding: 16px 12px 4px; color: var(--text-subtle); font-weight: 500; }
+
+/* Dunkel: Hauptknöpfe in einem tieferen Logo-Blau, damit die weiße Schrift
+ trägt (auf dem hellen Akzent #86bfdf käme sie nur auf ~2:1). Der helle
+ Akzent bleibt für Auswahl, Links und Kennzahlen. */
+@media (prefers-color-scheme: dark) {
+ html:not([data-theme="light"]) { --knopf: #276f9c; --knopf-hover: #2f7aa8; --knopf-aktiv: #22628a; }
+}
+html[data-theme="dark"] { --knopf: #276f9c; --knopf-hover: #2f7aa8; --knopf-aktiv: #22628a; }
+button { background: var(--knopf, var(--accent)); }
+button:hover { background: var(--knopf-hover, var(--accent-hover)); }
+button:active { background: var(--knopf-aktiv, var(--accent-active)); }
+
+/* Bewegung: nur Farbe/Fläche/Transform, eine Kurve */
+button { transition: background-color var(--dur) var(--ease-out), color var(--dur) var(--ease-out),
+ transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out); }
+
+/* ===========================================================================
+ MEINE AUFGABEN — Entwurf „Bauplan“ (Eriks Wahl, 11/2026)
+ ---------------------------------------------------------------------------
+ Kopf mit Kalenderwoche statt Begrüßung, Band mit vier Kennzahlen, das Band
+ „Diese Woche“ (Mo–Fr) und je Projekt die Zeile „Meine Rolle | Team |
+ Notizen“. Der Monatskalender (.dash-kal-*) bleibt ausdrücklich unverändert.
+ =========================================================================== */
+.dash-kopf { align-items: flex-end; margin-bottom: 16px; }
+.dash-kopf-links { display: flex; flex-direction: column; gap: 4px; }
+.dash-kopf-kw { font-family: var(--font-mono); font-size: 12px; color: var(--text-subtle); font-variant-numeric: tabular-nums; }
+.dash-titel { margin: 0; font-size: 24px; line-height: 32px; font-weight: 500; letter-spacing: 0; }
+.dash-kopf-rechts { align-items: center; gap: 8px; }
+.dash-kopf-label { font-size: 12px; color: var(--text-subtle); }
+.dash-sitzung { font-family: var(--font-mono); font-size: 12px; font-weight: 400; padding: 2px 8px; border: 1px solid var(--line-soft); background: var(--surface); color: var(--text); }
+
+.dash-band { padding: 20px 24px; gap: 24px; background: var(--surface); border: 1px solid var(--line-soft); box-shadow: var(--sh-1); }
+.dash-band.ist-ruhig { background: var(--surface); }
+.dash-befund { font-size: 15px; line-height: 24px; color: var(--text-muted); }
+.dash-befund b { font-size: 1em; }
+.dash-band-zahlen { gap: 32px; }
+.dash-zahl { gap: 2px; min-width: 88px; }
+.dash-zahl span { font-size: 12px; }
+.dash-zahl b { font-size: 24px; line-height: 32px; }
+.dash-zahl.ist-rot b { color: var(--red); }
+
+/* Diese Woche */
+.dash-woche { padding: 16px 20px 16px; overflow: visible; }
+.dash-woche-rahmen { overflow-x: auto; }
+.dash-woche-raster { display: grid; grid-template-columns: repeat(5, minmax(140px, 1fr)); min-width: 700px;
+ border: 1px solid var(--line-soft); border-radius: var(--r-md); overflow: hidden; }
+.dash-woche-tag { display: flex; flex-direction: column; min-width: 0; }
+.dash-woche-tag + .dash-woche-tag { border-left: 1px solid var(--line-soft); }
+.dash-woche-tag.ist-heute { background: color-mix(in srgb, var(--accent) 5%, transparent); }
+.dash-woche-kopf { display: flex; justify-content: space-between; align-items: baseline; padding: 8px 12px; border-bottom: 1px solid var(--line-soft); font-weight: 500; }
+.dash-woche-tag.ist-heute .dash-woche-kopf > span:first-child { color: var(--accent); }
+.dash-woche-datum { font-family: var(--font-mono); font-size: 12px; font-weight: 400; color: var(--text-subtle); }
+.dash-woche-liste { display: flex; flex-direction: column; gap: 8px; padding: 12px; min-height: 120px; }
+.dash-woche-eintrag { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border-radius: 6px; text-decoration: none; color: var(--text);
+ background: var(--surface-sunk); border: 1px solid var(--line-soft); min-width: 0;
+ transition: background-color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out); }
+.dash-woche-eintrag:hover { border-color: var(--line); }
+.dash-woche-eintrag.ist-meins { background: color-mix(in srgb, var(--accent) 10%, var(--surface)); border-color: color-mix(in srgb, var(--accent) 22%, transparent); }
+.dash-woche-eintrag.ist-ms { background: color-mix(in srgb, var(--meilenstein) 10%, var(--surface)); border-color: color-mix(in srgb, var(--meilenstein) 24%, transparent); }
+.dash-woche-eintrag.ist-ueber { background: color-mix(in srgb, var(--red) 8%, var(--surface)); border-color: color-mix(in srgb, var(--red) 24%, transparent); }
+.dash-woche-titel { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dash-woche-projekt { font-size: 12px; color: var(--text-subtle); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dash-woche-leer { font-size: 12px; color: var(--text-subtle); }
+.dash-woche-mehr { font-size: 12px; color: var(--text-muted); }
+.dash-woche-legende { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 12px; font-size: 12px; color: var(--text-muted); }
+.dash-woche-legende span { display: inline-flex; align-items: center; gap: 8px; }
+.dash-woche-legende i { width: 12px; height: 4px; border-radius: 2px; background: var(--text-subtle); }
+.dash-woche-legende i.ist-meins { background: var(--accent); }
+.dash-woche-legende i.ist-ms { width: 8px; height: 8px; border-radius: 1px; transform: rotate(45deg); background: var(--meilenstein); }
+.dash-woche-legende i.ist-ueber { background: var(--red); }
+
+/* Projektblock: Meine Rolle | Team | Notizen */
+.dash-proj-kopf .dash-proj-titel { font-size: 15px; font-weight: 500; }
+.dash-proj-nr { font-family: var(--font-mono); }
+.dash-proj-info { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin: 0 16px 12px;
+ border: 1px solid var(--line-soft); border-radius: var(--r-md); background: var(--surface-alt); }
+.dash-proj-feld { display: flex; flex-direction: column; gap: 4px; padding: 12px 16px; min-width: 0; color: var(--text); text-decoration: none; }
+.dash-proj-feld + .dash-proj-feld { border-left: 1px solid var(--line-soft); }
+.dash-proj-feld-titel { font-size: 12px; color: var(--text-subtle); }
+.dash-proj-feld-wert { display: flex; align-items: center; gap: 8px; min-width: 0; }
+.dash-proj-feld-wert .board-avatar { flex: none; }
+.dash-proj-team { display: inline-flex; flex: none; }
+.dash-proj-team .board-avatar + .board-avatar { margin-left: -6px; }
+.dash-proj-team .board-avatar { box-shadow: 0 0 0 2px var(--glas-deckend, var(--surface)); }
+.dash-proj-namen { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-muted); }
+.dash-proj-notizen { transition: background-color var(--dur) var(--ease-out); }
+.dash-proj-notizen:hover { background: var(--surface-sunk); }
+.dash-proj-notizen .icon { color: var(--text-muted); }
+.dash-proj-notizen b { font-family: var(--font-mono); font-weight: 400; }
+.dash-proj-zuletzt { font-size: 12px; color: var(--text-subtle); white-space: nowrap; }
+@media (max-width: 640px) {
+ .dash-proj-feld + .dash-proj-feld { border-left: 0; border-top: 1px solid var(--line-soft); }
+}
+
+/* ===========================================================================
+ NOTIZEN (Seitenleiste, js/notizen/notizen.js) — nutzt die .notizen-*-Stile
+ des Projekt-Reiters (plan-styles.css), hier nur Kopf, Filter und Zuordnung.
+ =========================================================================== */
+.mn-seite { display: flex; flex-direction: column; gap: 16px; }
+.mn-kopf { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
+.mn-kopf-links { display: flex; flex-direction: column; gap: 4px; }
+.mn-kopf-unter { font-size: 12px; color: var(--text-subtle); }
+.mn-titel { margin: 0; font-size: 24px; line-height: 32px; font-weight: 500; }
+.mn-filter, .mn-zuordnung { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-muted); }
+/* Nur background-color — die Kurzschreibweise „background:“ setzte die Wiederholung zurück,
+ und der Dropdown-Pfeil der globalen select-Regel erschien im Dunkelmodus als Kachelmuster. */
+.mn-filter select, .mn-zuordnung select { height: 32px; padding: 0 28px 0 8px; border: 1px solid var(--line); border-radius: 8px; background-color: var(--surface); color: var(--text); font: inherit; max-width: 360px; }
+.mn-notizen { background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--sh-1); overflow: hidden; min-height: 520px; }
+.mn-editor-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
+.mn-projekt-link { font-size: 13px; color: var(--accent); text-decoration: none; }
+.mn-projekt-link:hover { text-decoration: underline; }
+.mn-hinweis { font-size: 12px; color: var(--text-subtle); }
+.mn-projekt { color: var(--text-muted); }
+.mn-projekt.ist-ohne { color: var(--text-subtle); }
+
+/* ===========================================================================
+ SEITENLEISTE — Gliederung nach Arbeitsbereich (Eriks Wahl „A“, 11/2026)
+ ---------------------------------------------------------------------------
+ Gruppen (.sidebar-gruppe) statt loser Trennlinien: Eigenes, Projekte,
+ Team, Studenten; Einstellungen und Admin unten (.sidebar-unten). Einträge
+ fest 32 px, Icon-Spalte 18 px + 8 px Abstand, Rubrik 16 px über der Gruppe
+ und 4 px über ihren Einträgen. Unterpunkte (geöffnetes Projekt, Admin)
+ Admin-Unterpunkte beginnen auf der Linie der Beschriftungen (12 + 18 + 8 =
+ 38 px), das geöffnete Projekt 8 px tiefer mit Führungslinie.
+ =========================================================================== */
+.sidebar-nav { gap: 0; padding: 12px; }
+.sidebar-gruppe { display: flex; flex-direction: column; gap: 2px; }
+.sidebar-gruppe + .sidebar-gruppe { margin-top: 16px; }
+.sidebar-gruppe.sidebar-unten { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line-soft); }
+.sidebar-gruppe > .sidebar-section-label { padding: 0 12px 4px; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--text-subtle); }
+.sidebar-nav .nav-item { min-height: 32px; height: 32px; padding: 0 12px; gap: 8px; font-weight: 400; color: var(--text-muted); }
+.sidebar-nav .nav-item.active { font-weight: 500; color: var(--text); }
+.sidebar-nav .nav-icon { width: 18px; font-size: 16px; }
+
+/* Geöffnetes Projekt: eingezogen unter „Projekte“, mit feiner Führungslinie */
+.nav-item.nav-unterpunkt { position: relative; padding-left: 46px; }
+.nav-item.nav-unterpunkt .nav-icon { display: none; }
+.nav-item.nav-unterpunkt::before { content: ""; position: absolute; left: 32px; top: 8px; bottom: 8px; width: 1px; background: var(--line); }
+.nav-projnr { font-family: var(--font-mono); font-size: 12px; color: var(--text-subtle); }
+.nav-item.active .nav-projnr { color: var(--accent); }
+
+/* Admin: Unterpunkte auf der Beschriftungslinie, in drei Gruppen */
+.sidebar-subnav { padding-left: 0; gap: 2px; }
+.sidebar-subnav.open { max-height: 900px; }
+/* Zwischenüberschrift: kleiner und heller als die Punkte, mit feiner Linie bis
+ zum Rand — hebt sich ab, ohne gesperrte Großbuchstaben. */
+.sidebar-subgruppe { display: flex; align-items: center; gap: 8px; padding: 12px 12px 4px 38px; font-size: 11px; line-height: 16px; font-weight: 500; color: var(--text-subtle); }
+.sidebar-subgruppe::after { content: ""; flex: 1; height: 1px; background: var(--line-soft); }
+.sidebar-subgruppe:first-child { padding-top: 4px; }
+/* Mit #adminSubnav, weil button.menu-item (Knopf-Grundregel) sonst Einzug und
+ Schriftstärke überschreibt — die Punkte standen dann ganz links und fett,
+ die Zwischenüberschriften wirkten in die Mitte gerutscht. */
+#adminSubnav .sidebar-subitem { min-height: 32px; height: 32px; padding: 0 12px 0 38px; display: flex; align-items: center; border-radius: var(--r-md);
+ font-size: 13px; font-weight: 400; color: var(--text-muted); background: transparent; }
+#adminSubnav .sidebar-subitem:hover { background: var(--surface-sunk); color: var(--text); }
+#adminSubnav .sidebar-subitem.is-active { background: var(--surface-sunk); color: var(--text); font-weight: 500; box-shadow: inset 0 0 0 1px var(--line-soft); }
+
+@media (min-width: 769px) {
+ #headerMenu.side-menu.collapsed .sidebar-gruppe + .sidebar-gruppe { margin-top: 8px; }
+ #headerMenu.side-menu.collapsed .nav-item.nav-unterpunkt { padding-left: 0; }
+ #headerMenu.side-menu.collapsed .nav-item.nav-unterpunkt::before { display: none; }
+ #headerMenu.side-menu.collapsed .nav-item.nav-unterpunkt .nav-icon { display: inline-flex; }
+}
diff --git a/server.js b/server.js
index 3788b63..c4c0d51 100644
--- a/server.js
+++ b/server.js
@@ -1020,6 +1020,30 @@ function htmlEscape(s){
.replace(/"/g, '"').replace(/'/g, ''');
}
+// textMaskieren: wie htmlEscape(), aber ein '&', das schon eine fertige
+// Entity beginnt (& ' …), bleibt stehen. Der Text zwischen den
+// Tags kommt aus gespeichertem HTML, in dem solche Entities ganz normal
+// stehen. htmlEscape() machte daraus bei JEDEM Speichern eine Stufe mehr
+// ( → → &nbsp; …) — Eriks Meldung nach dem
+// Sitzungswechsel KW 45. So bleibt die Bereinigung beliebig oft wiederholbar.
+function textMaskieren(s){
+ return String(s)
+ .replace(/&(?!(?:[a-zA-Z][a-zA-Z0-9]{1,31}|#\d{1,7}|#x[0-9a-fA-F]{1,6});)/g, '&')
+ .replace(//g, '>');
+}
+
+// entitiesEntstapeln: macht gestapelte Maskierung rückgängig
+// (&nbsp; → , & → &). Ein „&“ vor einer
+// weiteren Entity ist immer das Ergebnis des Fehlers oben, nie Absicht.
+function entitiesEntstapeln(html){
+ let alt, neu = String(html || '');
+ do {
+ alt = neu;
+ neu = neu.replace(/&((?:[a-zA-Z][a-zA-Z0-9]{1,31}|#\d{1,7}|#x[0-9a-fA-F]{1,6});)/g, '&$1');
+ } while(neu !== alt);
+ return neu;
+}
+
// sicheresStyleAttribut: lässt aus einem style-Attribut nur color und
// font-weight durch — identisch zur Client-Regel. Rückgabe: bereinigter
// Wert oder '' (dann wird das Attribut ganz weggelassen).
@@ -1108,7 +1132,7 @@ function sanitizeFormatHtml(html){
if(c !== '<'){
const naechstes = quelle.indexOf('<', i);
const text = quelle.slice(i, naechstes === -1 ? quelle.length : naechstes);
- if(!verwerfenBis) aus += htmlEscape(text);
+ if(!verwerfenBis) aus += textMaskieren(text);
i += text.length;
continue;
}
@@ -2611,6 +2635,30 @@ function kommentareVorsatzUmstellen(){
if(n) console.log('Gewerke-Vorsatz aus ' + n + ' Kommentaren entfernt.');
}
+// entitiesReparieren: führt gestapelte Maskierung (&nbsp; …) in
+// allen Sitzungskommentaren und Protokoll-Punkten auf das ursprüngliche
+// Zeichen zurück — Folge des Fehlers in sanitizeFormatHtml() vor
+// textMaskieren(). Läuft bei jedem Start und nach /import, idempotent.
+function entitiesReparieren(){
+ const teile = [
+ ['project_kommentare', 'status', 'week_label, project_id, gewerk', 'week_label = ? AND project_id = ? AND gewerk = ?', r => [r.week_label, r.project_id, r.gewerk]],
+ ['protokoll_punkte', 'text', 'id', 'id = ?', r => [r.id]]
+ ];
+ let n = 0;
+ db.exec('BEGIN');
+ try {
+ teile.forEach(([tab, feld, schluessel, wo, werte]) => {
+ const upd = db.prepare('UPDATE ' + tab + ' SET ' + feld + ' = ? WHERE ' + wo);
+ db.prepare('SELECT ' + schluessel + ', ' + feld + " AS wert FROM " + tab + " WHERE " + feld + " LIKE '%&%'").all().forEach(r => {
+ const neu = entitiesEntstapeln(r.wert);
+ if(neu !== r.wert){ upd.run(neu, ...werte(r)); n++; }
+ });
+ });
+ db.exec('COMMIT');
+ } catch(e){ db.exec('ROLLBACK'); throw e; }
+ if(n) console.log('Doppelt maskierte Zeichen in ' + n + ' Kommentaren/Protokoll-Punkten repariert.');
+}
+
function kommentareSpiegelstricheUmstellen(){
const zeilen = db.prepare("SELECT week_label, project_id, gewerk, status FROM project_kommentare WHERE status != ''").all();
const upd = db.prepare('UPDATE project_kommentare SET status = ? WHERE week_label = ? AND project_id = ? AND gewerk = ?');
@@ -3558,6 +3606,7 @@ einmaligeUmstellung('siemon-anteile-2021', siemon2021Umstellen);
// Idempotent (ein bereits entfernter Vorsatz ist weg) — läuft deshalb bei
// jedem Start und nach /import, damit ältere Backups ihn nicht zurückbringen.
kommentareVorsatzUmstellen();
+entitiesReparieren();
ensureSandboxWeek();
ensureUserPersonIdUniqueIndex();
migrateRetirePeopleTablesIntoUsers();
@@ -7362,6 +7411,68 @@ function notizAnlegen(req, uid, titel, html, quelle){
return notizLesen(id);
}
+// GET /projekt-notizen/anzahl — je Projekt (project_uid) Anzahl und zuletzt
+// geändert, für die Projektblöcke auf „Meine Aufgaben“. Nur Zählung, kein Inhalt.
+app.get('/projekt-notizen/anzahl', requireAuth, (req, res) => {
+ try {
+ const anzahl = {};
+ db.prepare("SELECT project_uid AS uid, COUNT(*) AS n, MAX(geaendert_am) AS zuletzt FROM projekt_notizen WHERE project_uid != '' GROUP BY project_uid")
+ .all().forEach(r => { anzahl[r.uid] = { anzahl: r.n, zuletzt: r.zuletzt || '' }; });
+ res.json({ ok: true, anzahl });
+ } catch(err){
+ console.error('Notizen zählen fehlgeschlagen:', err);
+ res.status(500).json({ ok: false, error: String(err) });
+ }
+});
+
+// ---------- Seitenleiste „Notizen“: alle Notizen meiner Projekte ----------
+//
+// Eriks Wunsch: ein eigener Bereich, in dem jedes Konto die Notizen ALLER
+// seiner Projekte sieht und auch projektunabhängige Notizen anlegt, die sich
+// später einem Projekt zuordnen lassen. Eine projektunabhängige Notiz ist eine
+// Zeile mit project_uid = '' und gehört allein ihrem Verfasser (sonst sieht
+// und ändert sie niemand). „Meine Projekte“ = in der jüngsten echten Sitzung
+// zugeordnet (assign > 0) oder mit eigener Aufgabe — dieselbe Regel wie das
+// Dashboard (dashDaten()).
+function meineProjektUids(user){
+ const ich = user && user.personId;
+ const uids = new Set();
+ if(!ich) return uids;
+ const label = echteSitzungenSortiert().map(w => w.label).pop();
+ const w = label ? loadWeeks(label)[0] : null;
+ ((w && w.projects) || []).forEach(p => {
+ const zugeordnet = Object.keys(p.assign || {}).some(k => k.split('|')[0] === ich && Number(p.assign[k]) > 0);
+ const eigene = ((p.plan && p.plan.todos) || []).some(t => Array.isArray(t.assignees) && t.assignees.includes(ich));
+ if((zugeordnet || eigene) && p.projectUid) uids.add(String(p.projectUid));
+ });
+ return uids;
+}
+const NOTIZ_SELECT = `SELECT n.*, COALESCE(u1.display_name, 'Gelöschter Benutzer') AS erstellt_name,
+ COALESCE(u2.display_name, 'Gelöschter Benutzer') AS geaendert_name
+ FROM projekt_notizen n LEFT JOIN users u1 ON u1.id = n.erstellt_von LEFT JOIN users u2 ON u2.id = n.geaendert_von`;
+
+// GET /meine-notizen — {notizen, meineProjekte:[uid]}: die Notizen meiner
+// Projekte plus meine projektunabhängigen.
+app.get('/meine-notizen', requireAuth, (req, res) => {
+ try {
+ const uids = Array.from(meineProjektUids(req.user));
+ const rows = db.prepare(NOTIZ_SELECT + ` WHERE (n.project_uid = '' AND n.erstellt_von = ?)`
+ + (uids.length ? ' OR n.project_uid IN (' + uids.map(() => '?').join(',') + ')' : '')
+ + ' ORDER BY n.angeheftet DESC, n.geaendert_am DESC').all(req.user.id, ...uids);
+ res.json({ ok: true, notizen: rows.map(notizZeile), meineProjekte: uids });
+ } catch(err){
+ console.error('Meine Notizen laden fehlgeschlagen:', err);
+ res.status(500).json({ ok: false, error: String(err) });
+ }
+});
+
+// notizDarf: Schreibrecht auf eine Notiz bzw. ein Ziel. Projektunabhängig
+// (uid '') nur der Verfasser; an einem Projekt das Recht proj.plan.
+function notizDarf(user, uid, erstelltVonId){
+ if(!uid) return erstelltVonId === undefined || erstelltVonId === user.id;
+ return hatRecht(user, 'proj.plan');
+}
+
app.get('/projekt-notizen', requireAuth, (req, res) => {
try {
const uid = String(req.query.uid || '');
@@ -7377,11 +7488,11 @@ app.get('/projekt-notizen', requireAuth, (req, res) => {
}
});
-app.post('/projekt-notizen', requireAuth, requireRecht('proj.plan'), (req, res) => {
+app.post('/projekt-notizen', requireAuth, (req, res) => {
try {
const b = req.body || {};
const uid = String(b.uid || '');
- if(!uid) return res.status(400).json({ ok: false, error: 'uid fehlt.' });
+ if(!notizDarf(req.user, uid)) return res.status(403).json({ ok: false, recht: 'proj.plan', error: 'Keine Berechtigung, Notizen in Projekten anzulegen.' });
res.json({ ok: true, notiz: notizAnlegen(req, uid, b.titel, b.html, '') });
} catch(err){
console.error('Notiz anlegen fehlgeschlagen:', err);
@@ -7392,11 +7503,20 @@ app.post('/projekt-notizen', requireAuth, requireRecht('proj.plan'), (req, res)
// PUT {titel?, html?, angeheftet?, basis?} — basis = geaendertAm des Stands,
// auf dem die Änderung beruht; weicht der gespeicherte ab, 409 mit dem
// aktuellen Stand (jemand anderes hat inzwischen gespeichert).
-app.put('/projekt-notizen/:id', requireAuth, requireRecht('proj.plan'), (req, res) => {
+// uid (optional): einem Projekt zuordnen bzw. mit '' wieder projektunabhängig
+// machen (das nur der Verfasser) — aus der Seitenleiste „Notizen“.
+app.put('/projekt-notizen/:id', requireAuth, (req, res) => {
try {
const alt = notizLesen(req.params.id);
if(!alt) return res.status(404).json({ ok: false, error: 'Die Notiz gibt es nicht mehr.' });
+ if(!alt.uid && alt.erstelltVonId !== req.user.id) return res.status(404).json({ ok: false, error: 'Die Notiz gibt es nicht mehr.' });
+ if(!notizDarf(req.user, alt.uid, alt.erstelltVonId)) return res.status(403).json({ ok: false, recht: 'proj.plan', error: 'Keine Berechtigung, Notizen zu ändern.' });
const b = req.body || {};
+ const neueUid = typeof b.uid === 'string' ? b.uid : alt.uid;
+ if(neueUid !== alt.uid){
+ if(!neueUid && alt.erstelltVonId !== req.user.id) return res.status(403).json({ ok: false, error: 'Nur wer die Notiz angelegt hat, kann sie vom Projekt lösen.' });
+ if(!notizDarf(req.user, neueUid, alt.erstelltVonId)) return res.status(403).json({ ok: false, recht: 'proj.plan', error: 'Keine Berechtigung, Notizen in Projekten anzulegen.' });
+ }
if(typeof b.basis === 'string' && b.basis && b.basis !== alt.geaendertAm){
return res.status(409).json({ ok: false, konflikt: true, notiz: alt,
error: alt.geaendertVon + ' hat diese Notiz inzwischen geändert.' });
@@ -7408,10 +7528,11 @@ app.put('/projekt-notizen/:id', requireAuth, requireRecht('proj.plan'), (req, re
// Bearbeiter bleiben, damit die Sortierung „zuletzt geändert“ stimmt.
const nurPin = typeof b.titel !== 'string' && typeof b.html !== 'string';
const jetzt = nurPin ? alt.geaendertAm : new Date().toISOString();
- db.prepare(`UPDATE projekt_notizen SET titel = ?, html = ?, angeheftet = ?, geaendert_am = ?
+ db.prepare(`UPDATE projekt_notizen SET titel = ?, html = ?, angeheftet = ?, geaendert_am = ?, project_uid = ?
${nurPin ? '' : ', geaendert_von = ' + Number(req.user.id)} WHERE id = ?`)
- .run(titel, html, angeheftet, jetzt, alt.id);
+ .run(titel, html, angeheftet, jetzt, neueUid, alt.id);
ereignisSenden({ typ: 'notizen', uid: alt.uid }, req);
+ if(neueUid !== alt.uid) ereignisSenden({ typ: 'notizen', uid: neueUid }, req);
res.json({ ok: true, notiz: notizLesen(alt.id) });
} catch(err){
console.error('Notiz speichern fehlgeschlagen:', err);
@@ -7419,10 +7540,11 @@ app.put('/projekt-notizen/:id', requireAuth, requireRecht('proj.plan'), (req, re
}
});
-app.delete('/projekt-notizen/:id', requireAuth, requireRecht('proj.plan'), (req, res) => {
+app.delete('/projekt-notizen/:id', requireAuth, (req, res) => {
try {
const alt = notizLesen(req.params.id);
if(!alt) return res.json({ ok: true });
+ if(!notizDarf(req.user, alt.uid, alt.erstelltVonId)) return res.status(403).json({ ok: false, recht: 'proj.plan', error: 'Keine Berechtigung, Notizen zu löschen.' });
if(alt.erstelltVonId !== req.user.id && !istAdministrator(req.user)){
return res.status(403).json({ ok: false, error: 'Löschen darf nur, wer die Notiz angelegt hat, oder ein Administrator.' });
}
@@ -7438,11 +7560,11 @@ app.delete('/projekt-notizen/:id', requireAuth, requireRecht('proj.plan'), (req,
// POST /projekt-notizen/aus-mail {uid, text|eml} — Mail als neue Notiz, OHNE
// KI: Titel = Betreff (sonst erste Zeile), oben Absender und Datum, darunter
// der Text (zitierte Vorgänger-Mails abgeschnitten, wie bei „Termin aus Mail“).
-app.post('/projekt-notizen/aus-mail', requireAuth, requireRecht('proj.plan'), (req, res) => {
+app.post('/projekt-notizen/aus-mail', requireAuth, (req, res) => {
try {
const b = req.body || {};
const uid = String(b.uid || '');
- if(!uid) return res.status(400).json({ ok: false, error: 'uid fehlt.' });
+ if(!notizDarf(req.user, uid)) return res.status(403).json({ ok: false, recht: 'proj.plan', error: 'Keine Berechtigung, Notizen in Projekten anzulegen.' });
const mail = (typeof b.eml === 'string' && b.eml.trim()) ? leseEml(b.eml)
: { betreff: '', absender: '', datum: '', text: String(b.text || '') };
const text = mailZitateAbschneiden(mail.text).slice(0, 50000);
@@ -9262,6 +9384,7 @@ app.post('/import', requireRecht('a.import'), express.raw({ type: '*/*', limit:
// Ältere Backups tragen Kommentare noch gewerkübergreifend in projects.
migrateKommentareJeGewerk();
kommentareVorsatzUmstellen();
+ entitiesReparieren();
// Ältere Backups kennen das Feld leistungsphase noch nicht.
phasenbalkenAusTitel();
console.log('Datenbank aus Backup wiederhergestellt (' + buf.length + ' Bytes)');
@@ -9292,7 +9415,7 @@ app.get('/', (req,res)=>{
// Projektliste aufgegangen ist: Weitergegebene Links sollen nicht mit 404
// enden. Die Oberfläche leitet den Abschnitt auf die Projektliste um
// (TAB_BY_SLUG in public/js/globals.js) und erzeugt ihn selbst nicht mehr.
-const VALID_TAB_SLUGS = new Set(['Projektübersicht','Wochenbericht','Auslastung','Abwesenheiten','Projekte','Projektbeteiligte','Planung','PlanChecker','MeineAufgaben','Wandtafel','Einstellungen','Admin']);
+const VALID_TAB_SLUGS = new Set(['Projektübersicht','Wochenbericht','Auslastung','Abwesenheiten','Notizen','Projekte','Projektbeteiligte','Planung','PlanChecker','MeineAufgaben','Wandtafel','Einstellungen','Admin']);
// Slug der Projektplan-Seite (muss zu PLAN_SLUG in js/globals.js passen)
const PLAN_SLUG = 'Projektplan';