Wochen-Blister als Checkboxen
Ein Blister für sieben Tage: Beim Abhaken wird die Blase eingedrückt, die Tablette rutscht heraus und die Folie reißt.
Einstellungen
Code
<fieldset class="uvq02-bls"><legend>Tabletten der Woche</legend><div class="cd"><label><input type="checkbox" aria-label="Montag"><span class="cv" aria-hidden="true"><i></i></span><span class="dy" aria-hidden="true">MO</span></label><label><input type="checkbox" aria-label="Dienstag"><span class="cv" aria-hidden="true"><i></i></span><span class="dy" aria-hidden="true">DI</span></label><label><input type="checkbox" aria-label="Mittwoch"><span class="cv" aria-hidden="true"><i></i></span><span class="dy" aria-hidden="true">MI</span></label><label><input type="checkbox" aria-label="Donnerstag"><span class="cv" aria-hidden="true"><i></i></span><span class="dy" aria-hidden="true">DO</span></label><label><input type="checkbox" aria-label="Freitag"><span class="cv" aria-hidden="true"><i></i></span><span class="dy" aria-hidden="true">FR</span></label><label><input type="checkbox" aria-label="Samstag"><span class="cv" aria-hidden="true"><i></i></span><span class="dy" aria-hidden="true">SA</span></label><label><input type="checkbox" aria-label="Sonntag"><span class="cv" aria-hidden="true"><i></i></span><span class="dy" aria-hidden="true">SO</span></label></div></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 Checkboxen
Alle ansehen: CheckboxenWofür du ihn nutzen kannst
Diese Gruppe aus sieben Checkboxen ist als Tablettenblister gezeichnet, mit silberner Folienkarte und klaren Kuppeln, eine pro Wochentag. Beim Abhaken eines Tages wird seine Kuppel eingedrückt, die zweifarbige Kapsel rutscht heraus, in der Folie bleibt ein gerissenes Loch, und das Tageskürzel wechselt die Farbe. Jede Kuppel ist eine echte Checkbox mit vollem Tagesnamen für Screenreader. Passt zu Medikamentenerinnerungen, Gesundheits-Apps und Routine-Trackern.
Die Hauptfarbe ist eine Kapselhälfte und die Tagesmarkierung, die Zweitfarbe die andere Hälfte. Ändere die Legende für Vitamine oder Nahrungsergänzung und nutze sie in einer Wochenansicht, in der man auf einen Blick sieht, was noch übrig ist.