<!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">
    <!-- CSS only -->
    <title>Document</title>

	<link rel="stylesheet" href="/styles/reset.css">
    <link rel="stylesheet" href="/styles/article.css">
	<link rel="stylesheet" href="/styles/navbar.css">
</head>
<body>
	<%- include ("partials/header.ejs", {logged: logged}) %>
	<div class="content">
        <img src="https://i.imgur.com/P3amfbP.jpg" alt="img">
        <h1><%= article.Title %></h1>
		<div class="card">
			<div class="card-body">
				<%- article.Content %>
			</div>
		</div>
		<br>

		<div class="content">
		<% comments.map((comment) => { %>
				<p><%= comment.Content %></p><br>
			<% }) %>
		</div>

		<form action="/articles/view/comment" method="POST">
			<input type="hidden" name="articleId" value="<%=id%>">
            <textarea name="message" cols="70" rows="10"></textarea>
    		<button type="submit">Comment</button>
		</form>
    </div>
</body>
