Use old post anchors. Highlight anchored post.

redesign/nimforum.scss

@@ -213,6 +213,19 @@ $views-color: #545d70;
   @extend .tile;
   border-top: 1px solid $border-color;
   padding-top: $control-padding-y-lg;
+
+  &:target .post-main {
+    animation: highlight 2000ms ease-out;
+  }
+}
+
+@keyframes highlight {
+  0% {
+    background-color: lighten($primary-color, 20%);
+  }
+  100% {
+    background-color: inherit;
+  }
 }
 
 .post-icon {

redesign/post.nim

@@ -1,4 +1,7 @@
+import strformat
+
 import threadlist
+import karaxutils
 
 type
   PostInfo* = object
@@ -15,4 +18,7 @@ type
                 ## post in a thread for example.
     history*: seq[PostInfo] ## If the post was edited this will contain the
                             ## older versions of the post.
-    info*: PostInfo
+    info*: PostInfo
+
+proc renderPostUrl*(post: Post, thread: Thread): string =
+  makeUri(fmt"/t/{thread.id}#{post.id}")

redesign/postlist.nim

@@ -56,9 +56,6 @@ when defined(js):
     else:
       state.list = some(list)
 
-  proc renderPostUrl(post: Post, thread: Thread): string =
-    makeUri(fmt"/t/{thread.id}/p/{post.id}")
-
   proc onReplyClick(e: Event, n: VNode, p: Option[Post]) =
     state.replyingTo = p
     state.replyBox.show()
@@ -66,7 +63,7 @@ when defined(js):
   proc genPost(post: Post, thread: Thread, isLoggedIn: bool): VNode =
     let postCopy = post # TODO: Another workaround here, closure capture :(
     result = buildHtml():
-      tdiv(class="post"):
+      tdiv(class="post", id = $post.id):
         tdiv(class="post-icon"):
           render(post.author, "post-avatar")
         tdiv(class="post-main"):

redesign/replybox.nim

@@ -47,6 +47,11 @@ when defined(js):
             else:
               text "Replying to "
               renderUserMention(post.get().author)
+              tdiv(class="post-buttons",
+                   style=style(StyleAttr.marginTop, "-0.3rem")):
+                a(href=renderPostUrl(post.get(), thread)):
+                  button(class="btn"):
+                    italic(class="fas fa-arrow-up")
           tdiv(class="information-content"):
             tdiv(class="panel"):
               tdiv(class="panel-nav"):