{% extends "base.html" %}

{% block content %}

  <h1 class="mt-4">Search</h1>
  <div class='container'>

    <!-- container row -->
    <div class='row'>

      <!-- col-10 to give a padding on the side -->
      <div class='col-10'>

        <br>

        <!-- -->
        <div class='row'>

          <div class='col-2'>Search Cards</div>
          <div class='col-8'>
            <input type='text' class='form-control form-control-sm' placeholder=''>
          </div>
          <div class='col-2'>
            <button type='button' class='btn btn-secondary btn-sm'>Find</button>
          </div>

        </div>

        <br>

        <!-- -->
        <div class='row'>

          <div class='col-2'>Search Users</div>
          <div class='col-8'>
            <input type='text' class='form-control form-control-sm' placeholder=''>
          </div>
          <div class='col-2'>
            <button type='button' class='btn btn-secondary btn-sm'>Find</button>
          </div>

        </div>

        <br>

        <!-- -->
        <div class='row'>

          <div class='col-2'>Search Admins</div>
          <div class='col-8'>
            <input type='text' class='form-control form-control-sm' placeholder=''>
          </div>
          <div class='col-2'>
            <button type='button' class='btn btn-secondary btn-sm'>Find</button>
          </div>

        </div>

      </div>
    </div>
  </div>


{% endblock %}