home.html

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB"
  crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.6/umd/popper.min.js"></script>
<link rel="stylesheet" href="./css.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ"
  crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
  crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup"
    aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
    <div class="navbar-nav">
      <a class="nav-item nav-link active" href="#">Home
        <span class="sr-only">(current)</span>
      </a>
      <a class="nav-item nav-link" href="./wordmap.html">Locations</a>
      <a class="nav-item nav-link" href="./timelinev2.html">Timeline</a>
      <a class="nav-item nav-link" href="./who.html">Names</a>
    </div>
  </div>
</nav>
<div class="container">
  <div class="card mb-3 mid" style="max-width: 18rem;">
    <div class="card-header" id="textHeader">
      <b>Text Mining for Journalism</b>
    </div>
    <div class="card-body">
      <h5 class="card-title">Data Visualisation</h5>
      <p class="card-text">Below are the three different data sets.</p>
    </div>
  </div>
  <div class="card-deck top">
    <div class="card">
      <div class="card-header">
        <b>Where</b>
      </div>
      <div class="card-body">
        <p class="card-text">Where (corresponds to locations, etc.)</p>
      </div>
      <div class="card-footer">
        <a href="./wordmap.html" class="btn btn-primary">
          <i class="fas fa-globe-americas"></i>
        </a>
      </div>
    </div>
    <div class="card">
      <div class="card-header">
        <b>When</b>
      </div>
      <div class="card-body">
        <p class="card-text">When (corresponds to times)</p>
      </div>
      <div class="card-footer">
        <a href="./timeline.html" class="btn btn-primary">
          <i class="fas fa-clock"></i>
        </a>
      </div>
    </div>
    <div class="card">
      <div class="card-header">
        <b>Who</b>
      </div>
      <div class="card-body">
        <p class="card-text">Who (corresponds to people, entities, etc.)</p>
      </div>
      <div class="card-footer">
        <a href="./who.html" class="btn btn-primary">
          <i class="fas fa-user"></i>
        </a>
      </div>
    </div>
  </div>
</div>