Layout and sizing changes

This commit is contained in:
Mihkel Martin Kasterpalu 2025-01-22 17:05:21 +02:00
parent c9167cc969
commit a4e4f1157b
3 changed files with 14 additions and 14 deletions

View file

@ -48,7 +48,7 @@
>
{#each { length: 3 }}
{#if i < 2}
<Skeleton class="h-[6rem] w-full rounded-xl border border-primary/5" />
<Skeleton class="h-[5rem] w-full rounded-xl border border-primary/5" />
{:else}
<Skeleton class="aspect-square h-auto max-w-full rounded-xl object-cover" />
{/if}
@ -93,9 +93,9 @@
</AlertDialog.Content>
</AlertDialog.Root>
<header class="font-title mb-16 flex flex-col items-center">
<h1 class="mb-1 scroll-m-20 text-6xl font-extrabold tracking-tight lg:text-7xl">Paku biiti</h1>
<p class="text-2xl font-semibold text-muted-foreground">
<header class="font-title mb-12 flex flex-col items-center">
<h1 class="mb-1 scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl">Paku biiti</h1>
<p class="text-xl font-semibold text-muted-foreground">
Lohista kokku õiged albumi <span class="text-red-600 dark:text-red-400">nimed</span>,
<span class="text-purple-600 dark:text-purple-400">artistid</span> ja
<span class="text-blue-600 dark:text-blue-400">pildid</span>.

View file

@ -34,23 +34,23 @@
<ModeWatcher />
<header class="absolute top-0 flex w-full justify-between px-8 py-6">
<header class="container flex w-full items-center justify-between px-8 py-6">
<a href="/">
<img src="/favicon.svg" alt="Mihkel Martin Kasterpalu logo" class="h-10" />
<img src="/favicon.svg" alt="Mihkel Martin Kasterpalu logo" class="h-9" />
</a>
<Button onclick={() => cycleTheme()} variant="outline" size="icon">
<Button onclick={() => cycleTheme()} variant="ghost" size="icon" class="h-12 w-12">
{#if theme === 'dark'}
<Moon class="absolute h-[1.2rem] w-[1.2rem]" />
<Moon class="!h-6 !w-6" />
{:else if theme === 'light'}
<Sun class="h-[1.2rem] w-[1.2rem] " />
<Sun class="!h-6 !w-6" />
{:else}
<LaptopMinimal class="h-[1.2rem] w-[1.2rem]" />
<LaptopMinimal class="!h-6 !w-6" />
{/if}
<span class="sr-only">Toggle theme</span>
</Button>
</header>
<div class="container mt-24 flex flex-col items-center py-4">
<div class="container flex flex-col items-center">
{@render children()}
</div>

View file

@ -13,12 +13,12 @@
</svelte:head>
<header class="font-title mb-24 flex flex-col items-center">
<h1 class="mb-1 scroll-m-20 text-6xl font-extrabold tracking-tight lg:text-7xl">
<h1 class="mb-1 scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl">
stuff.kasterpalu.ee
</h1>
<p class="text-2xl font-semibold text-muted-foreground">Minimängud ja muud huvitavat</p>
<p class="text-xl font-semibold text-muted-foreground">Minimängud ja muud huvitavat</p>
</header>
<main class="grid w-full max-w-4xl justify-items-center">
<main class="grid w-full max-w-4xl justify-items-center gap-y-8 lg:grid-cols-2">
{#each Object.entries(games) as [href, { image, name }]}
<a
class="shadow-sharp flex aspect-[4/1] w-full max-w-sm items-center justify-center rounded-xl border-2 border-current bg-contain bg-no-repeat transition-all"