Componenti Capitale SocialMediaPostModal

SocialMediaPostModal

Un componente modale semplice, reattivo, ispirato al Material Design con combinazione di colori analoga, adatto per applicazioni di social media. Supporta il tema scuro.

Anteprima

Codice HTML


<div class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full flex justify-center items-center">
  <div class="relative p-5 border w-96 shadow-lg rounded-md bg-white dark:bg-gray-800">
    <div class="mt-3 text-center">
      <h3 class="text-lg leading-6 font-medium text-gray-900 dark:text-gray-100">Post Created!</h3>
      <div class="mt-2 px-7 py-3">
        <p class="text-sm text-gray-500 dark:text-gray-400">Your post has been successfully shared with your followers.</p>
        <img class="mt-4 rounded-md" src="https://picsum.photos/400/200" alt="Placeholder image for social media post">
      </div>
      <div class="items-center px-4 py-3">
        <button id="ok-btn" class="px-4 py-2 bg-blue-500 text-white text-base font-medium rounded-md w-full shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-blue-700 dark:hover:bg-blue-900">Awesome!</button>
      </div>
    </div>
  </div>
</div>

Componenti correlati

Componente modale

Un componente modale reattivo con microinterazioni e combinazione di colori triadica, progettato per le interfacce dei social media. Presenta animazioni che coinvolgono gli utenti durante l'interazione e fornisce supporto per il tema scuro utilizzando Tailwind CSS.

Aperto

Componente modale vintage retrò

Un componente modale reattivo retrò/vintage progettato con Tailwind CSS che include il supporto della modalità oscura e un'estetica nostalgica degli anni '80/'90.

Aperto

Modale Cruscotto Neon

Una dashboard modale complessa e reattiva con effetti neon/bagliore, utilizzando colori autunnali, supporto per la modalità scura ed elementi interattivi. Progettato per la visualizzazione dei dati e i pannelli di controllo.

Aperto