JSFiddle - React, Tailwind, and code Playground

by Reigel Gallarde

HTML

<div>
    <p class="boy">Boy: Musta mo sa imong uyab? (pasimple tahay)</p>
    <p class="girl">Girl: Wala man koy uyab oi...</p>
    <p class="boy">Boy: ( wow! nice ) Ngano man pud tahay wala? nga kagwapa nimo...</p>
    <p class="girl">Girl: Gwapa ba uroy!. Wala man gani nagka-interest....</p>
    <p class="boy">Boy: ahhh di ko motoo... taas lang siguro ka og standards...</p>
    <p class="girl">Girl: di man oi... wala lang jud...</p>
    
    <p>(Og sa dihang nanguyab si Boy, gibasted!)
        <br /><br />
        hahaha... ngano ingon ana man ang uban babae??</p>
</div>

CSS

div {
    border: 1px solid grey;
    width: 430px;
    margin: 0 auto;
    padding: 30px;
    border-radius: 40px;
}
div p {
    margin-bottom: 10px;
}
div p.girl {
    margin-left: 40px;
    color: magenta;
} 
div p.boy {
    color: blue;
}