some more ui stuff

public/index.css

@@ -35,8 +35,8 @@ body {
 
 .header-big {
     width: 800px;
-    margin: -10px;
-    padding: 10px;
+    margin: -5px;
+    padding: 5px;
     background: var(--main-5);
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
@@ -114,7 +114,7 @@ body {
 .nav,
 .main {
     border: solid var(--main-1) 5px;
-    padding: 10px;
+    padding: 5px;
     width: 800px;
     max-width: calc(100vw - 40px);
 }
@@ -183,3 +183,11 @@ form .header-big,
     color: var(--main-1);
     margin: .5rem;
 }
+
+.sub {
+    font-size: 0.8em;
+}
+
+h1 {
+    font-size: 1.4em;
+}

routes/comment.js

@@ -35,8 +35,6 @@ router.get('/:id', async (req, res, next) => {
 
     replies = replies.filter(x => x.comment != 'fail');
 
-    console.log(replies)
-
     res.ctx.mainPage = 'commenter'
     res.ctx.mainCtx = {
         replies

routes/walls.js

@@ -37,6 +37,11 @@ router.get('/get/:type/:id/:num', async (req, res, next) => {
         req.params.num * 10
     ]);
 
+    replies.splice(0, 0, {
+        childType: 'comment',
+        childId: req.params.id
+    })
+
     for (let reply of replies) {
         let dat = await db.all('SELECT * FROM comment WHERE id = ?', [
             reply.childId
@@ -50,6 +55,7 @@ router.get('/get/:type/:id/:num', async (req, res, next) => {
         reply.comment.id = reply.childId;
     }
 
+    let comment = replies.splice(0, 1)[0];
     replies = replies.filter(x => x.comment != 'fail');
 
     res.ctx.mainPage = 'replies'
@@ -59,7 +65,9 @@ router.get('/get/:type/:id/:num', async (req, res, next) => {
 
         opLink: `/${req.params.type}/${req.params.id}`,
         type: req.params.type,
-        id: req.params.id
+        id: req.params.id,
+
+        comment
     }
     next();
 })

views/comment.ejs

@@ -1,8 +1,7 @@
 <div class='main'>
-    <div class="header-big">
-        <div><%= username %> </div>
-        <div><%= new Date(date).toISOString() %> </div>
-    </div>
+    <h1 class="header-big"><%= username %></h1>
     <div><%= content %></div>
+    <div class='sub'><b>Posted on</b> <%= new Date(date).toISOString() %> </div>
+    <%- include ('vblock.ejs', {link: `/${type}/${id}`, icon: '/icon.svg', name: 'Original'}) %>
     <%- include ('vblock.ejs', {link: `/walls/get/${type}/${id}/0`, icon: '/icon.svg', name: 'Replies'}) %>
 </div>

views/replies.ejs

@@ -1,3 +1,13 @@
+<% if (comment.comment != 'fail') { %>
+<%-  include ('comment.ejs', comment.comment || {}) %>
+<% } %>
+
+<div class='main'>
+    <h1 class="header-big">Replies</h1>
+    <%- include ('vblock.ejs', {link: `${page - 1}`, icon: '/icon.svg', name: 'Previous'}) %>
+    <%- include ('vblock.ejs', {link: `${page * 1 + 1}`, icon: '/icon.svg', name: 'Next'}) %>
+</div>
+<% if (page == 0) { %>
 <%- include('form.ejs', {
         title: "Reply",
         message: 'Send your thoughts to the world.',
@@ -28,13 +38,8 @@
                 "default": id
             },
         ]
-}) %>
-<div class='main'>
-    <h1 class="header-big">Replies</h1>
-    <%- include ('vblock.ejs', {link: opLink, icon: '/icon.svg', name: 'Original'}) %>
-    <%- include ('vblock.ejs', {link: `${page - 1}`, icon: '/icon.svg', name: 'Previous'}) %>
-    <%- include ('vblock.ejs', {link: `${page * 1 + 1}`, icon: '/icon.svg', name: 'Next'}) %>
-</div>
+    }) %>
+<% } %>
 <% for (let reply of replies) { %>
 <%- include ('comment.ejs', reply.comment || {}) %>
 <% } %>