make QR img bigger, adjust css

This commit is contained in:
Tiago Vasconcelos 2023-10-10 15:04:46 +01:00 committed by Pavol Rusnak
parent ebaad7fe49
commit 371dacf8b2
2 changed files with 10 additions and 6 deletions

View file

@ -368,7 +368,7 @@ Vue.component('lnbits-qrcode', {
template: `
<div class="qrcode__wrapper">
<qrcode :value="value"
:options="{errorCorrectionLevel: 'Q'}" class="rounded-borders"></qrcode>
:options="{errorCorrectionLevel: 'Q', width: 800}" class="rounded-borders"></qrcode>
<img class="qrcode__image" :src="logo" alt="..." />
</div>
`

View file

@ -214,20 +214,24 @@ video {
}
}
.qrcode__wrapper > canvas {
// qrcode
.qrcode__wrapper canvas {
position: relative;
min-width: 100%;
min-height: 100%;
width: 100% !important; // important to override qrcode inline width
max-width: 100%;
max-height: 100%;
}
.qrcode__image {
width: 15%;
height: 15%;
overflow: hidden;
background: #fff;
left: 50%;
overflow: hidden;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
padding: 0.3rem;
padding: 0.2rem;
border-radius: 0.2rem;
}