From d80b4beaafa75cdf464dec39cac8216109a0f1fd Mon Sep 17 00:00:00 2001
From: ekzyis <ekzyis@ekzyis.com>
Date: Wed, 8 Nov 2023 01:57:57 +0100
Subject: [PATCH] Align width of figure and figcaption

---
 vue/src/components/LoginQRCode.vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/vue/src/components/LoginQRCode.vue b/vue/src/components/LoginQRCode.vue
index 610941c..c1b9147 100644
--- a/vue/src/components/LoginQRCode.vue
+++ b/vue/src/components/LoginQRCode.vue
@@ -11,7 +11,7 @@
       <div>Authentication error</div>
       <small>{{ error  }}</small>
     </div>
-    <figure class="flex flex-col m-auto w-[33%]">
+    <figure class="flex flex-col m-auto">
       <a class="m-auto" v-if="lnurl" :href="'lightning:' + lnurl">
         <img v-if="qr" :src="'data:image/png;base64,' + qr" />
       </a>
@@ -84,6 +84,14 @@ await (async () => {
 </script>
 
 <style scoped>
+img {
+  width: 256px;
+  height: auto;
+}
+figcaption {
+  margin: 0.75em auto;
+  width: 256px;
+}
 .label {
   width: fit-content;
   margin: 1em auto;