feat: add logs page

app/logs/page.tsx

@@ -0,0 +1,24 @@
+import LogBanner from "@/components/LogBanner";
+import logs from "@/data/logs.json";
+
+export default function Logs() {
+  const logsWithId = logs.map((article, index) => ({ ...article, id: index }));
+
+  return (
+    <main className="bg-background">
+      <h1 className="flex justify-center text-4xl font-semibold text-[#353335]">
+        Logs
+      </h1>
+
+      <div className="flex justify-center">
+        <ul className="pt-12">
+          {logsWithId.map((article) => (
+            <li key={article.id}>
+              <LogBanner {...article} />
+            </li>
+          ))}
+        </ul>
+      </div>
+    </main>
+  );
+}

components/LogBanner.tsx

@@ -0,0 +1,31 @@
+import Link from "next/link";
+
+interface ILogBannerProps {
+  title: string;
+  content: string;
+  datePublished: string;
+  forDisplayTime: string;
+  path: string;
+}
+
+export default function LogBanner({
+  title,
+  content,
+  datePublished,
+  forDisplayTime,
+  path,
+}: ILogBannerProps) {
+  return (
+    <article className="pt-10">
+      <Link href={path}>
+        <div className="h-[225px] w-[930px] bg-light-gray px-8 pt-6">
+          <h2 className="text-3xl font-semibold">
+            {title + " - "}
+            <time dateTime={datePublished}>{forDisplayTime}</time>
+          </h2>
+          <p className="break-words pt-2 text-3xl font-semibold">{content}</p>
+        </div>
+      </Link>
+    </article>
+  );
+}

data/logs.json

@@ -0,0 +1,23 @@
+[
+  {
+    "title": "titulo",
+    "content": "conteúdo",
+    "datePublished": "2077-10-02 9:00",
+    "forDisplayTime": "9H00",
+    "path": "/logs"
+  },
+  {
+    "title": "título2",
+    "content": "conteúdo2",
+    "datePublished": "2023-08-02 21:40",
+    "forDisplayTime": "21H40",
+    "path": "/logs"
+  },
+  {
+    "title": "título3",
+    "content": "conteúdo3",
+    "datePublished": "2023-08-02 21:37",
+    "forDisplayTime": "21H37",
+    "path": "/"
+  }
+]