{% extends 'base.html' %}                                                          
{% load static %}
{% block content %}

<div class="text-xl font-semibold inline-block">title
  <div class="inline-block float-right">
    <div class="inline-block float-right">
    <button class="btn px-6 btn-sm normal-case btn-primary">Add New</button>
    </div>
  </div>
</div>
<div class="divider mt-2"></div>
<div class="h-full w-full pb-6 bg-base-100">
  <div class="overflow-x-auto">
    <table class="table w-full">
      <!-- head -->
      <thead>
        <tr>
          <th></th>
          <th>Name</th>
          <th>Job</th>
          <th>Favorite Color</th>
        </tr>
      </thead>
      <tbody>
        <!-- row 1 -->
        <tr>
          <th>1</th>
          <td>Cy Ganderton</td>
          <td>Quality Control Specialist</td>
          <td>Blue</td>
        </tr>
        <!-- row 2 -->
        <tr>
          <th>2</th>
          <td>Hart Hagerty</td>
          <td>Desktop Support Technician</td>
          <td>Purple</td>
        </tr>
        <!-- row 3 -->
        <tr>
          <th>3</th>
          <td>Brice Swyre</td>
          <td>Tax Accountant</td>
          <td>Red</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

{% endblock %}
