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

index.html
+108 -1
View File
@@ -4,12 +4,119 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Morning Meeting Planner</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<script src="https://cdn.sheetjs.com/xlsx-0.20.3/package/dist/xlsx.full.min.js"></script>
</head>
<body>
<header>
<h1>Morning Meeting Planner</h1>
<h1>Meeting Mixer</h1>
<div class="header-graphic" aria-hidden="true">
<svg viewBox="0 0 200 160" xmlns="http://www.w3.org/2000/svg">
<!-- ── Platter shadow glow ── -->
<circle cx="80" cy="84" r="68" fill="rgba(200,169,81,0.04)"/>
<!-- ── Turntable platter body ── -->
<circle cx="80" cy="84" r="62" fill="#111111" stroke="#1e1e1e" stroke-width="1"/>
<!-- ── Vinyl grooves (concentric rings) ── -->
<circle cx="80" cy="84" r="56" fill="none" stroke="#1c1c1c" stroke-width="0.8"/>
<circle cx="80" cy="84" r="50" fill="none" stroke="#1c1c1c" stroke-width="0.8"/>
<circle cx="80" cy="84" r="44" fill="none" stroke="#1d1d1d" stroke-width="0.7"/>
<circle cx="80" cy="84" r="38" fill="none" stroke="#1d1d1d" stroke-width="0.7"/>
<circle cx="80" cy="84" r="32" fill="none" stroke="#1e1e1e" stroke-width="0.7"/>
<circle cx="80" cy="84" r="26" fill="none" stroke="#1e1e1e" stroke-width="0.7"/>
<!-- ── Label area border (gold ring) ── -->
<circle cx="80" cy="84" r="21" fill="#161616" stroke="rgba(200,169,81,0.45)" stroke-width="1.2"/>
<!-- ── Label inner ── -->
<circle cx="80" cy="84" r="19" fill="#1a1a1a"/>
<!-- ── Label text ── -->
<text x="80" y="88" text-anchor="middle"
font-family="'Bebas Neue', sans-serif"
font-size="13" fill="rgba(200,169,81,0.65)"
letter-spacing="3">MM</text>
<!-- ── Spindle ── -->
<circle cx="80" cy="84" r="3.5" fill="none" stroke="#c8a951" stroke-width="1.5"/>
<circle cx="80" cy="84" r="1.5" fill="#c8a951" opacity="0.9"/>
<!-- ── Outer platter rim ── -->
<circle cx="80" cy="84" r="62" fill="none" stroke="rgba(200,169,81,0.18)" stroke-width="1.5"/>
<!-- ── Tonearm pivot base ── -->
<circle cx="158" cy="24" r="7" fill="#161616" stroke="#c8a951" stroke-width="1.5"/>
<circle cx="158" cy="24" r="2.5" fill="#c8a951" opacity="0.8"/>
<!-- ── Tonearm tube (two lines = tube shape) ── -->
<line x1="158" y1="24" x2="115" y2="70"
stroke="#c8a951" stroke-width="2.5"
stroke-linecap="round" opacity="0.9"/>
<line x1="157" y1="27" x2="114" y2="73"
stroke="#8c7435" stroke-width="1"
stroke-linecap="round" opacity="0.5"/>
<!-- ── Headshell (cartridge) ── -->
<polygon points="111,66 118,73 113,78 106,71"
fill="#c8a951" opacity="0.85"/>
<!-- ── Needle contact indicator ── -->
<line x1="108" y1="74" x2="100" y2="79"
stroke="rgba(200,169,81,0.5)" stroke-width="1"
stroke-dasharray="2,2"/>
<circle cx="99" cy="80" r="2" fill="#c8a951" opacity="0.6"/>
<!-- ── Mixer panel (right side, abstract) ── -->
<!-- Panel background -->
<rect x="148" y="58" width="44" height="90" rx="2"
fill="#161616" stroke="#2a2a2a" stroke-width="1"/>
<!-- Fader track 1 -->
<rect x="157" y="66" width="3" height="48" rx="1.5"
fill="#0d0d0d" stroke="#2a2a2a" stroke-width="0.5"/>
<rect x="154" y="88" width="9" height="8" rx="1"
fill="#c8a951" opacity="0.85"/>
<!-- Fader track 2 -->
<rect x="170" y="66" width="3" height="48" rx="1.5"
fill="#0d0d0d" stroke="#2a2a2a" stroke-width="0.5"/>
<rect x="167" y="80" width="9" height="8" rx="1"
fill="#c8a951" opacity="0.6"/>
<!-- Fader track 3 -->
<rect x="183" y="66" width="3" height="48" rx="1.5"
fill="#0d0d0d" stroke="#2a2a2a" stroke-width="0.5"/>
<rect x="180" y="100" width="9" height="8" rx="1"
fill="#c8a951" opacity="0.45"/>
<!-- Knob row (top of mixer panel) -->
<circle cx="158" cy="62" r="3.5" fill="#1e1e1e" stroke="rgba(200,169,81,0.4)" stroke-width="1"/>
<line x1="158" y1="59.5" x2="158" y2="62" stroke="#c8a951" stroke-width="1" opacity="0.7"/>
<circle cx="171" cy="62" r="3.5" fill="#1e1e1e" stroke="rgba(200,169,81,0.4)" stroke-width="1"/>
<line x1="170" y1="59.8" x2="171" y2="62" stroke="#c8a951" stroke-width="1" opacity="0.7"/>
<circle cx="184" cy="62" r="3.5" fill="#1e1e1e" stroke="rgba(200,169,81,0.4)" stroke-width="1"/>
<line x1="183" y1="59.7" x2="184" y2="62" stroke="#c8a951" stroke-width="1" opacity="0.7"/>
<!-- Panel label bar -->
<rect x="148" y="120" width="44" height="14" rx="0"
fill="#111" stroke="#2a2a2a" stroke-width="0.5"/>
<rect x="152" y="123" width="4" height="2" rx="0.5" fill="rgba(200,169,81,0.3)"/>
<rect x="158" y="123" width="4" height="2" rx="0.5" fill="rgba(200,169,81,0.3)"/>
<rect x="164" y="123" width="12" height="2" rx="0.5" fill="rgba(200,169,81,0.15)"/>
<!-- EQ line (abstract waveform under mixer) -->
<polyline
points="148,140 152,136 156,142 160,133 164,138 168,130 172,137 176,134 180,139 184,132 188,137 192,135"
fill="none" stroke="rgba(200,169,81,0.3)" stroke-width="1.2"
stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
</header>
<nav class="tabs">