Minor style changes

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

@@ -8,12 +8,12 @@ export default function EngagementButton({ post }: { post: Post }): JSXElement {
     <>
       <div class="flex p-1">
         <button
-          class="btn btn-xs hover:border-primary"
+          class="btn btn-xs hover:border-primary rounded-base"
           aria-label="Show sign of engagement"
         >
           <EngagementIcon />
         </button>
-        <span class="text-1xl countdown text-center pt-1.5">
+        <span class="text-1xl countdown text-center pt-1.5 px-1.5">
           <p style={{ "--value": 46 }}>{post.votes}</p>
         </span>
       </div>

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

@@ -8,12 +8,12 @@ export default function ReplyButton({ post }: { post: Post }): JSXElement {
     <>
       <div class="flex p-1">
         <button
-          class="btn btn-xs hover:border-primary"
+          class="btn btn-xs hover:border-primary rounded-base"
           aria-label="Show sign of engagement"
         >
           <ReplyIcon />
         </button>
-        <span class="text-1xl countdown text-center pt-1.5">
+        <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/Report.tsx

@@ -9,7 +9,7 @@ export default function ReportButton(): JSXElement {
     <Show when={login_ctx.loggedIn()}>
       <div class="flex p-1">
         <button
-          class="btn btn-xs hover:border-primary"
+          class="rounded-base btn btn-xs hover:border-primary"
           aria-label="Report post or comment"
         >
           <ReportIcon />

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

@@ -14,7 +14,7 @@ export default function ToPostButton({ post }: { post: Post }): JSXElement {
     <div class="p-1">
       <button
         onClick={(): void => nav("/post/" + post.id)}
-        class="btn btn-xs"
+          class="btn btn-xs hover:border-primary"
         aria-label="View post"
       >
         <Arrow />

client-solid/src/Components/PostSegment.tsx

@@ -21,13 +21,13 @@ export function PostSegment({ post }: { post: Post }): JSXElement {
     <div class="card compact w-full flex-grow border-b-2 border-b-primary bg-base-200 text-base-content transition-all hover:bg-base-300">
       <div class="card-body md:mx-6">
         <div class="flex flex-row justify-between">
-        <h3>{dateOfCreation}</h3>
+        <p class="text-xs">{dateOfCreation}</p>
         <ReportButton />
         </div>
         <Show when={isEdited}>
           <p>This post has been edited</p>
         </Show>
-        <p class="break-words text-base-content md:pt-2">{post.content}</p>
+        <p class="text-base my-5">{post.content}</p>
         <div class="card-actions justify-between">
           <div class="flex">
             <EngagementButton post={post} />