diff --git a/assets/styles/app.css b/assets/styles/app.css
index 790b83a..4217a6f 100644
--- a/assets/styles/app.css
+++ b/assets/styles/app.css
@@ -4,6 +4,11 @@ body {
   color: #1a2c4c;
 }
 
+.posts-container ul {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
 
 .profile-container {
   background-color: #fff;
@@ -11,6 +16,7 @@ body {
   border-radius: 8px;
   margin: 20px auto;
   padding: 20px;
+  padding-bottom: 5px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
   width: 70%;
 }
@@ -148,23 +154,6 @@ body {
   cursor: pointer;
 }
 
-html {
-  --s: 257px;
-  /* control the size */
-  --c1: #38476b;
-  --c2: #bda3b6;
-
-  --_c: var(--c1) calc(100% - var(--s)/2) 99%, #0000;
-  --_g: var(--s), #0000 calc(99% - var(--s)/2), var(--_c);
-  background:
-    radial-gradient(var(--s) at 100% var(--_g)),
-    radial-gradient(calc(var(--s)/4) at 50% calc(100%/3), var(--_c)) var(--s) 0,
-    radial-gradient(var(--s) at 0% var(--_g)) 0 calc(3*var(--s)) var(--c2);
-  background-size:
-    calc(2*var(--s)) calc(9*var(--s)/4),
-    calc(2*var(--s)) calc(3*var(--s)/4);
-}
-
 header {
   background-color: #bda3b6;
   padding: 4px;
@@ -172,6 +161,10 @@ header {
   border-style: solid;
   border-color: #1a2c4c;
   border-width: 2px;
+
+  &.nightmare {
+    background-color: #010101;
+  }
 }
 
 nav {
@@ -190,6 +183,10 @@ nav {
   text-decoration: none;
   color: #333;
   margin-right: 30px;
+
+  &.nightmare {
+    color: white;
+  }
 }
 
 nav img {
diff --git a/config/packages/security.yaml b/config/packages/security.yaml
index a5f1925..c7bb99b 100644
--- a/config/packages/security.yaml
+++ b/config/packages/security.yaml
@@ -21,7 +21,7 @@ security:
                 login_path: app_login
                 check_path: app_login
                 enable_csrf: true
-                default_target_path: all post
+                default_target_path: all_posts
             logout:
                 path: app_logout
                 target: /login
diff --git a/public/css/base.css b/public/css/base.css
index a2cdfa2..e00ff62 100644
--- a/public/css/base.css
+++ b/public/css/base.css
@@ -2,23 +2,8 @@
   font-family: "Helvetica", 'Courier New', Courier, monospace;
 }
 
-#wrapper {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  margin: 2em auto;
-  width: 70%;
-
-  >h1 {
-    color: white;
-    font-size: 3em;
-    margin-top: 0;
-  }
-}
-
 html {
   --s: 257px;
-  /* control the size */
   --c1: #38476b;
   --c2: #bda3b6;
 
@@ -31,4 +16,27 @@ html {
   background-size:
     calc(2*var(--s)) calc(9*var(--s)/4),
     calc(2*var(--s)) calc(3*var(--s)/4);
+
+  &.nightmare {
+    --c1: #990000;
+    --c2: #101010;
+  }
+}
+
+#wrapper {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  margin: 2em auto;
+  width: 70%;
+
+  >h1 {
+    color: white;
+    font-size: 3em;
+    margin-top: 0;
+  }
+}
+
+ul {
+  padding: 0;
 }
\ No newline at end of file
diff --git a/public/css/components/comment.css b/public/css/components/comment.css
new file mode 100644
index 0000000..b4bd777
--- /dev/null
+++ b/public/css/components/comment.css
@@ -0,0 +1,33 @@
+.comment-wrapper {
+  background-color: #f2f2f7;
+  border: 1px solid black;
+  border-radius: 1rem;
+  padding: 10px;
+
+  &.nightmare {
+    background-color: #3a3c6e;
+    color: white;
+  }
+
+  .comment-info {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 10px;
+  }
+
+  .comment-text {
+    p {
+      white-space: pre-wrap;
+      font-size: 1em;
+      margin: 0 auto;
+    }
+
+    margin-left: 5px;
+  }
+
+  a {
+    text-decoration: none;
+    color: black;
+  }
+}
\ No newline at end of file
diff --git a/public/css/components/post.css b/public/css/components/post.css
index af6f77e..d8c7f57 100644
--- a/public/css/components/post.css
+++ b/public/css/components/post.css
@@ -1,11 +1,26 @@
 #post-wrapper {
   width: 70%;
   background-color: #f2f2f7;
+  color: black;
   margin: 0 auto;
   border: 3px solid black;
   border-radius: 1rem;
   padding: 20px;
-  margin-top: 25vh;
+  margin-top: 5vh;
+
+  &.nightmare {
+    background-color: #1b1447;
+    color: white;
+  }
+
+  h1 {
+    font-size: 3em;
+  }
+
+  p {
+    white-space: pre-wrap;
+    font-size: 1.2em;
+  }
 }
 
 #post-info {
@@ -15,26 +30,41 @@
   gap: 10px;
 }
 
-h1 {
-  font-size: 3em;
-}
-
-p {
-  white-space: pre-wrap;
-  font-size: 1.2em;
-}
-
 #comments {
   h2 {
     font-size: 30px;
   }
+
+  #comments-wrapper {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    padding: 10px 0px;
+  }
 }
 
 hr {
   color: black;
 }
 
-a {
-  text-decoration: none;
-  color: black;
+#comment {
+  display: flex;
+  flex-direction: rows;
+  align-items: center;
+  gap: 2rem;
+  justify-content: space-between;
+
+  :first-child {
+    width: 100%;
+  }
+
+  #comment_text {
+    display: flex;
+    flex-grow: 1;
+  }
+
+  a {
+    text-decoration: none;
+    color: black;
+  }
 }
\ No newline at end of file
diff --git a/public/css/components/post_mini.css b/public/css/components/post_mini.css
index ca42be8..4d52c60 100644
--- a/public/css/components/post_mini.css
+++ b/public/css/components/post_mini.css
@@ -1,9 +1,24 @@
 #post-wrapper {
   background-color: #f2f2f7;
+  color: black;
   border: 3px solid black;
   border-radius: 1rem;
   padding: 20px;
   transition: .3s;
+
+  a {
+    text-decoration: none;
+    color: black;
+  }
+
+  &.nightmare {
+    background-color: #1b1447;
+    color: white;
+
+    a {
+      color: white;
+    }
+  }
 }
 
 #post-wrapper:hover {
@@ -27,8 +42,3 @@
     font-size: 1em;
   }
 }
-
-a {
-  text-decoration: none;
-  color: black;
-}
\ No newline at end of file
diff --git a/src/Controller/PostController.php b/src/Controller/PostController.php
index 21b90e9..f16d3fd 100644
--- a/src/Controller/PostController.php
+++ b/src/Controller/PostController.php
@@ -2,12 +2,14 @@
 
 namespace App\Controller;
 
+use App\Entity\Commentary;
 use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\HttpFoundation\Request;
 use Symfony\Component\Routing\Attribute\Route;
 use Doctrine\ORM\EntityManagerInterface;
 use App\Entity\Post;
 use App\Form\Type\PostType;
+use App\Form\Type\CommentType;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
 
 class PostController extends AbstractController
@@ -20,8 +22,7 @@ class PostController extends AbstractController
         $this->em = $em;
     }
 
-    # DEBUG: Ne doit pas être laissé en production.
-    #[Route('/', name: 'all post', methods: ['GET'])]
+    #[Route('/', name: 'all_posts', methods: ['GET'])]
     public function getAllPost(): Response
     {
         $posts = $this->em->getRepository(Post::class)->findAll();
@@ -35,18 +36,35 @@ class PostController extends AbstractController
     #[Route(
         '/post/{id}',
         name: 'display_post',
-        methods: ['GET'],
+        methods: ['GET', 'POST'],
         requirements: ['id' => '\d+']
     )]
-    public function getPost(int $id): Response
+    public function getPost(int $id, Request $request): Response
     {
         $post = $this->em->getRepository(Post::class)->find($id);
 
         if (!$post) {
         }
+        
+        $comment = new Commentary();
+        $commentForm = $this->createForm(CommentType::class, $comment);
+
+        $commentForm->handleRequest($request);
+        if ($commentForm->isSubmitted() && $commentForm->isValid()) {
+            $user = $this->getUser();
+
+            $comment->setProfil($user);
+            $comment->setPost($post);
+
+            $this->em->persist($comment);
+            $this->em->flush();
+
+            return $this->redirectToRoute('display_post', ['id' => $id]);
+        }
 
         return $this->render('post/post.html.twig', [
-            'post' => $post
+            'post' => $post,
+            'commentForm' => $commentForm,
         ]);
     }
 
@@ -88,4 +106,33 @@ class PostController extends AbstractController
         }
         return new Response();
     }
+
+    #[Route('/post/{id}/comment', name: 'post_comment', methods: ['POST'])]
+    public function addComment(int $id, Request $request): Response
+    {
+        $this->denyAccessUnlessGranted('IS_AUTHENTICATED');
+
+        $comment = new Commentary();
+        $form = $this->createForm(CommentType::class, $comment);
+
+        $form->handleRequest($request);
+        if ($form->isSubmitted() && $form->isValid()) {
+            $post = $this->em->getRepository(Post::class)->find($id);
+            
+            $form = $form->getData();
+            $user = $this->getUser();
+
+            $comment->setProfil($user);
+            $comment->setPost($post);
+
+            $this->em->persist($comment);
+            $this->em->flush();
+
+            return $this->redirectToRoute('display_post', ['id' => $id]);
+        }
+
+        return $this->render('post/new.html.twig', [
+            'form' => $form,
+        ]);
+    }
 }
