web-player: P0 — línea base y bugs sueltos
Corrige eslint (imports muertos en liked), tamaño de título ausente en MediaCard, clases no excluyentes en las filas del spotlight de Inicio, tipografía del modal de borrado de álbumes, text-base inútil en botones de icono (Sidebar, Queue) y borra Badge.svelte (sin usos).
This commit is contained in:
@@ -772,7 +772,7 @@ Tareas:
|
|||||||
|
|
||||||
| Parte | Estado | Commit | Notas / decisiones tomadas |
|
| Parte | Estado | Commit | Notas / decisiones tomadas |
|
||||||
| ----- | ------ | ------ | -------------------------- |
|
| ----- | ------ | ------ | -------------------------- |
|
||||||
| P0 | ⬜ | | |
|
| P0 | ✅ | (pendiente) | Button primary/secondary se mantienen iguales (decisión del usuario) |
|
||||||
| P1 | ⬜ | | |
|
| P1 | ⬜ | | |
|
||||||
| P2 | ⬜ | | |
|
| P2 | ⬜ | | |
|
||||||
| P3 | ⬜ | | |
|
| P3 | ⬜ | | |
|
||||||
|
|||||||
@@ -81,7 +81,7 @@
|
|||||||
type="button"
|
type="button"
|
||||||
onclick={() => createPlaylistModal.show()}
|
onclick={() => createPlaylistModal.show()}
|
||||||
aria-label="Crear playlist"
|
aria-label="Crear playlist"
|
||||||
class="text-base text-muted transition-colors hover:text-fg"
|
class="text-muted transition-colors hover:text-fg"
|
||||||
>
|
>
|
||||||
<Plus class="h-3.5 w-3.5" strokeWidth={1.25} />
|
<Plus class="h-3.5 w-3.5" strokeWidth={1.25} />
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@@ -26,7 +26,7 @@
|
|||||||
type="button"
|
type="button"
|
||||||
onclick={() => queuePanel.close()}
|
onclick={() => queuePanel.close()}
|
||||||
aria-label="Cerrar cola"
|
aria-label="Cerrar cola"
|
||||||
class="text-base text-fg-3 transition-colors hover:text-fg"
|
class="text-fg-3 transition-colors hover:text-fg"
|
||||||
>
|
>
|
||||||
<X class="h-4 w-4" />
|
<X class="h-4 w-4" />
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@@ -1,23 +0,0 @@
|
|||||||
<script lang="ts">
|
|
||||||
import type { Snippet } from 'svelte';
|
|
||||||
|
|
||||||
interface Props {
|
|
||||||
tone?: 'neutral' | 'accent' | 'danger';
|
|
||||||
class?: string;
|
|
||||||
children: Snippet;
|
|
||||||
}
|
|
||||||
|
|
||||||
let { tone = 'neutral', class: klass = '', children }: Props = $props();
|
|
||||||
|
|
||||||
const tones = {
|
|
||||||
neutral: 'bg-surface-2 text-fg',
|
|
||||||
accent: 'bg-accent/20 text-accent',
|
|
||||||
danger: 'bg-danger/10 text-danger-fg'
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<span
|
|
||||||
class="shrink-0 rounded-full px-2 py-0.5 text-sm leading-none font-semibold {tones[tone]} {klass}"
|
|
||||||
>
|
|
||||||
{@render children()}
|
|
||||||
</span>
|
|
||||||
@@ -25,7 +25,7 @@
|
|||||||
{oncontextmenu}
|
{oncontextmenu}
|
||||||
>
|
>
|
||||||
{@render art(mediaCardArt)}
|
{@render art(mediaCardArt)}
|
||||||
<div class="mt-2.5 truncate text-fg">{title}</div>
|
<div class="mt-2.5 truncate text-sm text-fg">{title}</div>
|
||||||
{#if subtitle}
|
{#if subtitle}
|
||||||
<div class="mt-0.5 truncate text-xs text-fg-3">{subtitle}</div>
|
<div class="mt-0.5 truncate text-xs text-fg-3">{subtitle}</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|||||||
@@ -79,7 +79,7 @@
|
|||||||
<h2 class="text-lg font-semibold tracking-tight text-fg">
|
<h2 class="text-lg font-semibold tracking-tight text-fg">
|
||||||
¿Eliminar «{album.title}»?
|
¿Eliminar «{album.title}»?
|
||||||
</h2>
|
</h2>
|
||||||
<p class="mt-2 text-base text-fg-3">
|
<p class="mt-2.5 text-sm leading-[1.65] text-fg-2">
|
||||||
Esta acción no se puede deshacer. Las canciones que contiene seguirán en tu biblioteca.
|
Esta acción no se puede deshacer. Las canciones que contiene seguirán en tu biblioteca.
|
||||||
</p>
|
</p>
|
||||||
<div class="mt-6 flex items-center justify-end gap-3">
|
<div class="mt-6 flex items-center justify-end gap-3">
|
||||||
|
|||||||
@@ -1,7 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Heart from '@lucide/svelte/icons/heart';
|
import Heart from '@lucide/svelte/icons/heart';
|
||||||
import Play from '@lucide/svelte/icons/play';
|
|
||||||
import Pause from '@lucide/svelte/icons/pause';
|
|
||||||
import X from '@lucide/svelte/icons/x';
|
import X from '@lucide/svelte/icons/x';
|
||||||
import { player, type QueueItem } from '$lib/player/player.svelte';
|
import { player, type QueueItem } from '$lib/player/player.svelte';
|
||||||
import { liked } from '$lib/player/liked.svelte';
|
import { liked } from '$lib/player/liked.svelte';
|
||||||
|
|||||||
@@ -286,11 +286,11 @@
|
|||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
playSpotlightTrack(i);
|
playSpotlightTrack(i);
|
||||||
}}
|
}}
|
||||||
class="flex items-center gap-4 rounded-control p-2 text-left transition-colors hover:bg-hover {isTargetCurrent(
|
class="flex items-center gap-4 rounded-control p-2 text-left transition-colors {isTargetCurrent(
|
||||||
target
|
target
|
||||||
)
|
)
|
||||||
? 'bg-accent-tint'
|
? 'bg-accent-tint'
|
||||||
: ''}"
|
: 'hover:bg-hover'}"
|
||||||
>
|
>
|
||||||
<span class="w-5 shrink-0 text-center text-xs text-muted tabular-nums"
|
<span class="w-5 shrink-0 text-center text-xs text-muted tabular-nums"
|
||||||
>{i + 1}</span
|
>{i + 1}</span
|
||||||
|
|||||||
Reference in New Issue
Block a user