fix: login screen layout (#3538)

Co-authored-by: Vlad Stan <stan.v.vlad@gmail.com>

lnbits/templates/components.vue

@@ -19,7 +19,6 @@ include('components/lnbits-manage-extension-list.vue') %} {%
 include('components/lnbits-manage-wallet-list.vue') %} {%
 include('components/lnbits-language-dropdown.vue') %} {%
 include('components/lnbits-payment-list.vue') %} {%
-include('components/lnbits-wallet-ads.vue') %} {%
 include('components/lnbits-wallet-new.vue') %} {%
 include('components/lnbits-wallet-api-docs.vue') %} {%
 include('components/lnbits-wallet-share.vue') %}

lnbits/templates/components/lnbits-wallet-ads.vue

@@ -1,21 +0,0 @@
-<template id="lnbits-wallet-ads">
-  <q-card v-if="adSpaceEnabled">
-    <q-card-section>
-      <h6 v-text="adSpaceTitle" class="text-subtitle1 q-mt-none q-mb-sm"></h6>
-    </q-card-section>
-    <q-card-section class="q-pa-none" v-for="ad in ads">
-      <a
-        style="display: inline-block"
-        :href="ad[0]"
-        class="q-ml-md q-mb-xs q-mr-md"
-      >
-        <img
-          style="max-width: 100%; height: auto"
-          v-if="$q.dark.isActive"
-          :src="ad[1]"
-        />
-        <img v-else :src="ad[2]" style="max-width: 100%; height: auto" />
-      </a>
-    </q-card-section>
-  </q-card>
-</template>

lnbits/templates/pages/home.vue

@@ -1,11 +1,8 @@
 <template id="page-home">
-  <div
-    class="home row justify-center items-center"
-    style="min-height: calc(100vh / 1.618)"
-  >
+  <div class="home row justify-center items-center">
     <div
-      class="full-width"
-      :style="`max-width: ${hasCustomImage ? '850' : '600'}px`"
+      class="full-width content-center"
+      :style="`max-width: ${hasCustomImage ? '850' : '600'}px; min-height: 55vh;`"
     >
       <div class="row q-mb-md">
         <div class="col-12">
@@ -148,30 +145,14 @@
         ></q-btn>
       </div>
     </div>
-    <div v-if="adsEnabled" class="q-pt-md full-width">
-      <div class="row justify-center q-mb-xl">
-        <div class="full-width text-center">
-          <span v-text="adsTitle" class="text-uppercase text-grey"></span>
-        </div>
-        <div class="flex flex-center columm">
-          <div v-for="ad in ads" class="flex flex-center column q-pr-sm">
-            <a :href="ad[0]">
-              <img
-                v-if="$q.dark.isActive"
-                :src="ad[1]"
-                style="max-width: 420px"
-                class="full-width"
-              />
-              <img
-                v-else
-                :src="ad[2]"
-                style="max-width: 420px"
-                class="full-width"
-              />
-            </a>
-          </div>
-        </div>
-      </div>
+    <div
+      :class="$q.screen.lt.md ? 'column col-10' : 'col-10'"
+      class="flex justify-center q-col-gutter-sm q-mb-lg"
+    >
+      <a :href="ad[0]" class="col lnbits-ad" v-for="ad in g.ads">
+        <img class="full-width" v-if="$q.dark.isActive" :src="ad[1]" />
+        <img class="full-width" v-else :src="ad[2]" />
+      </a>
     </div>
     <lnbits-home-logos />
   </div>