Overview Cards

Wet and dry training overview cards


Dashboard Overview Card

Dashboard overview card with a single call to action.

    
      <div class="atp-card-overview">
    <div class="card-title">
      <h3 class="h4">Wet Flight Training
      <span>120-day look ahead</span>
      </h3>
    </div>
    <div class="row px-3">
      <div class="col-6 py-3 pb-lg-5 border-right border-lmp-gray">
        <div class="overview-val-lg">31</div>
        <div class="card-label">Upcoming</div>
      </div>
      <div class="col-6 py-3 pb-lg-5">
        <div class="overview-val-lg">25</div>
        <div class="card-label">Today</div>
      </div>
      <div class="card-controls col-12 py-3 border-top border-lmp-gray">
        <a href="#" class="btn lmp-primary">Manage Leases</a>
      </div>
    </div>
  </div>
  
    
  

Dashboard overview card with a multiple call to actions.

    
      <div class="atp-card-overview">
    <div class="card-title">
      <h3 class="h4">Wet Flight Training
      <span>120-day look ahead</span>
      </h3>
    </div>
    <div class="row px-3">
      <div class="col-6 py-3 pb-lg-5 border-right border-lmp-gray">
        <div class="overview-val-lg">31</div>
        <div class="card-label">Upcoming</div>
      </div>
      <div class="col-6 py-3 pb-lg-5">
        <div class="overview-val-lg">25</div>
        <div class="card-label">Today</div>
      </div>
      <div class="card-controls col-12 py-3 border-top border-lmp-gray">
        <a href="#" class="btn lmp-primary">Book Training</a>
        <a href="#" class="btn lmp-link">Manage Leases</a>
      </div>
    </div>
  </div>
  
    
  

Dry Lease Overview Card

    
      <div class="atp-card-overview">
    <div class="card-title">
      <h3 class="h4 mb-2"><a href="#">(737) Fixed Based Simulator</a></h3>
      <ul class="title-details">
        <li><span class="sr-only">Location: </span>Gatwick</li>
      </ul>
    </div>
    <div class="row px-3">
  
      <div class="col-6 py-3 pb-lg-4 border-right border-lmp-gray">
        <div class="overview-val-lg">23</div>
        <div class="card-label">Upcoming</div>
      </div>
      <div class="col-6 py-3 pb-lg-4">
        <div class="overview-val-lg">3</div>
        <div class="card-label">Today</div>
      </div>
  
    </div>
  </div>