Advertisement
Guest User

Help | HTML v2

a guest
Aug 20th, 2017
77
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.54 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="utf-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6.     <meta name="description" content="">
  7.     <meta name="author" content="">
  8.     <link href="css/boostrap.css" rel="stylesheet">
  9.     <link href="css/styles.css" rel="stylesheet">
  10.  
  11.     <title>Title GG</title>
  12.  
  13.   </head>
  14.  
  15.  
  16. <nav class="navbar navbar-expand navbar-dark bg-dark">
  17.   <a class="navbar-brand" href="#"><img src="img/logo.png" width=35rem></a>
  18.   <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample02" aria-controls="navbarsExample02" aria-expanded="true" aria-label="Toggle navigation">
  19.     <span class="navbar-toggler-icon"></span>
  20.   </button>
  21.   <div class="collapse navbar-collapse" id="navbarsExample02">
  22.     <ul class="navbar-nav mr-auto">
  23.       <li class="nav-item active">
  24.         <a class="nav-link" href="#">Overview <span class="sr-only">(current)</span></a>
  25.       </li>
  26.       <li class="nav-item">
  27.         <a class="nav-link" href="#">Servers</a>
  28.       </li>
  29.       <li class="nav-item">
  30.         <a class="nav-link" href="#">Editor</a>
  31.       </li>
  32.     </ul>
  33.   </div>
  34. </nav>
  35.  
  36. <h1> System Overview </h1>
  37. <p> This page shows the overall infrastructure status </p>
  38.  
  39. <div class="container">
  40.   <div class="row">
  41.     <div class="col-md-4">
  42.  
  43. <!-- Windows Side -->
  44. <h4><img src="img/windows.png" width=40rem>   Windows</h4>
  45.  
  46. <table class="table table-bordered">
  47.   <thead>
  48.     <tr>
  49.       <th>Server</th>
  50.       <th>Status</th>
  51.     </tr>
  52.   </thead>
  53.   <tbody>
  54.     <tr>
  55.       <td>dc1.example.com</td>
  56.       <td class="status-ok">OK</td>
  57.     </tr>
  58.     <tr>
  59.       <td>dc2.example.com</td>
  60.       <td class="status-ok">OK</td>
  61.     </tr>
  62.     <tr>
  63.       <td>fs1.example.com</td>
  64.       <td class="status-ok">OK</td>
  65.     </tr>
  66.     <tr>
  67.       <td>fs2.example.com</td>
  68.       <td class="status-ok">OK</td>
  69.     </tr>
  70.     <tr>
  71.       <td>ex1.example.com</td>
  72.       <td class="status-ok">OK</td>
  73.     </tr>
  74.     <tr>
  75.       <td>sq1.example.com</td>
  76.       <td class="status-ok">OK</td>
  77.     </tr>
  78.   </tbody>
  79. </table>
  80.  
  81. </div>
  82.  
  83.  
  84. <!-- Linux Side -->
  85. <Div class="col-md-4">
  86. <h4><img src="img/linux.png" width=45rem> Linux</h4>
  87.  
  88.   <table class="table table-bordered">
  89.     <thead>
  90.       <tr>
  91.         <th>Server</th>
  92.         <th>Status</th>
  93.       </tr>
  94.     </thead>
  95.     <tbody>
  96.       <tr>
  97.         <td>web1.example.com</td>
  98.         <td class="status-ok">OK</td>
  99.       </tr>
  100.       <tr>
  101.         <td>web2.example.com</td>
  102.         <td class="status-degraded">Degraded </td>
  103.       </tr>
  104.       <tr>
  105.         <td>cs1.example.com</td>
  106.         <td class="status-offline">Offline</td>
  107.       </tr>
  108.       <tr>
  109.         <td>cs2.example.com</td>
  110.         <td class="status-ok">OK</td>
  111.       </tr>
  112.     </tbody>
  113.   </table>
  114. </div>
  115.  
  116. <!-- Hyper V side -->
  117. <Div class="col-md-4">
  118. <h4><img src="img/hyper-v.png" width=45rem> Hyper V's</h4>
  119.  
  120.   <table class="table table-bordered">
  121.     <thead>
  122.       <tr>
  123.         <th>Server</th>
  124.         <th>Status</th>
  125.       </tr>
  126.     </thead>
  127.     <tbody>
  128.       <tr>
  129.         <td>hv1.example.com</td>
  130.         <td class="status-ok">OK</td>
  131.       </tr>
  132.       <tr>
  133.         <td>hv2.example.com</td>
  134.         <td class="status-degraded">Degraded </td>
  135.       </tr>
  136.       <tr>
  137.         <td>hv4.example.com</td>
  138.         <td class="status-offline">Offline</td>
  139.       </tr>
  140.       <tr>
  141.         <td>hv5.example.com</td>
  142.         <td class="status-ok">OK</td>
  143.       </tr>
  144.     </tbody>
  145.   </table>
  146. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement