✨ Better detail post

app/components/SidebarFooter.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="flex flex-col text-xs opacity-80 mx-3 mt-1">
+    <div class="flex flex-wrap gap-1.5">
+      <span class="font-bold">The Solar Network</span>
+      <span class="font-bold">·</span>
+      <span>FloatingIsland</span>
+    </div>
+    <div class="flex flex-wrap gap-1.5">
+      <a class="link" target="_blank" href="https://solsynth.dev/terms">
+        Terms of Services
+      </a>
+      <span class="font-bold">·</span>
+      <a class="link" target="_blank" href="https://status.solsynth.dev">
+        Service Status
+      </a>
+      <span class="font-bold">·</span>
+      <a
+        class="link"
+        target="_blank"
+        href="https://solian.app/swagger/index.html"
+      >
+        API
+      </a>
+    </div>
+    <p class="mt-2 opacity-80">
+      The FloatingIsland do not provides all the features the Solar Network has,
+      for further usage, see <a href="https://web.solian.app" class="font-bold underline">Solian</a>
+    </p>
+  </div>
+</template>
+
+<style scoped>
+.link:hover {
+  text-decoration: underline;
+}
+</style>