From 2c7976997005d1c3c70dde097c3ab67100dd3773 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Do=C4=9Fukan=20=C3=9Crker?= <dogukanurker@icloud.com>
Date: Thu, 28 Dec 2023 20:39:09 +0300
Subject: [PATCH] comment content and post content overflow fixed

---
 static/css/general.css |  1 +
 static/css/post.css    |  5 ++++-
 templates/post.html    | 28 +++++++++++++++-------------
 3 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/static/css/general.css b/static/css/general.css
index 90d71b62..8517e633 100644
--- a/static/css/general.css
+++ b/static/css/general.css
@@ -10,6 +10,7 @@
   font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif,
     "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   color: var(--themePrimary);
+  overflow-wrap: break-word !important;
 }
 
 html {
diff --git a/static/css/post.css b/static/css/post.css
index 9fa1d72f..1b4a4117 100644
--- a/static/css/post.css
+++ b/static/css/post.css
@@ -34,7 +34,7 @@
 
 .comment {
   display: block;
-  width: 25rem;
+  width: 27.5rem;
   height: 8rem;
   background-color: transparent;
   border: none;
@@ -118,4 +118,7 @@ small {
   .navbar * {
     width: 100%;
   }
+  .comment {
+    max-width: 90%;
+  }
 }
diff --git a/templates/post.html b/templates/post.html
index aa60df7a..495d9cb4 100644
--- a/templates/post.html
+++ b/templates/post.html
@@ -45,19 +45,21 @@ <h5 class="date">{{date}}</h5>
   </div>
   {% endif %} {% for comment in comments %}
   <div class="comments">
-    <img class="profilePicture" src="{{ getProfilePicture(comment[3]) }}" />
-    <section class="commentUserNameContainer">
-      <a href="/user/{{comment[3]|lower}}" class="commentUserName"
-        >{{comment[3]}} :</a
-      >
-    </section>
-    <p class="centeredHorizontally">{{comment[2]}}</p>
-    {% if session["userName"] == comment[3] %}
-    <form method="post">
-      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
-      <input type="hidden" name="commentID" value="{{comment[0]}}" />
-      <button type="submit" name="commentDeleteButton">🗑️</button>
-    </form>
+    <div class="comment">
+      <img class="profilePicture" src="{{ getProfilePicture(comment[3]) }}" />
+      <section class="commentUserNameContainer">
+        <a href="/user/{{comment[3]|lower}}" class="commentUserName"
+          >{{comment[3]}} :</a
+        >
+      </section>
+      <p class="centeredHorizontally">{{comment[2]}}</p>
+      {% if session["userName"] == comment[3] %}
+      <form method="post">
+        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
+        <input type="hidden" name="commentID" value="{{comment[0]}}" />
+        <button type="submit" name="commentDeleteButton">🗑️</button>
+      </form>
+    </div>
     {% endif %} {% endfor %}
   </div>
   <form method="post" class="commentForm">