<?php
require('connection.inc.php');
require('security.php');

// Fetch all non-deleted blogs
$blog_result = $conn->query("SELECT * FROM blogs WHERE deleted_at IS NULL ORDER BY created_at DESC");
?>

<!doctype html>
<html class="no-js" lang="zxx">
<head>
      <meta charset="utf-8">
      <meta http-equiv="x-ua-compatible" content="ie=edge">
      <title>Blog - Loveberi </title>
      <meta name="description" content="">
      <meta name="viewport" content="width=device-width, initial-scale=1">

      <!-- Place favicon.ico in the root directory -->
      <link rel="shortcut icon" type="image/x-icon" href="assets/img/allnew/logo.png">

      <!-- CSS here -->
      <link rel="stylesheet" href="assets/css/bootstrap.min.css">
      <link rel="stylesheet" href="assets/css/animate.css">
      <link rel="stylesheet" href="assets/css/swiper-bundle.css">
      <link rel="stylesheet" href="assets/css/slick.css">
      <link rel="stylesheet" href="assets/css/magnific-popup.css">
      <link rel="stylesheet" href="assets/css/spacing.css">
      <link rel="stylesheet" href="assets/css/meanmenu.css">
      <link rel="stylesheet" href="assets/css/nice-select.css">
      <link rel="stylesheet" href="assets/css/fontawesome.min.css">
      <link rel="stylesheet" href="assets/css/icon-dukamarket.css">
      <link rel="stylesheet" href="assets/css/jquery-ui.css">
      <link rel="stylesheet" href="assets/css/main.css">
   </head>
   <body>


      <!-- Scroll-top -->
      <button class="scroll-top scroll-to-target" data-target="html">
         <i class="icon-chevrons-up"></i>
      </button>
      <!-- Scroll-top-end-->


      <!-- header-area-start -->
     <?php 
     include 'header.php'
     ?>
      <!-- header-area-end -->

      <main>

         <!-- blog-area-start -->
        <!-- blog-area-start -->
<section class="blog-area pt-80">
   <div class="container">
      <div class="row">
         <?php while ($blog = $blog_result->fetch_assoc()): ?>
            <div class="col-lg-4">
               <div class="tpblog__item tpblog__item-2 mb-20">
                  <div class="tpblog__thumb fix">
                     <a href="blog-details.php/<?= urlencode($blog['blog_url_name']) ?>">
                        <img src="admin/<?= htmlspecialchars($blog['blog_img']) ?>" alt="<?= htmlspecialchars($blog['blog_name']) ?>" height="300px">
                     </a>
                  </div>
                  <div class="tpblog__wrapper">
                     <div class="tpblog__entry-wap">
                       
                        <span class="post-data">
                           <a href="#"><?= date("M d, Y", strtotime($blog['created_at'])) ?></a>
                        </span>
                     </div>
                     <h4 class="tpblog__title">
                        <a href="blog-details.php/<?= urlencode($blog['blog_url_name']) ?>">
                           <?= htmlspecialchars($blog['blog_name']) ?>
                        </a>
                     </h4>
                     <p><?= mb_substr(strip_tags($blog['blog_description']), 0, 100) ?>...</p>
                     <div class="tpblog__details">
                      <a href="blog-details.php/<?= urlencode($blog['blog_url_name']) ?>">
   Continue reading <i class="icon-chevrons-right"></i>
</a>

                     </div>
                  </div>
               </div>
            </div>
         <?php endwhile; ?>
      </div>
   </div>
</section>
<!-- blog-area-end -->
         <!-- blog-area-end -->

      </main>
      <!-- footer-area-start -->
      <?php 
      include 'footer.php'
      ?>
      <!-- footer-area-end -->
      <!-- JS here -->
      <script src="assets/js/jquery.js"></script>
      <script src="assets/js/waypoints.js"></script>
      <script src="assets/js/bootstrap.bundle.min.js"></script>
      <script src="assets/js/swiper-bundle.js"></script>
      <script src="assets/js/nice-select.js"></script>
      <script src="assets/js/slick.js"></script>
      <script src="assets/js/magnific-popup.js"></script>
      <script src="assets/js/counterup.js"></script>
      <script src="assets/js/wow.js"></script>
      <script src="assets/js/isotope-pkgd.js"></script>
      <script src="assets/js/imagesloaded-pkgd.js"></script>
      <script src="assets/js/countdown.js"></script>
      <script src="assets/js/ajax-form.js"></script>
      <script src="assets/js/jquery-ui.js"></script>
      <script src="assets/js/meanmenu.js"></script>
      <script src="assets/js/main.js"></script>
   </body>
</html>
