From b7d00d4e75ef45903a60e8032190c7500c5e272e Mon Sep 17 00:00:00 2001
From: Hollgy <karlgustav.ek@hotmail.com>
Date: Mon, 18 Mar 2024 18:34:11 +0100
Subject: [PATCH] Boilerplate logic for votes added in frontend, Header added
 for post creation

---
 client-solid/src/Components/NewPost.tsx     |  1 +
 client-solid/src/Components/PostSegment.tsx | 11 ++++++++---
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/client-solid/src/Components/NewPost.tsx b/client-solid/src/Components/NewPost.tsx
index 0726537..e6f999b 100644
--- a/client-solid/src/Components/NewPost.tsx
+++ b/client-solid/src/Components/NewPost.tsx
@@ -40,6 +40,7 @@ export function NewPostInputArea(): JSXElement {
       when={!waiting()}
       fallback={<span class="loading loading-spinner loading-lg self-center" />}
     >
+      <span>Create a new post</span>
       <div class="flex w-full flex-col space-y-2">
         <textarea
           class="textarea textarea-bordered h-32"
diff --git a/client-solid/src/Components/PostSegment.tsx b/client-solid/src/Components/PostSegment.tsx
index 200cb6c..903307e 100644
--- a/client-solid/src/Components/PostSegment.tsx
+++ b/client-solid/src/Components/PostSegment.tsx
@@ -6,7 +6,7 @@ import { Post } from "../Util/api";
 
 /**
  * PostSegment is used to display posts in both the main feed and the post view
- * 
+ *
  * @param {Object} props The properties for the PostSegment component.
  * @param {Post} props.post The post to display.
  * @returns {JSXElement} A JSXElement of a post
@@ -26,13 +26,18 @@ export function PostSegment({ post }: { post: Post }): JSXElement {
         </Show>
         <p class="break-words text-base-content md:pt-2">{post.content}</p>
         <div class="card-actions justify-between">
+          <div class="flex w-24 space-x-3 space-y-1.5">
           <button
             // onClick={(engagement)}
-            class="btn btn-xs hover:border-x-primary"
+            class="btn btn-xs hover:border-primary"
             aria-label="Show sign of engagement"
-          >
+            >
             <EngagementIcon />
           </button>
+            <span class="countdown text-1xl">
+              <span style={{ "--value": 46 }}>{post.votes}</span>
+            </span>
+            </div>
           <button
             onClick={(): void => nav("/post/" + post.id)}
             class="btn btn-xs"