<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Acknowledgement slip - <%= project.student.username%>
  </title>
  <link rel="stylesheet" href="css/receipts.css">
  <link rel="stylesheet" href="css/bootstrap1.min.css">
  <script src="js/bootstrap1.min.js"></script>
  <style>
    .box {
      background-color: white;
      height: 100vh;
      background-image: url("img/kpb.png");
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      /* background-size: 40%;  */
    }

    .img_size {
      width: 50px;
      height: 50px;
    }

    .title_text {
      text-align: center;
      font-weight: bold;
      font-size: 22px;
    }

    .pmb {
      text-align: center;
      font-weight: bold;
      font-size: 13px;
    }

    .pas {
      text-decoration: underline;
      font-weight: 900;
      text-align: center;
      font-size: large;
      font-size: 13px;
    }

    .heading {
      text-decoration: underline;
      font-weight: 900;
    }

    .img_box {
      height: 110px;
      width: inherit;
      background-color: rgb(233, 230, 230);
    }

    .cont {
      display: inline-block;
    }

    .b_text {
      display: inline-block;
    }

    .value {
      font-size: 14px;
    }

    .p_sub {
      font-size: 14px;
    }

    .pr_text {
      font-size: 14px;
    }

    .line {
      border-top: 1px solid black;
      width: 10rem;
      /* margin-bottom: 10px; */
    }

    .signature-line {
      border-top: 1px solid black;
      justify-content: end;
      width: 20rem;
      margin-top: 10px;
    }

    .line_text {
      text-align: center;
      align-items: center;
      font-size: 11px;
    }

    .date {
      float: left;
      align-items: start;
    }

    .sign {
      float: right;
      align-items: flex-end;
    }

    .nbred {
      color: red;
      font-size: 10px;
    }
  </style>
</head>

<body onload="window.print()">
  <div class="">
    <div class="row justify-content-center">
      <div class="col-lg-12 mt-4">
        <div class="row justify-content-center">
          <div class="col-lg-3 col-sm-6 col-md-6 logo_center">
            <img src="/img/logo.png" width="120" alt="">
          </div>
          <div class="col-lg-6 logo_center">
            <h2 class="title_text justify-content-center">Kwara State College of Education, Ilorin</h2>
            <h4 class="pas justify-content-center">PROJECT COMPLETION EXIT FORM</h4>
            <h4 class="pas justify-content-center">[Final year Research Report]</h4>
          </div>
        </div>
      </div>
    </div>

    <div class="mt-5">
      <img src="/avatar/<%= project.student.photo_path%>" alt="" width="90" height="90" style="float: right;">
      <ul style="list-style-type: none;">
        <li><u><b>PERSONAL DATA</b></u></li>
        <li><span><b>Matriculation No:</b></span>
          <span>
            <%= project.student.username%>
          </span>
        </li>
        <li><span><b>Student Name:</b></span>
          <span>
            <%= project.student.lastname%>
              <%= project.student.middlename%>
                <%= project.student.firstname%>
          </span>
        </li>
        <li><span><b>Email Address:</b></span>
          <span>
            <%= project.student.email%>
          </span>
        </li>
        <li><span><b>School:</b></span>
          <span>
            <%= project.student.department.institute.name%>
          </span>
        </li>
        <li><span><b>Course:</b></span>
          <span>
            <%= project.student.department.name%>
          </span>
        </li>
        <li><span><b>Supervisor Name</b></span>
          <span>
            <%= supervisor.supervisor_name %>
          </span>
        </li>
      </ul>
      <ul style="list-style-type: none;">

        <div class="heading mt-3">
          <h6><strong>COLLEGE LIBRARIAN CERTIFICATION:</strong></h6>
        </div>
        <div>
          <p class="pr_text">
            This is to Certify that <strong>
              <%= project.student.lastname%>
                <%= project.student.middlename%>
                  <%= project.student.firstname%>
            </strong> with the project topic
            <strong>
              <%=project.topic %>
            </strong> has successfully completed and submitted the
            Research for <%= Sessions%> academic session.<br /><br />
              Kindly proceed with binding of the said project.
          </p>
        </div>
        <br>
        <div class="col-lg-3 date" style="float: right;">
          <div class="line"></div>
          <span class="line_text">Date</span>
        </div>
        <div class="row">

          <div class="col-lg-5 sign">
            <div class="signature-line"></div>
            <span class="line_text">College Librarian Signature</span>
          </div>
        </div>
        <div class="row">
          <div class="col-lg-2 mt-3">
            <img src="img/qr.png" alt="" />
          </div>
        </div>
        <img src="<%=src%>" alt="" style="float: right;">
        <div class="nbred mt-4">
          <p>
            This Document indicate that the Student has Completed his/her Project. No Result will be Approved at the
            Academic Board unless Student Sign and Stamp this document.
          </p>
        </div>
      </ul>
    </div>

    <script>




      const date = new Date()
      document.getElementById('now').innerHTML = "&nbsp;" + date.toDateString()
    </script>
  </div>
</body>

</html>