Add unlighthouse

app/pages/uses.vue

@@ -20,28 +20,20 @@ const ide = items.value!.filter(item => item.category === 'ide')
       title="Uses"
     />
     <div class="mt-12 space-y-24">
-      <ul class="space-y-8">
-        <UDivider
-          label="Hardware"
-          size="xs"
-        />
+      <UsesList title="Hardware">
         <UsesItem
           v-for="(item, id) in hardware"
           :key="id"
           :item="item"
         />
-      </ul>
-      <ul class="space-y-8">
-        <UDivider
-          label="Software"
-          size="xs"
-        />
+      </UsesList>
+      <UsesList title="Software">
         <UsesItem
           v-for="(item, id) in software"
           :key="id"
           :item="item"
         />
-      </ul>
+      </UsesList>
       <ul class="space-y-8">
         <UDivider
           label="IDE & Font"

app/pages/writings/[slug].vue

@@ -98,16 +98,16 @@ async function handleLike() {
       />
       <div class="space-y-8">
         <p>
-          Thanks for reading this post! If you liked it, please consider sharing it with your friends. <strong>Don't
-            forget to leave a like!</strong>
+          Thanks for reading this post! If you liked it, please consider sharing it with your friends.
+          <strong>Don't forget to leave a like!</strong>
         </p>
         <div class="flex gap-4 items-center flex-wrap">
           <UButton
             :label="postDB?.likes > 1 ? `${postDB?.likes} likes` : `${postDB?.likes} like`"
-            color="red"
+            color="white"
             icon="i-ph-heart-duotone"
             size="lg"
-            variant="outline"
+            variant="solid"
             @click.prevent="handleLike()"
           />
           <UButton