comment content and post content overflow fixed

DogukanUrker · Dec 28, 2023 · 2c79769 · 2c79769
1 parent fc2a05d
commit 2c79769
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 14 deletions.
diff --git 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
@@ -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
@@ -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">