diff --git a/src/Controller/ProfilController.php b/src/Controller/ProfilController.php
index 9e94137..2896ab8 100644
--- a/src/Controller/ProfilController.php
+++ b/src/Controller/ProfilController.php
@@ -6,7 +6,6 @@ use App\Entity\Profil;
 use App\Form\ProfilType;
 use App\Repository\PostRepository;
 use Doctrine\ORM\EntityManager;
-use SebastianBergmann\Environment\Console;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
 use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\Routing\Attribute\Route;
@@ -15,16 +14,15 @@ use Symfony\Component\HttpFoundation\Request;
 class ProfilController extends AbstractController
 {
 
-
-    public function __construct(private EntityManager $mgr, private PostRepository $postRepository)
-    {
-    }
+    public function __construct(private EntityManager $mgr, private PostRepository $postRepository) {}
+    
     #[Route(path: "/profil", name: "profil_perso", methods: ["GET"])]
     public function baseProfil(): Response
     {
         $this->denyAccessUnlessGranted('IS_AUTHENTICATED');
         return $this->redirectToRoute('profil_show', ['id' => $this->getUser()->getId()]);
     }
+
     #[Route('/profil/{id}', name: 'profil_show', requirements: ['id' => '\d+'])]
     public function profil(int $id): Response
     {
@@ -41,7 +39,6 @@ class ProfilController extends AbstractController
         ]);
     }
 
-
     #[Route('/profil/post/follow', name: 'profil_post_follow')]
     public function postProfilfollow(): Response
     {
@@ -136,7 +133,7 @@ class ProfilController extends AbstractController
     }
 
     #[Route('/profil/delete', name: 'profil_delete', methods: ['POST'])]
-    public function delete(Request $request): Response
+    public function delete(): Response
     {
         $profil = $this->mgr->find(Profil::class, $this->getUser()->getId());
 
@@ -155,6 +152,4 @@ class ProfilController extends AbstractController
 
         return $this->redirectToRoute('app_logout');
     }
-
-
 }
diff --git a/src/Entity/Commentary.php b/src/Entity/Commentary.php
index f54f60c..c5af0c3 100644
--- a/src/Entity/Commentary.php
+++ b/src/Entity/Commentary.php
@@ -2,12 +2,10 @@
 
 namespace App\Entity;
 
-use ApiPlatform\Metadata\ApiResource;
 use App\Repository\CommentaryRepository;
 use Doctrine\ORM\Mapping as ORM;
 
 #[ORM\Entity(repositoryClass: CommentaryRepository::class)]
