Feat: サーバー初期設定ウィザード (#15954)

* wip

* wip

* Update welcome.setup.vue

* wip

* wip

* wip

* wip

* Update MkServerSetupWizard.vue

* Update MkServerSetupWizard.vue

* wip

* wip

* wip

* Update types.ts

* wip

* wip

* Update CHANGELOG.md

packages/frontend/src/components/MkRadios.vue

@@ -5,14 +5,18 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts">
 import { defineComponent, h, ref, watch } from 'vue';
-import type { VNode } from 'vue';
 import MkRadio from './MkRadio.vue';
+import type { VNode } from 'vue';
 
 export default defineComponent({
 	props: {
 		modelValue: {
 			required: false,
 		},
+		vertical: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	setup(props, context) {
 		const value = ref(props.modelValue);
@@ -34,7 +38,10 @@ export default defineComponent({
 		options = options.filter(vnode => !(typeof vnode.type === 'symbol' && vnode.type.description === 'v-cmt' && vnode.children === 'v-if'));
 
 		return () => h('div', {
-			class: 'novjtcto',
+			class: [
+				'novjtcto',
+				...(props.vertical ? ['vertical'] : []),
+			],
 		}, [
 			...(label ? [h('div', {
 				class: 'label',
@@ -71,7 +78,7 @@ export default defineComponent({
 
 	> .body {
 		display: flex;
-    gap: 12px;
+    gap: 10px;
     flex-wrap: wrap;
 	}
 
@@ -84,5 +91,11 @@ export default defineComponent({
 			display: none;
 		}
 	}
+
+	&.vertical {
+		> .body {
+			flex-direction: column;
+		}
+	}
 }
 </style>