JSFiddle - React, Tailwind, and code Playground

by Evgenii Malikov

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/flatly/bootstrap.min.css">
<table class="table table-striped">
<thead>
  <tr>
    <th>Time</th>
    <th>ID</th>
    <th>Client</th>
    <th>Bill</th>
    <th>Tips</th>
    <th>Total</th>
  </tr>
  </thead>
  <tbody>
    <tr>
      <td>12:32:56</td>
      <td class="text-uppercase">9bf2d02a</td>
      <td>Houdini</td>
      <td>14.3</td>
      <td>1.43</td>
      <td>15.73</td>
    </tr>
    <tr>
      <td>18:21:02</td>
      <td class="text-uppercase">a3d6e854</td>
      <td>Speedster</td>
      <td>12</td>
      <td>-</td>
      <td>12</td>
    </tr>
    <tr>
      <td>20:05:33</td>
      <td class="text-uppercase">26cbb7dc</td>
      <td>John Doe</td>
      <td>-</td>
      <td>5</td>
      <td>5</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <th colspan="3">Total</th>
      <th>26.3</th>
      <th>6.43</th>
      <th>32.73</th>
    </tr>
  </tfoot>
</table>