padreug/web-app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update QR code dimensions in WalletPage.vue for improved display

Browse source 
- Increased the size of the QR code display elements to enhance visibility and user interaction.
- Adjusted the layout to maintain consistency across different screen sizes, ensuring a better user experience.

These changes contribute to a more visually appealing and functional wallet interface.
This commit is contained in:
padreug 2025-09-18 23:55:04 +02:00
parent 82a5e40e8e
commit 91c76e80e7
1 changed files with 3 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/modules/wallet/views/WalletPage.vue
View file

@ -261,7 +261,7 @@ onMounted(async () => {
<div class="flex flex-col sm:flex-row items-center gap-4 sm:gap-6">
<!-- QR Code -->
<div class="flex-shrink-0">
<div v-if="isGeneratingQR" class="w-36 h-36 sm:w-48 sm:h-48 flex items-center justify-center bg-muted rounded-lg">
<div v-if="isGeneratingQR" class="w-48 h-48 sm:w-56 sm:h-56 flex items-center justify-center bg-muted rounded-lg">
<RefreshCw class="h-6 w-6 sm:h-8 sm:w-8 animate-spin text-muted-foreground" />
</div>
<div v-else-if="defaultQrCode" class="text-center">
@ -269,14 +269,11 @@ onMounted(async () => {
<img
:src="defaultQrCode"
alt="LNURL QR Code"
class="w-36 h-36 sm:w-48 sm:h-48"
class="w-48 h-48 sm:w-56 sm:h-56"
/>
</div>
<p class="text-xs text-muted-foreground mt-1 sm:mt-2">
Click QR code to copy LNURL
</p>
</div>
<div v-else class="w-36 h-36 sm:w-48 sm:h-48 flex items-center justify-center bg-muted rounded-lg">
<div v-else class="w-48 h-48 sm:w-56 sm:h-56 flex items-center justify-center bg-muted rounded-lg">
<QrCode class="h-8 w-8 sm:h-12 sm:w-12 text-muted-foreground opacity-50" />
</div>
</div>