✨ Embed widgets

components/Copyright.vue

@@ -1,17 +1,34 @@
 <template>
   <div class="text-xs text-grey" :class="props.noCentered ? 'text-left' : 'text-center'">
     <p>{{ t("copyright") }} © {{ new Date().getFullYear() }} {{ t("brandNameFormal") }}</p>
-    <p>Powered by <a class="underline" :href="projects[props.service][1]">{{ projects[props.service][0] }}</a></p>
+    <p v-if="services" class="flex justify-center">
+      <span>Powered by</span>
+      <span class="flex services-list ms-1">
+        <a class="service underline" v-for="item in services" :href="projects[item][1]">
+          {{ projects[item][0] }}
+        </a>
+      </span>
+    </p>
   </div>
 </template>
 
 <script setup lang="ts">
-const props = defineProps<{ service: string, noCentered?: boolean }>()
+const props = defineProps<{ service?: string | string[], noCentered?: boolean }>()
+
+const services = computed<string[]>(() => props.service instanceof Array ? (props.service ?? []) : (props.service ? [props.service] : []))
 
 const { t } = useI18n()
 
 const projects: { [id: string]: [string, string] } = {
+  "solar-network": ["Solar Network", "https://solsynth.dev/products/solar-network"],
+  "capital": ["Capital", "https://git.solsynth.dev/Goatworks/Capital"],
   "passport": ["Hydrogen.Passport", "https://git.solsynth.dev/Hydrogen/Passport"],
   "paperclip": ["Hydrogen.Paperclip", "https://git.solsynth.dev/Hydrogen/Paperclip"],
 }
 </script>
+
+<style scoped>
+.services-list .service:nth-child(n+2)::before {
+  content: ", ";
+}
+</style>