details.html

<div class="fix-width-container">

  <div class="text-center my-3">
    <span class="h1">
      <img src="assets/images/details.png" width="40" height="40">
    </span>
    <span class="h1">
      Match Details
    </span>
  </div>

  <div class="row px-lg-5 py-3 mb-lg-5">
    <div class="col-12">
      <label class="form-label text-success h5">Match title:</label>
      <input type="text" id="matchTitle" class="form-control form-control-lg text-white bg-dark"
        value="World Cup Final">
    </div>
    <div class="col-12 mt-3">
      <label class="form-label text-success h5">Team 1:</label>
      <input type="text" id="teamOne" class="form-control form-control-lg text-white bg-dark" value="Netherlands">
    </div>
    <div class="col-12 mt-3">
      <label class="form-label text-success h5">Team 2:</label>
      <input type="text" id="teamTwo" class="form-control form-control-lg text-white bg-dark" value="Bangladesh">
    </div>
    <div class="col-12 mt-3">
      <label class="form-label text-success h5">Venue:</label>
      <input type="text" id="venue" class="form-control form-control-lg text-white bg-dark"
        value="The VRA Cricket Ground, Amstelveen">
    </div>
    <div class="col-12 mt-3">
      <label class="form-label text-success h5">Starts at:</label>
      <input type="datetime-local" id="startTime" class="form-control form-control-lg text-white bg-dark">
    </div>
    <div class="col-12 mt-3">
      <button class="btn btn-lg btn-success" onclick="matchDetailsSetup()">Next</button>
    </div>
  </div>

</div>