NotS1mp/Musify
0
0
Fork 0
Code Issues 23 Pull Requests Actions Packages Projects Releases Wiki Activity

Design Prot Merge #1

Merged
NotS1mp merged 217 commits from design-prot into master 2026-09-21 15:48:16 +00:00
Conversation 0 Commits 217 Files Changed 779
+11 -7
4 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 02e093d254 - Show all commits
frontend/src/routes/(app)/explore/+page.svelte
+1 -1
View File
@@ -53,7 +53,7 @@
<meta name="description" content="Explora y busca canciones en Musify." />
</svelte:head>
<section class="px-8 py-12">
<section class="px-8 pt-12 pb-8">
<h1 class="font-display text-3xl font-bold tracking-tight sm:text-4xl">Explorar</h1>
<p class="mt-2 text-neutral-400">Descubre canciones o busca por nombre.</p>
frontend/src/routes/(app)/library/+page.svelte
+2 -2
View File
@@ -33,8 +33,8 @@
<section class="px-8 py-11">
<div class="flex items-end justify-between gap-4">
<div>
<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)]">
<h1 class="font-display text-3xl font-bold tracking-tight sm:text-4xl">Tus canciones subidas</h1>
<p class="mt-2 text-[var(--mf-text-2)]">
{total}
{total === 1 ? 'canción' : 'canciones'} subida{total === 1 ? '' : 's'}.
</p>
frontend/src/routes/+page.server.ts
+1 -1
View File
@@ -9,7 +9,7 @@ export const load: PageServerLoad = async ({ locals, fetch }) => {
});
const playlistsPromise = locals.user
? api.GET('/playlists/users/{userId}', {
params: { path: { userId: locals.user.sub }, query: { pageNumber: 1, pageSize: 8 } }
params: { path: { userId: locals.user.sub }, query: { pageNumber: 1, pageSize: 12 } }
})
: Promise.resolve({ data: undefined });
const recentlyPlayedPromise = locals.user
frontend/src/routes/+page.svelte
+7 -3
View File
@@ -46,6 +46,9 @@
return /[.!?]$/.test(pick) ? pick : `${pick}.`;
})();
const listasIsFirstSection = $derived(recentlyPlayed.length === 0 && playlists.length > 0);
const novedadesIsFirstSection = $derived(recentlyPlayed.length === 0 && playlists.length === 0);
function hueFor(id: string) {
let hash = 0;
for (let i = 0; i < id.length; i++) hash = (hash * 31 + id.charCodeAt(i)) >>> 0;
@@ -114,9 +117,9 @@
{/if}
{#if playlists.length > 0}
<section class="px-8 pb-3 pt-3">
<section class="px-8 pb-3 {listasIsFirstSection ? 'pt-6' : 'pt-3'}">
<h2 class="mb-4 font-display text-xl font-bold">Mis listas</h2>
<div class="grid grid-cols-[repeat(auto-fill,minmax(150px,1fr))] gap-4">
<div class="grid grid-cols-[repeat(auto-fill,minmax(160px,1fr))] gap-4">
{#each playlists as playlist, i (playlist.id)}
<a
href="/playlists/{playlist.id}"
@@ -124,6 +127,7 @@
style="animation-delay:{i * 45}ms"
>
<PlaylistArt
playlistId={playlist.id}
trackIds={trackIds[playlist.id] ?? []}
hue={hueFor(playlist.id)}
class="aspect-square w-full rounded-xl shadow-[0_12px_28px_-10px_rgba(0,0,0,0.6)] transition group-hover:shadow-[0_16px_36px_-10px_rgba(0,0,0,0.75)]"
@@ -137,7 +141,7 @@
</section>
{/if}
<section class="px-8 pb-16 pt-3">
<section class="px-8 pb-8 {novedadesIsFirstSection ? 'pt-6' : 'pt-3'}">
<h2 class="mb-4 font-display text-xl font-bold">Novedades</h2>
{#if latest.length > 0}
<div class="grid grid-cols-[repeat(auto-fill,minmax(160px,1fr))] gap-4">