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

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=;;, initial-scale=1.0">
    <% if (article !=null) { %>
        <% article.forEach(function(article, index) { %>
            <title><%- article.title %> - DevKids</title>
            <% }) %>
                <% } %>

                    <!-- Bootstrap CSS -->
                    <link rel="stylesheet" href="/public/bootstrap/css/bootstrap.min.css">

                    <!-- Font Awesome -->
                    <link rel="stylesheet" href="/public/fontawesome/css/all.css">

                    <link rel="preconnect" href="https://fonts.googleapis.com">
                    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
                    <link href="https://fonts.googleapis.com/css2?family=Prompt&display=swap" rel="stylesheet">

                    <link rel="stylesheet" href="/public/css/index.css">

                    <script src="/public/js/main.js"></script>
</head>

<body>
    <header>
        <%- include('partials/navbar'); %>
    </header>

    <br>

    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <% if (article !=null) { %>
                    <% article.forEach(function(article, index) { %>
                        <img src="<%- article.thumb_url %>" class="img-fluid" alt="..." width="70%">
                        <h3><%- article.title %></h3>
                        <h5><%- article.desc %></h5>
                        <% }) %>
                            <% } else { %>
                                ไม่พบโพสต์ที่จะแสดง
                                <% } %>
            </div>
        </div>
    </div>

    <br>

    <footer>
        <%- include('partials/footer'); %>
    </footer>

    <script src="/public/bootstrap/js/bootstrap.bundle.js"></script>
</body>

</html>