Merge branch 'main' of https://github.com/Akif9748/akf-forum

public/css/login.css

@@ -7,8 +7,10 @@ form {
   display: flex;
   align-items: center;
   flex-direction: column;
-  max-width: 1000px;
+  max-width: 500px;
   margin: 0 auto;
+  width:100%;
+  padding:8px;
 }
 
 
@@ -18,7 +20,7 @@ form {
   display: block;
   font-weight: 600;
   color: #4c4c4c;
-  width: 500px;
+  width: 100%;
   margin-bottom: 10px;
   border: 2px solid #d9d9d9;
 }

public/css/navbar.css

@@ -125,7 +125,7 @@ div.avatar {
 
 .box-username {
     display: flex;
-    align-items: center;
+    justify-content: center;
     font-size: 18px;
     font-weight: 700;
     color: #4d18e6;

public/css/thread.css

@@ -138,3 +138,65 @@
   margin: 8px;
   cursor: pointer;
 }
+.dots-menu a:hover:nth-child(1){
+color:#e70000}
+.dots-menu a:hover:nth-child(2){
+color:#4d18e6}
+
+
+/* Media Query  */
+
+@media(max-width:980px){
+  .message{
+     margin: 10px 20px;
+  max-width: 100%;
+    flex-direction:column;
+    position:relative;
+  }
+  .message .left{
+      padding: 40px;
+border:none;
+    border-bottom: 2px solid #d9d9d9;
+
+  }
+  .message .left img{
+      width: 50px;
+      height: 50px;
+      border-radius: 50%;
+      margin-right: 5px;
+      position: absolute;
+      left: 20px;
+      top: 20px;
+  }
+  .message .left .username{
+    position: absolute;
+    top: 20px;
+    left: 80px;
+  }
+  .message .date:nth-of-type(3){
+    position: absolute;
+right: 20px;
+top: 20px;
+  }
+   .message .date:nth-of-type(2){
+    position: absolute;
+right: 20px;
+top: 40px;
+  }
+
+  .dots{
+   position: absolute;
+right: auto;
+top: 70px;
+left: 40px;
+  }
+  .dots-menu{
+position: absolute;
+left: 70px;
+top: 60px;
+width: 120px;
+  }
+  .dots-menu.active{
+    display:flex;
+  }
+}

views/thread.ejs

@@ -94,8 +94,12 @@
   <% if (user){ %>
 
   <div class="message">
-    <form id="send">
-      <textarea rows="4" cols="100" name="content"></textarea>
+    <form id="send" style="width:100%">
+      <textarea rows="4"  
+        style="
+  width: 100%;
+  margin: 10px;
+  border: 2px solid #e3e3e3;"  name="content"></textarea>
       <input name="threadID" type="hidden" value="<%= thread.id %>"></input>
       <input name="page" type="hidden" value="<%= page %>"></input>