INU Login Sign up
Login Or Sign up

Answers for "alert component in tailwind css"

Html
1

alert tailwind css

<div class="relative py-3 pl-4 pr-10 leading-normal text-red-700 bg-red-100 rounded-lg" role="alert">
  <p>A simple alert with text and a right icon</p>
  <span class="absolute inset-y-0 right-0 flex items-center mr-4">
    <svg class="w-4 h-4 fill-current" role="button" viewBox="0 0 20 20"><path d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" fill-rule="evenodd"></path></svg>
  </span>
</div>
Posted by: Guest on September-23-2021
-1

tailwind alert box

<!-- Only Works on 2.0+ Version -->
<section class="py-20 mt-10 flex justify-center ...">
        <div
            class="bg-gray-900 py-1 w-11/12 text-center flex-wrap md:flex-nowrap rounded-md border-t-4 border-green-400 flex justify-center ...">
            <div class="bg- py-8 w-1/12 ml-1 text-center rounded-full flex justify-center ...">
                <svg class="w-10 text-green-300 h-12 text-gray-500" fill="none" viewBox="0 0 24 24"
                    stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                        d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
            </div>
            <div class="bg- py-2 md:py-6 w-10/12 ml-1 text-center rounded-full flex justify-center ...">
                <p class="text-green-300"> Lorem ipsum, dolor sit amet consectetur adipisicing elit. Quod, architecto
                    optio modi quos
                    omnis
                    itaque ad aspernatur doloremque illo ullam atque praesentium alias laudantium ab, illum non odit
                    suscipit debitis.</p>
            </div>
        </div>
    </section>
Posted by: Guest on May-05-2021

Code answers related to "alert component in tailwind css"

Code answers related to "Html"

Browse Popular Code Answers by Language

Python
Javascript
Whatever
Shell/Bash
CSS
Html
PHP
SQL
Java
C#

Popular Programming Languages

Abap ActionScript Assembly BASIC C C# C++ Clojure Cobol CSS Dart Delphi Elixir Erlang F# Fortran Go Groovy Haskell Html Java Javascript Julia Kotlin Lisp Lua Matlab Objective-C Pascal Perl PHP Prolog Python R Ruby Rust Scala Scheme Shell/Bash SQL Swift TypeScript VBA Whatever

Advertisements

290x500

Company

Compilers

Help

Connect with us

footer logo

Copyright © 2021 Codeinu