<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>{{ site.title }}</title>
    <link rel="stylesheet" href="/static/lims.css">
    <link rel="icon" href="/static/favicon.ico">
    <script src="/static/htmx.min.js"></script>
  </head>
  <body>
    <h1>{{ site.title }}</h1>
    <h2 class="subtitle">{{ site.description }}</h2>
    <div class="row">
      <div class="col-4" id="overview">
	<h2>Overview</h2>
	<table>
	  <thead>
	    <tr>
	      <th>What</th>
	      <th>How Many</th>
	    </tr>
	  </thead>
	  <tbody>
	    <tr>
	      <td><a href="#" hx-get="/assays" hx-target="#details">assays</a></td>
	      <td class="right">{{ n_assays }}</td>
	    </tr>
	    <tr>
	      <td><a href="#" hx-get="/machines" hx-target="#details">machines</a></td>
	      <td class="right">{{ n_machines }}</td>
	    </tr>
	    <tr>
	      <td><a href="#" hx-get="/persons" hx-target="#details">persons</a></td>
	      <td class="right">{{ n_persons }}</td>
	    </tr>
	    <tr>
	      <td><a href="#" hx-get="/specimens" hx-target="#details">specimens</a></td>
	      <td class="right">{{ n_specimens }}</td>
	    </tr>
	    <tr>
	      <td><a href="#" hx-get="/surveys" hx-target="#details">surveys</a></td>
	      <td class="right">{{ n_surveys }}</td>
	    </tr>
	  </tbody>
	</table>
      </div>
      <div class="col-8" id="details">
      </div>
    </div>
  </body>
</html>
