Simplify design

This commit is contained in:
2026-09-23 01:33:25 +02:00
parent d7199b4d1d
commit 2660c124d5
49 changed files with 356 additions and 195 deletions
@@ -78,9 +78,7 @@
{/if}
</Button>
{#if isOwner}
<Button size="sm" variant="secondary" onclick={() => (editing = true)}>
Editar
</Button>
<Button size="sm" variant="secondary" onclick={() => (editing = true)}>Editar</Button>
<Button size="sm" variant="secondary" onclick={() => (confirmingDelete = true)}>
Eliminar
</Button>
@@ -249,7 +249,7 @@
{/if}
<div class="flex h-22 min-w-0 flex-1 flex-col justify-center gap-3">
<div class="text-eyebrow leading-none font-semibold text-fg-3">
<div class="text-eyebrow leading-none font-semibold text-fg-2">
Mejor resultado · {TOP_RESULT_KIND_LABEL[topResult.kind]}
</div>
<div
@@ -264,7 +264,7 @@
: topResult.user.name}
</div>
{#if topResult.kind === 'track' && topResult.track.artist}
<div class="truncate text-sm leading-none text-fg-3">
<div class="truncate text-sm leading-none text-fg-2">
{topResult.track.artist}
</div>
{/if}
@@ -276,6 +276,7 @@
<svelte:element
this={topResult.kind === 'track' ? 'button' : 'a'}
type={topResult.kind === 'track' ? 'button' : undefined}
role={topResult.kind === 'track' ? 'button' : 'link'}
href={topResult.kind === 'track' ? undefined : topResultHref}
onclick={topResult.kind === 'track' ? playTopResult : undefined}
class="group/top animate-pop mt-6.5 flex w-full items-center gap-5 rounded-panel-lg bg-surface p-4.5 text-left transition hover:bg-surface-hover"
@@ -348,7 +349,7 @@
{/if}
{/snippet}
{#snippet trailing()}
<span class="hidden shrink-0 text-xs text-muted tabular-nums sm:block">
<span class="hidden shrink-0 text-xs text-fg-2 tabular-nums sm:block">
{fmtTime(seconds)} · {fmtPlays(track.listensCount)}
</span>
{/snippet}
@@ -383,7 +384,7 @@
oncontextmenu={(e) => openAlbumMenu(e, album.id)}
>
{#snippet trailing()}
<span class="hidden shrink-0 text-xs text-muted tabular-nums sm:block">
<span class="hidden shrink-0 text-xs text-fg-2 tabular-nums sm:block">
{Number(album.trackCount)} canciones
</span>
{/snippet}
@@ -67,9 +67,7 @@
Reproducir
{/if}
</Button>
<Button size="sm" variant="secondary" onclick={() => (editing = true)}>
Editar
</Button>
<Button size="sm" variant="secondary" onclick={() => (editing = true)}>Editar</Button>
<Button size="sm" variant="secondary" onclick={() => (confirmingDelete = true)}>
Eliminar
</Button>
@@ -123,7 +123,7 @@
</span>
<span class="text-sm font-medium text-fg">{step.label}</span>
</div>
<p class="mt-2.5 text-xs text-muted">{step.hint}</p>
<p class="mt-2.5 text-xs text-fg-2">{step.hint}</p>
</Surface>
</li>
{/each}
@@ -191,7 +191,7 @@
aria-label="Seleccionar archivo de audio"
/>
{#if audioName === ''}
<Headphones class="size-9 text-muted sm:size-10" strokeWidth={1.4} />
<Headphones class="size-9 text-fg-2 sm:size-10" strokeWidth={1.4} />
{:else}
<Music class="size-9 text-accent-soft sm:size-10" strokeWidth={1.4} />
{/if}
@@ -199,12 +199,12 @@
<p class="mt-4 text-sm font-medium text-fg">
Arrastra tu audio aquí o haz clic para elegir
</p>
<p class="mt-1.5 text-xs text-muted">MP3, FLAC, WAV…</p>
<p class="mt-1.5 text-xs text-fg-2">MP3, FLAC, WAV…</p>
{:else}
<p class="mt-4 max-w-full truncate text-sm font-medium text-fg">
{audioName}
</p>
<p class="mt-1.5 text-xs text-muted">{formatSize(audioSize)} · Listo para subir</p>
<p class="mt-1.5 text-xs text-fg-2">{formatSize(audioSize)} · Listo para subir</p>
{/if}
</div>
@@ -251,7 +251,7 @@
<Surface padding="sm">
<div class="flex items-center justify-between text-sm">
<span class="font-medium text-fg">Subiendo y creando la pista…</span>
<span class="text-xs text-muted">un momento</span>
<span class="text-xs text-fg-2">un momento</span>
</div>
<div class="mt-3 h-2 overflow-hidden rounded-full bg-surface-2">
<div class="h-full w-full animate-pulse rounded-full bg-accent-soft"></div>