JSFiddle - React, Tailwind, and code Playground

by sperske

HTML

<div id="stats">
  <div class="stat">
    <h1>Typed by a human</h1>
    <ul>
      <li>
        <span>3%</span>
        Typed by a human
      </li>
      <li>
        <span>0%</span>
        Rephrased with Grammarly's AI
      </li>
      <li><span>0%</span> With spelling and grammar correction</li>
    </ul>
  </div>
  <div class="stat">
    <h1>Copied from a source</h1>
  </div>
  <div class="stat">
    <h1>Origin unknown</h1>
  </div>
</div>

CSS

#stats {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}
.stat {
  border: 1px solid #aaa;
  border-radius: 0.4em;
  padding: 1em;
}