ferdi2go/Meeting-Mixer
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: ui polish — extract inline styles to CSS classes, add header art

Browse Source 
- Move inline style.cssText to semantic classes (cal-legend, cal-header-cell,
  cal-day-tag-label, cal-btn-row) in calendar.js
- Buttons "FT"/"BU" → "Feiertag"/"Betriebsurl." for clarity
- Decorative turntable/mixer SVG header art in index.html
- style.css build-out for the new classes
- Initial README content
- Dev port 3000 → 3001

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
ferdi2goandClaude Opus 4.7 committed 2026-04-28 09:43:53 +00:00
1 parent 6fd2cfcf04
commit e4ae866375
5 files changed
+554 -49
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

js/calendar.js
+9 -12
View File
@@ -62,9 +62,10 @@ export function renderCalendar() {
// Legend
const legend = document.createElement('div');
legend.className = 'row';
legend.style.cssText = 'font-size:12px;color:#6b7280';
legend.textContent = 'FT = Feiertag markieren | BU = Betriebsurlaub markieren';
legend.className = 'cal-legend';
legend.innerHTML =
'<span><span class="cal-legend-dot" style="background:#fde68a"></span>Feiertag</span>' +
'<span><span class="cal-legend-dot" style="background:#fecaca"></span>Betriebsurlaub</span>';
container.appendChild(legend);
// Calendar grid wrapper
@@ -128,7 +129,7 @@ function renderGrid(wrapper, exportBtn) {
headerGrid.className = 'calendar-header-grid';
WD_LABELS.forEach(lbl => {
const cell = document.createElement('div');
cell.style.cssText = 'text-align:center;font-weight:600;font-size:12px;color:#6b7280;padding:4px';
cell.className = 'cal-header-cell';
cell.textContent = lbl;
headerGrid.appendChild(cell);
});
@@ -176,12 +177,11 @@ function renderGrid(wrapper, exportBtn) {
if (isHoliday || isClosure) {
// Show label + remove button
const tag = document.createElement('div');
tag.style.cssText = 'font-size:11px;margin-top:4px';
tag.className = 'cal-day-tag-label';
tag.textContent = isHoliday ? 'Feiertag' : 'Betriebsurlaub';
const removeBtn = document.createElement('button');
removeBtn.type = 'button';
removeBtn.textContent = '✕';
removeBtn.style.cssText = 'font-size:9px;padding:1px 4px;margin-left:4px';
removeBtn.addEventListener('click', () => {
if (isHoliday) toggleHoliday(state, iso);
else toggleClosure(state, iso);
@@ -193,7 +193,6 @@ function renderGrid(wrapper, exportBtn) {
} else {
// Assignee dropdown
const sel = document.createElement('select');
sel.style.cssText = 'width:100%;margin-top:4px;font-size:11px';
const emptyOpt = document.createElement('option');
emptyOpt.value = '';
@@ -227,18 +226,16 @@ function renderGrid(wrapper, exportBtn) {
// FT / BU mark buttons
const btnRow = document.createElement('div');
btnRow.style.cssText = 'margin-top:4px;display:flex;gap:2px';
btnRow.className = 'cal-btn-row';
const ftBtn = document.createElement('button');
ftBtn.type = 'button';
ftBtn.textContent = 'FT';
ftBtn.style.cssText = 'font-size:9px;padding:1px 4px';
ftBtn.textContent = 'Feiertag';
ftBtn.addEventListener('click', () => { toggleHoliday(state, iso); saveState(); renderGrid(wrapper, exportBtn); });
const buBtn = document.createElement('button');
buBtn.type = 'button';
buBtn.textContent = 'BU';
buBtn.style.cssText = 'font-size:9px;padding:1px 4px';
buBtn.textContent = 'Betriebsurl.';
buBtn.addEventListener('click', () => { toggleClosure(state, iso); saveState(); renderGrid(wrapper, exportBtn); });
btnRow.append(ftBtn, buBtn);