Автоматизация создания установщика для Arch, доработка API

src/api_components/AccordionElement.vue

@@ -0,0 +1,12 @@
+<template>
+    <details class="group pt-1 text-md border-gray-400 open:border open:px-1 open:py-1">
+        <summary class="flex cursor-pointer flex-row items-center justify-between py-1 font-semibold text-gray-800 marker:[font-size:0px]">
+            <p class="mx-1 dark:text-gray-100 inline-flex items-center"><slot name="title"/></p>
+            <svg class="h-6 w-6 rotate-0 transform text-gray-400 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7"></path>
+            </svg>
+        </summary>
+        <p class="mx-2 text-gray-700 dark:text-gray-200"><slot name="body"/></p>
+    </details>
+    <hr class="border-gray-400">
+</template>

src/api_components/notes/Code.vue

@@ -0,0 +1,13 @@
+<script setup>
+import {Icon} from "@iconify/vue";
+</script>
+
+<template>
+    <div class="border-zinc-400 dark:border-zinc-200 border bg-zinc-300 dark:bg-zinc-700 rounded-2xl p-2 mx-1 my-2 dark:text-gray-100">
+        <div class="flex">
+            <Icon icon="material-symbols:code" width="26" height="26"/>
+            <p class="text-md ml-1 mt-0.5"><slot name="title"/></p>
+        </div>
+        <p class="text-lg m-1 dark:text-gray-100 whitespace-pre-wrap"><slot name="body"/></p>
+    </div>
+</template>

src/api_components/notes/Warning.vue

@@ -0,0 +1,13 @@
+<script setup>
+import {Icon} from "@iconify/vue";
+</script>
+
+<template>
+    <div class="border-yellow-500 dark:border-yellow-600 border bg-yellow-50 dark:bg-gray-700 rounded-2xl p-2 m-2 text-yellow-600 dark:text-yellow-300">
+        <div class="flex">
+            <Icon icon="ic:round-warning" width="32" height="32"/>
+            <p class="text-xl ml-1 mt-0.5"><slot name="title"/></p>
+        </div>
+        <p class="text-lg m-1"><slot name="body"/></p>
+    </div>
+</template>