{% extends 'main.html' %}
{% load static %}




{% block body %}
  

      <!--end::Sidebar-->
      <!--begin::App Main-->
      <main class="app-main">
        <!--begin::App Content Header-->
        <div class="app-content-header">
          <!--begin::Container-->
          <div class="container-fluid">
            <!--begin::Row-->
            <div class="row">
              <div class="col-sm-6"><h3 class="mb-0">All Official</h3></div>
              <div class="col-sm-6">
                <ol class="breadcrumb float-sm-end">
                  <li class="breadcrumb-item"><a href="#">Home</a></li>
                  <li class="breadcrumb-item active" aria-current="page">Official</li>
                </ol>
              </div>
            </div>
            <!--end::Row-->
          </div>
          <!--end::Container-->
        </div>
        <!--end::App Content Header-->
        <!--begin::App Content-->
        <div class="app-content">
          <!--begin::Container-->
          <div class="container-fluid">
            
           
            







              <div class="row">
                  <div class="col-md-4">
                      <div class="card">
                          <img class="card-img-top" src="{% static 'assets/img/user8-128x128.jpg' %}" alt="Card image cap">
                          <div class="card-body">
                            <h5 class="card-title">Position: Coach</h5>
                          </div>
                    
                          <div class="card-footer">
                           
                              <div class="row">
                                <div class="col-md-6 d-grid gap-2">   <a href="#" class="btn btn-success btn-lg">Approv</a></div>
                                <div class="col-md-6 d-grid gap-2">   <a href="#" class="btn btn-danger btn-lg">Reject</a></div>
                              </div>
                             
                          
                            
                          </div>
                        </div>
                  </div>
                  <div class="col-md-6 offset-1">
                      <div class="card">
                          <!-- <img class="card-img-top" src="assets/img/user8-128x128.jpg" alt="Card image cap"> -->
                          <div class="card-body">
                            <h5 class="card-title">Position: Coach</h5>
                          </div>
              
                          <table class="table table-bordered mb-4">
                              <tr>
                                <th>S/N</th>
                                <th>Names</th>
                                <th>Position</th>
                                <th colspan="2">Action</th>
                              </tr>
                              <tr>
                                <td> 1 </td>
                                <td> Chukwuma Ali </td>
                                <td> Coach </td>
                                <td > <a href="" class="btn btn-primary btn-lg">Edit</a></td>
                                <td > <a href="" class="btn btn-danger btn-lg ">Delete</a> </td>
                              </tr>
                          </table>

                          <table class='table table-bordered mb-4'>
                              <tr>
                                <th>S/N</th>
                                <th>Cartificate</th>
                                <th>Year</th>
                                <th colspan="2">Action</th>
                              </tr>
                              <tr>
                                <td> 1 </td>
                                <td> file</td>
                                <td> 20000 </td>
                                <td> <a href="" class="btn btn-primary btn-lg">Download</a> </td>
                                <td> <a href="" class="btn btn-danger btn-lg "> Delete</a></td>
                              </tr>
                          </table>
                          
                          </div>
                        </div>
                  </div>
                 
              </div>










         
         
            <!--end::Row-->
          </div>
          <!--end::Container-->
        </div>
        <!--end::App Content-->
      </main>
      

{% endblock body %}