Refactor of replies,Icon Swap

client-solid/src/Components/Buttons/CommentsButton.tsx

@@ -0,0 +1,17 @@
+import { JSXElement } from "solid-js";
+
+import { CommentsIcon } from "../../Util/Icons";
+import { Post } from "../../Util/api";
+
+export default function CommentsBUtton({ post }: { post: Post }): JSXElement {
+  return (
+    <>
+      <div class="flex p-1">
+          <CommentsIcon />
+        <span class="text-1xl countdown text-center pt-1.5 px-1.5">
+          <p style={{ "--value": 11 }}>{post.comments}</p>
+        </span>
+      </div>
+    </>
+  );
+}

client-solid/src/Components/Buttons/Reply.tsx

@@ -0,0 +1,20 @@
+import { JSXElement, Show, useContext } from "solid-js";
+
+import { LoginContext } from "../../Context/GlobalState";
+import { ReplyIcon, ReportIcon } from "../../Util/Icons";
+
+export default function ReplyButton(): JSXElement {
+  const login_ctx = useContext(LoginContext)!;
+  return (
+    <Show when={login_ctx.loggedIn()}>
+      <div class="flex p-1">
+        <button
+          class="rounded-base btn btn-xs hover:border-primary"
+          aria-label="Report post or comment"
+        >
+          <ReplyIcon />
+        </button>
+      </div>
+    </Show>
+  );
+}