Komponenten Warnmeldungen Komponente "Warnmeldungen"

Komponente "Warnmeldungen"

Eine einfache, reaktionsschnelle Komponente für Graustufen-Warnmeldungen für E-Commerce-Websites mit Unterstützung für den Dunkelmodus.

Vorschau

HTML-Code

<div class="flex items-center p-4 text-sm text-gray-800 border border-gray-300 rounded-lg bg-gray-50 dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600" role="alert">
  <svg class="flex-shrink-0 inline w-4 h-4 me-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
    <path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM10 15.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"/>
  </svg>
  <span class="sr-only">Info</span>
  <div>
    <span class="font-medium">New message:</span> Your order has been placed successfully.
  </div>
</div>

Verwandte Komponenten

Komponente "Warnmeldungen"

Komponente "Warnmeldungen" mit dem Materialdesign-Stil, dem Pastellfarbschema und dem komplexen Komplexitätsgrad für Portfoliozwecke. Responsives Design mit Unterstützung für dunkle Themen. Kein JavaScript-Code erforderlich, nur HTML mit Tailwind-Klassen. Im Dunkelmodus wird das Präfix dark: von Tailwind für das Styling verwendet. Bilder verwenden picsum.photos für Bilder und randomuser.me für Avatare.

Offen

Monospace_Developer_Alert_Messages_Component

Eine komplexe, von Monospace inspirierte Komponente für Warnmeldungen mit einem Farbschema in Schwarz, Weiß und Akzenten, die für die Nutzung von Blogs und Inhalten entwickelt wurde. Beinhaltet Unterstützung für responsives Design und Dunkelmodus.

Offen

Komponente "Warnmeldungen"

Eine Komponente für Warnmeldungen im Retro-/Vintage-Design, einschließlich Unterstützung für den Dunkelmodus und die Reaktionsfähigkeit.

Offen