<%# Page to select subject to train on %>
<%# ARGUMENTS: subjects - subjects to train on as a list, qNum - weird ID %>

<%- include("../../partials/header") -%>
<%- include("../../partials/navigationPrivate") -%>

<div class="jumbotron container mt-5">
  <h3 style="text-align: center;">Select a subject below to train on:</h3>

  <div class="container">
    <div class="row mx-auto justify-content-around">
      <div class="col-12 col-lg-4">
        <div class="card" style="width: 18rem;">
          <img class="card-img-top" src="https://cdn.mutorials.org/images/icons/Physics_Main.svg" alt="Physics Icon">
          <div class="card-body text-center">
            <h5 class="card-title">Physics</h5>
            <p class="card-text">Improve your Physics!</p>
            <a href="/train/Physics/chooseUnits" class="btn btn-primary">Train Now</a>
          </div>
        </div>
      </div>
      <div class="col-12 col-lg-4">
        <div class="card" style="width: 18rem;">
          <img class="card-img-top" src="https://cdn.mutorials.org/images/icons/Chem_Main.svg" alt="Chemistry Icon">
          <div class="card-body text-center">
            <h5 class="card-title">Chemistry</h5>
            <p class="card-text">Advance your Chemistry!</p>
            <a href="/train/Chemistry/chooseUnits" class="btn btn-primary">Train Now</a>
          </div>
        </div>
      </div>
      <div class="col-12 col-lg-4">
        <div class="card" style="width: 18rem;">
          <img class="card-img-top" src="https://cdn.mutorials.org/images/icons/Bio_Main.svg" alt="Biology Icon">
          <div class="card-body text-center">
            <h5 class="card-title">Biology</h5>
            <p class="card-text">Brighten your Biology!</p>
            <a href="/train/Biology/chooseUnits" class="btn btn-primary">Train Now</a>
          </div>
        </div>
      </div>
      <div class="col-12 col-lg-4">
        <div class="card" style="width: 18rem;">
          <img class="card-img-top" src="https://mutorials.blob.core.windows.net/images/icons/ess icon.jpeg" alt="USABO Icon">
          <div class="card-body text-center">
            <h5 class="card-title">ESS</h5>
            <a href="/train/ESS/chooseUnits" class="btn btn-primary">Train Now!</a>
          </div>
        </div>
      </div>
    </div>
  </div>

</div>

<%- include("../../partials/footer") -%>
