. (#2925)

lnbits/core/templates/core/first_install.html

@@ -1,5 +1,8 @@
 {% extends "public.html" %} {% block page_container %}
-<div class="row q-col-gutter-md justify-center main">
+<q-page-container>
+  <q-page class="q-px-md q-py-lg" :class="{'q-px-lg': $q.screen.gt.xs}">
+    {% block page %}
+    <div class="row q-col-gutter-md justify-center main">
       <div class="col-10 col-md-8 col-lg-6 q-gutter-y-md">
         <q-card>
           <q-card-section class="grid">
@@ -58,9 +61,9 @@
           </q-card-section>
         </q-card>
       </div>
-</div>
+    </div>
-{% endblock %} {% block scripts %}
+    {% endblock %} {% block scripts %}
-<style>
+    <style>
       main {
         display: flex;
         flex-direction: column;
@@ -95,8 +98,8 @@
           padding: 1rem;
         }
       }
-</style>
+    </style>
-<script>
+    <script>
       window.app = Vue.createApp({
         el: '#vue',
         mixins: [window.windowMixin],
@@ -122,11 +125,16 @@
         methods: {
           async setPassword() {
             try {
-          await LNbits.api.request('PUT', '/api/v1/auth/first_install', null, {
+              await LNbits.api.request(
+                'PUT',
+                '/api/v1/auth/first_install',
+                null,
+                {
                   username: this.loginData.username,
                   password: this.loginData.password,
                   password_repeat: this.loginData.passwordRepeat
-          })
+                }
+              )
 
               window.location.href = '/admin'
             } catch (e) {
@@ -135,5 +143,8 @@
           }
         }
       })
-</script>
+    </script>
+    {% endblock %}
+  </q-page>
+</q-page-container>
 {% endblock %}