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

feat: Picker-Tab mit Upload, Paste und Eyedropper

Browse Source
This commit is contained in:
Ferdinand
2026-04-01 16:24:30 +02:00
parent 36d0253668
commit 9cf34b03f0
4 changed files with 130 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
index.html
View File

@@ -19,8 +19,35 @@
<main>
<section id="tab-picker" class="tab-content active">
<p>Picker kommt hier</p>
</section>
<h2>Farbe aus Bild</h2>
<div id="picker-dropzone">
<p>Bild hierher ziehen, einfügen (Strg+V) oder</p>
<button class="action-btn" id="picker-file-trigger">Datei wählen</button>
<input type="file" id="picker-file-input" accept="image/*" style="display:none">
</div>
<canvas id="picker-canvas" style="display:none;max-width:100%;cursor:crosshair;border-radius:8px;border:1px solid #ddd"></canvas>
<div id="picker-result" style="display:none;margin-top:1rem">
<div id="picker-preview" class="color-preview"></div>
<div class="color-codes">
<div class="color-code-group">
<label for="picker-hex">Hex</label>
<input id="picker-hex" type="text" readonly>
</div>
<div class="color-code-group">
<label for="picker-rgb">RGB</label>
<input id="picker-rgb" type="text" readonly>
</div>
<div class="color-code-group">
<label for="picker-hsl">HSL</label>
<input id="picker-hsl" type="text" readonly>
</div>
</div>
<div style="display:flex;gap:0.5rem">
<button class="action-btn" id="picker-fav-btn">Zu Favoriten</button>
<button class="action-btn" id="picker-schema-btn">Zu Schema hinzufügen</button>
</div>
</div>
</section>
<section id="tab-eingabe" class="tab-content">
<h2>Farbe eingeben</h2>
<div id="eingabe-preview" class="color-preview" style="background:#3a8fc1"></div>