<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <ul class="nav nav-tabs"> <li class="nav-item"> <a class="nav-link active" href="http://chiverigenedev01.luminexcorp.com/fleet_status?site=LMA">LMA</a> </li> <li class="nav-item"> <a class="nav-link" href="http://chiverigenedev01.luminexcorp.com/fleet_status?site=LCH">LCH</a> </li> <li class="nav-item"> <a class="nav-link" href="http://chiverigenedev01.luminexcorp.com/fleet_status?site=LMNX">LMNX</a> </li> <li class="nav-item"> <a class="nav-link" href="http://chiverigenedev01.luminexcorp.com/fleet_status?site=LMD">LMD</a> </li> </ul> </div> <div class="container"> <div class="col-3"> <div class="card" style="width: 18rem;"> <div class="card-body"> <div class="container"> <h5 class="card-title">VGII-001</h5> <table class="table table-sm"> <thead class="thead-dark"> <tr> <th scope="col">Bay</th> <th scope="col">Status</th> <th scope="col">Assay</th> <th scope="col">Time</th> </tr> </thead> <tbody> <tr> <th scope="row">1</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 42%;"></div> </div> </td> </tr> <tr> <th scope="row">2</th> <td>Processing error</td> <td>CNSDEV</td> <td>nan</td> </tr> <tr> <td colspan="4"> <div class="progress bg-danger" style="height: 8px;"> <div class="bar" style="width: 100%;"></div> </div> </td> </tr> <tr> <th scope="row">3</th> <td>Processing Completed</td> <td>CNSDEV</td> <td>0:00</td> </tr> <tr> <td colspan="4"> <div class="progress bg-success" style="height: 8px;"> <div class="bar" style="width: 100%;"></div> </div> </td> </tr> <tr> <th scope="row">4</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">5</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">6</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> </tbody> </table> <a href="http://verigeneid00190f29a385:8888/reports?name=about" class="btn btn-primary" role="button">About Page</a> </div> </div> </div> </div> <div class="col-3"> <div class="card" style="width: 18rem;"> <div class="card-body"> <div class="container"> <h5 class="card-title">VGII-002</h5> <table class="table table-sm"> <thead class="thead-dark"> <tr> <th scope="col">Bay</th> <th scope="col">Status</th> <th scope="col">Assay</th> <th scope="col">Time</th> </tr> </thead> <tbody> <tr> <th scope="row">1</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">2</th> <td>Processing error</td> <td>CNSDEV</td> <td>nan</td> </tr> <tr> <td colspan="4"> <div class="progress bg-danger" style="height: 8px;"> <div class="bar" style="width: 100%;"></div> </div> </td> </tr> <tr> <th scope="row">3</th> <td>Processing Completed</td> <td>CNSDEV</td> <td>0:00</td> </tr> <tr> <td colspan="4"> <div class="progress bg-success" style="height: 8px;"> <div class="bar" style="width: 100%;"></div> </div> </td> </tr> <tr> <th scope="row">4</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">5</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">6</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> </tbody> </table> <a href="http://verigeneid00190f29a385:8888/reports?name=about" class="btn btn-primary" role="button">About Page</a> </div> </div> </div> </div> <div class="col-3"> <div class="card" style="width: 18rem;"> <div class="card-body"> <div class="container"> <h5 class="card-title">VGII-003</h5> <table class="table table-sm"> <thead class="thead-dark"> <tr> <th scope="col">Bay</th> <th scope="col">Status</th> <th scope="col">Assay</th> <th scope="col">Time</th> </tr> </thead> <tbody> <tr> <th scope="row">1</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">2</th> <td>Processing error</td> <td>CNSDEV</td> <td>nan</td> </tr> <tr> <td colspan="4"> <div class="progress bg-danger" style="height: 8px;"> <div class="bar" style="width: 100%;"></div> </div> </td> </tr> <tr> <th scope="row">3</th> <td>Processing Completed</td> <td>CNSDEV</td> <td>0:00</td> </tr> <tr> <td colspan="4"> <div class="progress bg-success" style="height: 8px;"> <div class="bar" style="width: 100%;"></div> </div> </td> </tr> <tr> <th scope="row">4</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">5</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> <tr> <th scope="row">6</th> <td>Processing</td> <td>CNSDEV</td> <td>1:10</td> </tr> <tr> <td colspan="4"> <div class="progress progress-striped bg-warning active" style="height: 8px;"> <div class="bar" style="width: 36%;"></div> </div> </td> </tr> </tbody> </table> <a href="http://verigeneid00190f29a385:8888/reports?name=about" class="btn btn-primary" role="button">About Page</a> </div> </div> </div> </div> </div>