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

<head>
  <%- include('../partials/head'); %>
    <link rel="stylesheet" href="/public/css/single-post.css">
</head>

<body>


  <div class="main">

    <header class="header header-section sticky-lg-top">
      <%- include('../partials/header'); %>
    </header>

    <div class="single-post-section container ms-auto">
      <img class="rounded-3 my-3" src="/public/images/<%=post.image%>" width="100%" height="400px" alt="post-banner">
      <div class="row ">

        <div class="post py-3">
          <div class="post-title py-3">
            <h1>
              <%= post.title %>
            </h1>
          </div>

          <div class="meta-data">
            <p>
              <%= post.createdAt %>
            </p>
          </div>

          <div class="post-content" style="text-align: justify;">
            <p>
              <%= post.details %>
            </p>
          </div>
        </div>
      </div>


    </div>

    <footer class="footer">
      <%- include('../partials/footer'); %>
    </footer>

  </div>



  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.min.js"></script>
</body>

</html>