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

make footer more compact on mobile

Browse source
This commit is contained in:
padreug 2025-02-11 00:32:47 +01:00
parent 4a81b39eef
commit c9c45f8d28
1 changed files with 6 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/components/layout/Footer.vue
View file

@ -7,17 +7,17 @@ const { t } = useI18n()
<template> <template>
<footer class="bg-card border-t border-border"> <footer class="bg-card border-t border-border">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8"> <div class="mx-auto max-w-7xl px-3 sm:px-6 lg:px-8">
<div class="flex flex-col md:flex-row justify-between items-center py-4 gap-4"> <div class="flex flex-col md:flex-row justify-between items-center py-2 sm:py-4 gap-2 sm:gap-4">
<!-- Powered by section --> <!-- Powered by section -->
<div class="flex items-center space-x-2 text-sm text-muted-foreground"> <div class="flex items-center gap-1.5 text-xs sm:text-sm text-muted-foreground">
<span>{{ t('footer.poweredBy') }}</span> <span>{{ t('footer.poweredBy') }}</span>
<img src="@/assets/bitcoin.svg" alt="Bitcoin" class="w-8 h-8" /> <img src="@/assets/bitcoin.svg" alt="Bitcoin" class="w-6 h-6 sm:w-8 sm:h-8" />
</div> </div>
<div class="flex items-center gap-4"> <div class="flex items-center gap-4">
<a href="https://lnbits.atitlan.io/tipjar/3" target="_blank" rel="noopener noreferrer" <a href="https://lnbits.atitlan.io/tipjar/3" target="_blank" rel="noopener noreferrer"
class="inline-flex items-center justify-center rounded-md bg-accent/10 px-4 py-2 text-sm font-medium text-accent border border-accent/20 hover:bg-accent/20 hover:border-accent/40 transition-colors"> class="inline-flex items-center justify-center rounded-md bg-accent/10 px-3 sm:px-4 py-1.5 sm:py-2 text-xs sm:text-sm font-medium text-accent border border-accent/20 hover:bg-accent/20 hover:border-accent/40 transition-colors">
<Rocket class="mr-2 h-4 w-4" /> <Rocket class="mr-1.5 sm:mr-2 h-3.5 w-3.5 sm:h-4 sm:w-4" />
{{ t('footer.donate') }} {{ t('footer.donate') }}
</a> </a>
</div> </div>