-#[ApiResource]
 class Commentary
 {
     #[ORM\Id]
diff --git a/src/Form/CommentType.php b/src/Form/CommentType.php
new file mode 100644
index 0000000..44ef234
--- /dev/null
+++ b/src/Form/CommentType.php
@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Form\Type;
+
+use Symfony\Component\Form\AbstractType;
+use Symfony\Component\Form\Extension\Core\Type\SubmitType;
+use Symfony\Component\Form\Extension\Core\Type\TextType;
+use Symfony\Component\Form\FormBuilderInterface;
+
+class CommentType extends AbstractType
+{
+    public function buildForm(FormBuilderInterface $builder, array $options): void
+    {
+        $builder
+            ->add('text', TextType::class, [
+                    'label' => false
+                ])
+            ->add('submit', SubmitType::class, [
+                'label' => 'Comment'
+                ])
+        ;
+    }
+}
diff --git a/templates/base.html.twig b/templates/base.html.twig
index 3d89853..8e1db6d 100644
--- a/templates/base.html.twig
+++ b/templates/base.html.twig
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html class="{{ nightmare|default('') }}">
     <head>
         <meta charset="UTF-8">
         <title>{% block title %}Fukafukashita{% endblock %}</title>
@@ -14,19 +14,21 @@
         {% endblock %}
     </head>
     <body>
-        <header>
+        <header class="{{ nightmare|default('') }}">
             <nav>
                 <div class="nav-links">
                 <a class="nav-logo" href="/">
                     <img src="{{ asset('images/logo.jpg') }}" alt="Logo">
                 </a>
-                <a class="nav-link" href="/"><h1>FukaFukashita</h1></a>
+                <a class="nav-link {{ nightmare|default('') }}" href="/"><h1>Fukafukashita</h1></a>
                 </div>
                 <div class="nav-links">
-                    <a href="/profil/post/follow" class="nav-link">Abonnements</a>
-                    <a href="/profil" class="nav-link">Compte</a>
                     {% if is_granted('ROLE_USER') %}
-                        <a href="/logout" class="nav-link">Se déconnecter</a>
+                        <a href="/profil/post/follow" class="nav-link {{ nightmare|default('') }}">Feed</a>
+                        <a href="/profil" class="nav-link {{ nightmare|default('') }}">Profile</a>
+                        <a href="/logout" class="nav-link {{ nightmare|default('') }}">Log out</a>
+                    {% else %}
+                        <a href="/login" class="nav-link {{ nightmare|default('') }}">Log in</a>
                     {% endif %}
                 </div>
             </nav>
diff --git a/templates/comment/comment.html.twig b/templates/comment/comment.html.twig
new file mode 100644
index 0000000..5a43958
--- /dev/null
+++ b/templates/comment/comment.html.twig
@@ -0,0 +1,13 @@
+<div class="comment-wrapper{% if dream %} nightmare{% endif %}">
+  <div class="comment-info">
+    <img src="https://api.dicebear.com/8.x/big-smile/svg?seed={{ comment.profil.name }}" width="35px">
+    <span>{{ comment.profil.name }}</span>
+      {# <span>- {{ post.dateCreated }}</span> #}
+    <span>-</span>
+    {# <span>{{ post.createdAt }}|date('l, F j, Y')</span> #}
+  </div>
+
+  <div class="comment-text">
+    <p>{{ comment.text }}</p>
+  </div>
+</div>
diff --git a/templates/post/post.html.twig b/templates/post/post.html.twig
index 9ca843c..29abeb3 100644
--- a/templates/post/post.html.twig
+++ b/templates/post/post.html.twig
@@ -1,13 +1,19 @@
 {% extends 'base.html.twig' %}
 
+{% if post.dream %}
+  {% set nightmare = 'nightmare' %}
+{% endif %}
+
 {% block stylesheets %}
 <link rel="stylesheet" href="{{ asset('css/components/post.css') }}">
+<link rel="stylesheet" href="{{ asset('css/components/form.css') }}">
+<link rel="stylesheet" href="{{ asset('css/components/comment.css') }}">
 {% endblock %}
 
 {% block title %}{{ post.title }}{% endblock %}
 
 {% block body %}
-<div id="post-wrapper">
+<div id="post-wrapper" class="{% if post.dream %}nightmare{% endif %}">
   <div id="post">
     <div id="post-info">
       <a href="{{ path('profil_show', {'id': post.profil.id}) }}">
@@ -15,7 +21,8 @@
       </a>
         <span>{{ post.profil.name }}</span>
       {# <span>- {{ post.dateCreated }}</span> #}
-      <span>- Il y a 3 jours</span>
+      <span>-</span>
+      <span>{{ post.createdAt|date('l, F j, Y') }}</span>
     </div>
 
     <h1 id="post-title">{{ post.title }}</h1>
@@ -26,6 +33,18 @@
 
   <div id="comments">
     <h2>Comments</h2>
+    
+    {% if is_granted('ROLE_USER') %}    
+      <div class="form-container">
+        {{ form(commentForm) }}
+      </div>
+    {% endif %}
+
+    <div id="comments-wrapper">
+      {% for comment in post.commentaries %}
+        {% include 'comment/comment.html.twig' with { 'comment' : comment, 'dream' : post.dream } %}
+      {% endfor %}
+    </div>
   </div>
 </div>
 {% endblock %}
diff --git a/templates/post/post_mini.html.twig b/templates/post/post_mini.html.twig
index ca75a66..a45013f 100644
--- a/templates/post/post_mini.html.twig
+++ b/templates/post/post_mini.html.twig
@@ -1,5 +1,5 @@
 {% block body %}
-<div id="post-wrapper">
+<div id="post-wrapper" class="{% if post.dream %}nightmare{% endif %}">
   <div id="post">
     <div id="post-info">
       <a href="{{ path('profil_show', {'id': post.profil.id}) }}">
@@ -7,12 +7,13 @@
       </a>
         <span>{{ post.profil.name }}</span>
       {# <span>- {{ post.dateCreated }}</span> #}
-      <span>- Il y a 3 jours</span>
+      <span>-</span>
+      <span>{{ post.createdAt|date('l, F j, Y') }}</span>
     </div>
 
     <a href="{{ path('display_post', {'id': post.id}) }}">
       <h1 id="post-title">{{ post.title }}</h1>
-      <p>{{ post.text|u.truncate(150, true, '...') }}</p>
+      <p>{{ post.text|u.truncate(150, '...', false) }}</p>
     </a>
   </div>
 </div>
diff --git a/var/data.db b/var/data.db
index f945658..c721252 100644
Binary files a/var/data.db and b/var/data.db differ