<div class="table-responsive">
  <table class="table table-bordered" style="width: 100%">
    <thead>
      <tr>
        <th class="text-center" style="width: 3%">N°</th>
        <th class="text-center" style="width: 17%">Activités</th>
        <th class="text-center" style="width: 15%">Thèmes</th>
        <th class="text-center" style="width: 15%">Disciplines</th>
        <th class="text-center" style="width: 15%">{{ $type == 'time' ? 'Heures':'Lieux' }}</th>
        <th class="text-center" style="width: 10%">Dates</th>
        <th class="text-center" style="width: 25%">Observations</th>
      </tr>
    </thead>
    <tbody>
      @php $i = 1; @endphp
      @forelse ($data as $item)
        <tr>
          <th class="text-center">{{ $i < 10 ? '0'.$i++:$i++ }}</th>
          <td>{{ ucfirst($item->activite) }}</td>
          <td>{{ ucfirst($item->theme) }}</td>
          <td>{{ ucfirst($item->school_matter->matter->libelle) }}</td>
          <td class="text-center">{{ $item->$type }}</td>
          <td class="text-center">{{ date('d/m/Y', strtotime($item->date)) }}</td>
          <td>{{ ucfirst($item->texte) }}</td>
        </tr>
      @empty
        <tr>
          <td colspan="8" class="text-center">Underdefined data</td>
        </tr>
      @endforelse
    </tbody>
  </table>
</div>