Viewing File: /home/rareljzw/public_html/blog.php

<?php
$PageTitle = "Blog";
include_once("./layout/header.php");
include($_SERVER['DOCUMENT_ROOT']. "/include/notified.php");

?>

<main class="pt-[5.5rem] lg:pt-24">
    <!-- Blog -->
    <section class="relative py-16 md:py-24">
        <picture class="pointer-events-none absolute inset-0 -z-10 dark:hidden">
            <img src="./assets/front/img/gradient_light.jpg" alt="gradient" class="h-full w-full" />
        </picture>
        <div class="container">
        

            <div class="grid grid-cols-1 gap-[1.875rem] sm:grid-cols-2 md:grid-cols-3">
                <!-- Posts -->

                <?php
                                        $stmt = $conn->prepare("SELECT * FROM blog");
                                        $stmt->execute();
                                        while($blogs = $stmt->fetch()){
                                ?>

                <article>
                    <div class="overflow-hidden rounded-2.5xl transition-shadow hover:shadow-lg">
                        <figure class="group overflow-hidden">
                            <a href="blog-post?id=<?=$blogs['blog_id'] ?>">
                                <img src="./assets/front/img/blog/<?=$blogs['image'] ?>" alt="post 2"
                                    class="h-full w-full object-cover transition-transform duration-[1600ms] will-change-transform group-hover:scale-105" />
                            </a>
                        </figure>

                        <!-- Body -->
                        <div
                            class="rounded-b-[1.25rem] border border-t-0 border-jacarta-100 bg-white p-[10%] dark:border-jacarta-600 dark:bg-jacarta-700">
                            <!-- Meta -->
                            <div class="mb-3 flex flex-wrap items-center space-x-1 text-xs">
                                <a href="#"
                                    class="font-display text-jacarta-700 hover:text-accent dark:text-jacarta-200"><?= $admin['name']?>  </a>
                                <span class="dark:text-jacarta-400">in</span>
                                <span class="inline-flex flex-wrap items-center space-x-1 text-accent">
                                    <a href="#"><?=$blogs['category'] ?></a>
                                </span>
                            </div>

                            <h2
                                class="mb-4 font-display text-xl text-jacarta-700 hover:text-accent dark:text-white dark:hover:text-accent">
                                <a href="blog-post?id=<?=$blogs['blog_id'] ?>"> <?=$blogs['title'] ?></a>
                            </h2>
                            <p class="mb-8 dark:text-jacarta-200">
                               <?= $blogs['tagline'];?>
                            </p>

                            <!-- Date / Time -->
                            <div class="flex flex-wrap items-center space-x-2 text-sm text-jacarta-400">
                                <span><time datetime="2022-02-05"><?=$blogs['createdAt'] ?></time></span>
                                <span>•</span>
                                <span>3 min read</span>
                            </div>
                        </div>
                    </div>
                </article>

                <?php
                                        }
                ?>
            </div>


        </div>
    </section>
    <!-- end blog -->

    <?php
  include_once("./layout/footer.php");

  ?>