JSFiddle - React, Tailwind, and code Playground

by BoxMan0617

HTML

<div class="card">
    <div class="header">
        <span class="alert">Alert</span>
        <span class="quiet">some alert text</span>
    </div>
    <div class="info">
        Info
    </div>
    <div class="footer">
        Footer
    </div>
</div>

CSS

h1,h2,h3,h4,h5 {
    margin: 0;
    padding: 0;
}

.card {
    position: relative;
    top: 10px;
    left: 10px;
    width: 300px;
    box-shadow: 0 0 10px -2px #000;
}

.card .header {
    padding: 10px;
}

.card .header .alert {
    font-weight: bold;
    font-size: 18px;
}

.alert {
    color: #d81c1c;
}

.quiet {
    color:
}