Boilerplate logic for votes added in frontend, Header added for post creation

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"

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"