refactor(frontend): drop downloads/import nav, promote library above upload

This commit is contained in:
2026-07-14 13:23:51 +02:00
parent e4830ad73f
commit b372028e0a
4 changed files with 7 additions and 61 deletions
+3 -7
View File
@@ -6,8 +6,6 @@
import Library from '@lucide/svelte/icons/library-big'; import Library from '@lucide/svelte/icons/library-big';
import ListMusic from '@lucide/svelte/icons/list-music'; import ListMusic from '@lucide/svelte/icons/list-music';
import Upload from '@lucide/svelte/icons/upload'; import Upload from '@lucide/svelte/icons/upload';
import Infinity_ from '@lucide/svelte/icons/infinity';
import ArrowDown from '@lucide/svelte/icons/arrow-down';
import LogOut from '@lucide/svelte/icons/log-out'; import LogOut from '@lucide/svelte/icons/log-out';
interface Props { interface Props {
@@ -32,14 +30,12 @@
const mainLinks = [ const mainLinks = [
{ href: '/', label: 'Inicio', icon: Home }, { href: '/', label: 'Inicio', icon: Home },
{ href: '/explore', label: 'Buscar', icon: Search }, { href: '/explore', label: 'Buscar', icon: Search },
{ href: '/library', label: 'Tu biblioteca', icon: Library }, { href: '/playlists', label: 'Mis listas', icon: ListMusic }
{ href: '/playlists', label: 'Tus listas', icon: ListMusic }
]; ];
const secondaryLinks = [ const secondaryLinks = [
{ href: '/upload', label: 'Subir música', icon: Upload }, { href: '/library', label: 'Tus canciones subidas', icon: Library },
{ href: '/import', label: 'Importar', icon: Infinity_ }, { href: '/upload', label: 'Subir música', icon: Upload }
{ href: '/downloads', label: 'Descargas', icon: ArrowDown }
]; ];
function isActive(href: string) { function isActive(href: string) {
@@ -1,25 +0,0 @@
<script lang="ts">
import ArrowDown from '@lucide/svelte/icons/arrow-down';
</script>
<svelte:head>
<title>Descargas · Musify</title>
<meta name="description" content="Tus descargas en Musify." />
</svelte:head>
<section class="px-8 py-11">
<h1 class="font-display text-[28px] font-extrabold tracking-tight">Descargas</h1>
<p class="mb-7 mt-1.5 max-w-[560px] text-sm text-[var(--mf-text-2)]">
Escucha sin conexión lo que descargues.
</p>
<div
class="max-w-[560px] rounded-xl border border-[var(--mf-border)] bg-[var(--mf-surface)] px-6 py-10 text-center"
>
<ArrowDown class="mx-auto h-8 w-8 text-[var(--mf-text-3)]" strokeWidth={1.5} />
<p class="mt-4 text-sm text-[var(--mf-text-2)]">Todavía no tienes descargas</p>
<p class="mt-1.5 text-[12.5px] text-[var(--mf-text-4)]">
Las canciones que descargues aparecerán aquí.
</p>
</div>
</section>
@@ -1,25 +0,0 @@
<script lang="ts">
import Infinity_ from '@lucide/svelte/icons/infinity';
</script>
<svelte:head>
<title>Importar · Musify</title>
<meta name="description" content="Importa tu música desde otros servicios." />
</svelte:head>
<section class="px-8 py-11">
<h1 class="font-display text-[28px] font-extrabold tracking-tight">Importar</h1>
<p class="mb-7 mt-1.5 max-w-[560px] text-sm text-[var(--mf-text-2)]">
Trae tu música desde otros servicios.
</p>
<div
class="max-w-[560px] rounded-xl border border-[var(--mf-border)] bg-[var(--mf-surface)] px-6 py-10 text-center"
>
<Infinity_ class="mx-auto h-8 w-8 text-[var(--mf-text-3)]" strokeWidth={1.5} />
<p class="mt-4 text-sm text-[var(--mf-text-2)]">Próximamente</p>
<p class="mt-1.5 text-[12.5px] text-[var(--mf-text-4)]">
Podrás importar tu música desde otras plataformas.
</p>
</div>
</section>
@@ -26,17 +26,17 @@
</script> </script>
<svelte:head> <svelte:head>
<title>Tu biblioteca · Musify</title> <title>Tus canciones subidas · Musify</title>
<meta name="description" content="Todas tus canciones en Musify." /> <meta name="description" content="Todas tus canciones subidas a Musify." />
</svelte:head> </svelte:head>
<section class="px-8 py-11"> <section class="px-8 py-11">
<div class="flex items-end justify-between gap-4"> <div class="flex items-end justify-between gap-4">
<div> <div>
<h1 class="font-display text-[28px] font-extrabold tracking-tight">Tu biblioteca</h1> <h1 class="font-display text-[28px] font-extrabold tracking-tight">Tus canciones subidas</h1>
<p class="mt-1.5 text-sm text-[var(--mf-text-2)]"> <p class="mt-1.5 text-sm text-[var(--mf-text-2)]">
{total} {total}
{total === 1 ? 'canción' : 'canciones'} en tu biblioteca. {total === 1 ? 'canción' : 'canciones'} subida{total === 1 ? '' : 's'}.
</p> </p>
</div> </div>
<a <a