Duftpyramide als Filter
Die Noten eines Parfums in Kopf, Herz und Basis: Jede gläserne Stufe leuchtet auf und verdunstet, wenn du Noten wählst.
Einstellungen
Code
<fieldset class="uvq05-sp"><legend>Duftnoten</legend><div class="rw r1"><span class="sl" aria-hidden="true"></span><div class="nb"><p class="tr"><b>Kopfnoten</b> <span>15 min</span></p><div class="cs"><label><input type="checkbox" checked><span>Bergamotte</span></label><label><input type="checkbox"><span>Zitrone</span></label><label><input type="checkbox"><span>Rosa Pfeffer</span></label></div></div></div><div class="rw r2"><span class="sl" aria-hidden="true"></span><div class="nb"><p class="tr"><b>Herznoten</b> <span>4 h</span></p><div class="cs"><label><input type="checkbox" checked><span>Rose</span></label><label><input type="checkbox"><span>Iris</span></label><label><input type="checkbox"><span>Lavendel</span></label></div></div></div><div class="rw r3"><span class="sl" aria-hidden="true"></span><div class="nb"><p class="tr"><b>Basisnoten</b> <span>8 h</span></p><div class="cs"><label><input type="checkbox"><span>Vanille</span></label><label><input type="checkbox"><span>Bernstein</span></label><label><input type="checkbox" checked><span>Sandelholz</span></label></div></div></div><p class="ct"><span>Gewählte Noten:</span> <span class="n"></span></p></fieldset>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Filter
Alle ansehen: FilterWofür du ihn nutzen kannst
Parfümeure beschreiben einen Duft als Pyramide aus Kopf-, Herz- und Basisnoten, die unterschiedlich schnell verfliegen, und dieser Filter nutzt genau diese Struktur. Jede Stufe ist ein zugeschnittenes Glasstück neben ihren Chips; eine angehakte Note lässt ihre Stufe leuchten und Partikel aufsteigen, oben schnell, an der Basis langsam. Checkboxen und CSS erledigen alles.
Die erste Farbe tönt Kopf und Herz, die zweite die Basis, von Bernstein bis Pflaume. Ersetze Noten und Zeiten durch dein eigenes Sortiment und setz den Filter in Parfümerien, bei Kerzenmarken oder Teemischungen ein.