public/wallabicher
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: add favicon and manifest for PWA support, include logo and related icons

Browse Source
This commit is contained in:
Omar Sánchez Pizarro
2026-01-19 23:18:20 +01:00
parent 08a9a277f5
commit ed4062b350
12 changed files with 63 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
web/frontend/src/App.vue
View File

@@ -85,40 +85,40 @@
</main>
<!-- Toast notifications container -->
<div class="fixed bottom-4 right-4 z-50 space-y-2">
<div class="fixed top-4 right-4 z-50 space-y-2">
<div
v-for="toast in toasts"
:key="toast.id"
class="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-lg p-4 max-w-md min-w-[320px] animate-slide-in"
class="bg-white/90 dark:bg-gray-800/90 backdrop-blur-sm border border-gray-200/50 dark:border-gray-700/50 rounded-lg shadow-md p-2 max-w-xs min-w-[200px] animate-slide-in"
>
<div class="flex items-start gap-3">
<div class="flex items-start gap-2">
<div class="flex-shrink-0">
<img
v-if="toast.image"
:src="toast.image"
v-if="toast.images"
:src="toast.images[0]"
:alt="toast.title"
class="w-16 h-16 object-cover rounded"
class="w-10 h-10 object-cover rounded"
@error="($event) => $event.target.style.display = 'none'"
/>
<div v-else class="w-16 h-16 bg-gray-200 dark:bg-gray-700 rounded flex items-center justify-center">
<div v-else class="w-10 h-10 bg-gray-200 dark:bg-gray-700 rounded flex items-center justify-center">
<span class="text-gray-400 text-xs">📦</span>
</div>
</div>
<div class="flex-1 min-w-0">
<div class="flex items-start justify-between gap-2">
<div class="flex-1">
<div class="flex items-center gap-2 mb-1">
<div class="flex items-start justify-between gap-1">
<div class="flex-1 min-w-0">
<div class="flex items-center gap-1 mb-0.5">
<span
class="px-2 py-0.5 text-xs font-semibold rounded"
class="px-1.5 py-0.5 text-[10px] font-semibold rounded"
:class="toast.platform === 'wallapop' ? 'bg-blue-100 dark:bg-blue-900 text-blue-800 dark:text-blue-200' : 'bg-green-100 dark:bg-green-900 text-green-800 dark:text-green-200'"
>
{{ toast.platform?.toUpperCase() }}
</span>
</div>
<h4 class="font-semibold text-gray-900 dark:text-gray-100 text-sm mb-1 line-clamp-2">
<h4 class="font-medium text-gray-900 dark:text-gray-100 text-xs mb-0.5 line-clamp-1 leading-tight">
{{ toast.title || 'Nuevo artículo' }}
</h4>
<p v-if="toast.price" class="text-lg font-bold text-primary-600 dark:text-primary-400 mb-2">
<p v-if="toast.price" class="text-sm font-bold text-primary-600 dark:text-primary-400 mb-1">
{{ toast.price }} {{ toast.currency || '€' }}
</p>
<a
@@ -126,14 +126,15 @@
:href="toast.url"
target="_blank"
rel="noopener noreferrer"
class="text-xs text-primary-600 dark:text-primary-400 hover:underline inline-flex items-center gap-1"
class="text-[10px] text-primary-600 dark:text-primary-400 hover:underline inline-flex items-center gap-0.5"
>
Ver artículo →
Ver →
</a>
</div>
<button
@click="removeToast(toast.id)"
class="flex-shrink-0 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300"
class="flex-shrink-0 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 text-xs leading-none p-0.5"
title="Cerrar"
>
✕
</button>
@@ -183,10 +184,10 @@ function addToast(article) {
...article,
});
// Auto-remover después de 8 segundos
// Auto-remover después de 5 segundos (más corto para toasts discretos)
setTimeout(() => {
removeToast(id);
}, 8000);
}, 5000);
}
function removeToast(id) {

2
web/frontend/src/style.css
View File

@@ -54,6 +54,6 @@
}
.animate-slide-in {
animation: slide-in 0.3s ease-out;
animation: slide-in 0.25s ease-out;
}