mirror of
https://github.com/danielvici/tool-website.git
synced 2026-01-17 02:21:26 +00:00
add regenerate of qrcode while changing size, info (qr) is now hidden
This commit is contained in:
@@ -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>
|
||||
}
|
||||
|
||||
@@ -58,4 +58,10 @@ export class GeneratorQrcode {
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
}
|
||||
|
||||
async ngOnInit() {
|
||||
this.qrCodeDetailsForm.get('size')?.valueChanges.subscribe(() => {
|
||||
this.generateQR();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user