ferdi2go/Pigmento
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Tab-Navigation als Hamburger-Menü

Browse Source 
3-Striche-Button öffnet Dropdown mit allen Kategorien.
Aktive Kategorie wird neben dem Button angezeigt.
Klick außerhalb schließt das Menü.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Ferdinand
2026-04-03 17:04:02 +02:00
parent 6da431bf7e
commit f70d02d11d
3 changed files with 82 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
index.html
View File

@@ -13,11 +13,17 @@
<div id="lottie-logo" style="width:80px;height:80px;flex-shrink:0"></div>
<h1 style="margin-bottom:0">Pigmento</h1>
</div>
<nav>
<button class="tab-btn active" data-tab="picker">Picker</button>
<button class="tab-btn" data-tab="eingabe">Eingabe</button>
<button class="tab-btn" data-tab="harmonien">Harmonien</button>
<button class="tab-btn" data-tab="sammlung">Sammlung</button>
<nav id="main-nav">
<button id="menu-toggle" aria-label="Navigation öffnen">
<span></span><span></span><span></span>
</button>
<span id="menu-active-label">Picker</span>
<div id="menu-dropdown">
<button class="tab-btn active" data-tab="picker">Picker</button>
<button class="tab-btn" data-tab="eingabe">Eingabe</button>
<button class="tab-btn" data-tab="harmonien">Harmonien</button>
<button class="tab-btn" data-tab="sammlung">Sammlung</button>
</div>
</nav>
</header>