Feat: Initial Setup through env vars (#1736)

* initial support for initial setup

* improve setup

* improve mobile view

* move base admin route

* admin panel mobile view

* set initial host and port

* add docs

* properly setup everything, use for dev env

* change userconfig and interface port on setup, note users afterwards

src/app/layouts/default.vue

@@ -1,23 +1,23 @@
 <template>
   <div>
-    <header class="container mx-auto mt-4 max-w-3xl px-3 xs:mt-6 md:px-0">
+    <header class="mx-auto mt-4 flex max-w-3xl flex-col justify-center">
       <div
-        class="mb-5"
+        class="mb-5 w-full"
         :class="
           loggedIn
-            ? 'flex flex-auto flex-col-reverse items-center gap-3 xxs:flex-row'
+            ? 'flex flex-col items-center justify-between sm:flex-row'
             : 'flex justify-end'
         "
       >
         <HeaderLogo v-if="loggedIn" />
-        <div class="flex grow-0 items-center gap-3 self-end xxs:self-center">
+        <div class="flex flex-row gap-3">
           <HeaderLangSelector />
           <HeaderThemeSwitch />
           <HeaderChartToggle v-if="loggedIn" />
           <UiUserMenu v-if="loggedIn" />
         </div>
       </div>
-      <HeaderUpdate class="mt-5" />
+      <HeaderUpdate class="mt-4" />
     </header>
     <slot />
     <UiFooter />

src/app/layouts/setup.vue

@@ -11,8 +11,8 @@
     </header>
     <main>
       <Panel>
-        <PanelBody class="mx-auto mt-10 p-4 md:w-[70%] lg:w-[60%]">
-          <h2 class="mb-16 mt-8 text-3xl font-medium">
+        <PanelBody class="m-4 mx-auto mt-10 md:w-[70%] lg:w-[60%]">
+          <h2 class="mb-16 mt-8 text-center text-3xl font-medium">
             {{ $t('setup.welcome') }}
           </h2>