JSFiddle - React, Tailwind, and code Playground

HTML

<section>
    <article>
        <h1>Test Details</h1>
        <ul>
            <li>Layer This</li>
            <li>Layer That</li>
            <li>Layers</li>
        </ul>
    </article>
</section>
<section>
    <article>
        <h1>Campaign details</h1>
        <p>Text</p>
    </article>
</section>

CSS

section {
    padding:30px;
}
section article {
    background:#EBEBEB;
}
section article h1 {
    background:#0C79CB;
    padding:10px;
}
/* This is where I am struggling */
 section article ul::before {
    background-color: white;
    content:'';
    height:10px;
    display:block;
}