From 2fa3a8b5f3259104b47ca71cbcecf9c0b96ace6a Mon Sep 17 00:00:00 2001
From: danielvici123 <danielvici123@proton.me>
Date: Wed, 19 Nov 2025 20:38:17 +0100
Subject: [PATCH] add regenerate of qrcode while changing size, info (qr) is
 now hidden

---
 src/app/sites/generator/qrcode/generator-qrcode.html | 9 +++++----
 src/app/sites/generator/qrcode/generator-qrcode.ts   | 6 ++++++
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/app/sites/generator/qrcode/generator-qrcode.html b/src/app/sites/generator/qrcode/generator-qrcode.html
index 7a409bf..d6a59a1 100644
--- a/src/app/sites/generator/qrcode/generator-qrcode.html
+++ b/src/app/sites/generator/qrcode/generator-qrcode.html
@@ -1,4 +1,4 @@
-<div class="p-8 text-white">
+<div class="px-8 text-white">
     <div class="mx-auto">
         <div class="mb-8">
             <app-custom-title
@@ -49,12 +49,13 @@
                 </button>
             </div>
 
-            <div class="flex justify-center mt-6 flex-col items-center space-y-4">
+            <div class="flex mt-6 flex-col items-center space-y-4">
                 <canvas #canvas class="hidden" #ziel></canvas>
                 @if (qrDataUrl) {
-                    <img [src]="qrDataUrl" alt="Generated QR Code" class="mx-auto border-4 border-white rounded-lg max-w-[500px] max-h-[500px]" />
+                    <p class="self-start block text-sm font-medium text-gray-300 mb-2">Generated QR Code:</p>
+                    <img [src]="qrDataUrl" alt="Generated QR Code" class="self-center mx-auto border-4 border-white rounded-lg max-w-[600px] max-h-[600px]" />
                     <button (click)="downloadQR()"
-                        class="w-full bg-green-500 text-white py-2 px-4 rounded-md hover:bg-green-600 transition-colors">
+                        class="w-full bg-green-500 text-white mt-4 py-2 px-4 rounded-md hover:bg-green-600 transition-colors">
                         Download QR Code
                     </button>
                 }
diff --git a/src/app/sites/generator/qrcode/generator-qrcode.ts b/src/app/sites/generator/qrcode/generator-qrcode.ts
index bd976d2..eac4ac9 100644
--- a/src/app/sites/generator/qrcode/generator-qrcode.ts
+++ b/src/app/sites/generator/qrcode/generator-qrcode.ts
@@ -58,4 +58,10 @@ export class GeneratorQrcode {
     link.click();
     document.body.removeChild(link);
   }
+
+  async ngOnInit() {
+    this.qrCodeDetailsForm.get('size')?.valueChanges.subscribe(() => {
+    this.generateQR();
+  });
+}
 }