JSFiddle - React, Tailwind, and code Playground

by Rapha Souza

HTML

<table class="table table-hover table_TabelaColetas">
  <thead>
    <tr>
      <th>Status</th>
      <th class="hide">ID</th>
      <th>Nome Fornecedor</th>
      <th>Produto</th>
      <th>QTD Col.</th>
      <th>Ações</th>
    </tr>
  </thead>
  <tbody>
    <tr class="clinha_numProcesso__54" style="">
      <td class="clinha_status__54">
        <button type="button" class="btn btn-default">
          <i class="flaticon flaticon-edit" aria-hidden="true"></i>
        </button>
      </td>
      <td class="hide">54</td>
      <td>BRF S.A</td>
      <td class="clinha_descricaoProduto__54">OSSO</td>
      <td class="hide clinha_DATACOLETA">17/12/2025</td>
      <td class="hide clinha_CODIGOFORNECEDOR">01838723</td>
      <td class="clinha_pesoPrevisto__54">15000</td>
      <td>
        <button
          type="button"
          class="btn btn-primary btn-xs"
          onclick="abrirModal('54','BRF S.A','OSSO','francisco.ajunior','17/12/2025')"
        >
          Abrir
        </button>
      </td>
    </tr>
  </tbody>
</table>

CSS

table, thead {
      
      border: 1px solid #E6E6E6; /* Adiciona borda ao redor e entre linhas/colunas */
    }