From 68e399d99c8894589d88bef3bcba4e93c89a2d3e Mon Sep 17 00:00:00 2001
From: pheralb <pablohdez4340@gmail.com>
Date: Sun, 31 Aug 2025 13:43:53 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Design=20improvements?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/svgs/downloadSvg.svelte         | 10 +++++++++-
 src/components/ui/dialog/dialog-content.svelte |  2 +-
 src/components/ui/dialog/dialog-header.svelte  |  2 +-
 src/routes/+layout.svelte                      |  2 ++
 4 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/svgs/downloadSvg.svelte b/src/components/svgs/downloadSvg.svelte
index 528db7f..c3377d8 100644
--- a/src/components/svgs/downloadSvg.svelte
+++ b/src/components/svgs/downloadSvg.svelte
@@ -118,7 +118,7 @@
       </Dialog.Header>
       <div
         class={cn(
-          "flex h-full flex-col space-y-2 pt-4 pb-0.5",
+          "flex h-full flex-col space-y-2 pt-2 pb-0.5",
           "md:flex-row md:items-center md:justify-center md:space-y-0 md:space-x-2",
         )}
       >
@@ -130,6 +130,7 @@
               class="my-4 h-8"
             />
             <Button
+              class="justify-start"
               title="Download logo"
               variant="outline"
               onclick={() => {
@@ -151,6 +152,7 @@
               class="my-4 h-10"
             />
             <Button
+              class="justify-start"
               title="Logo with light & dark variants"
               variant="outline"
               onclick={() => {
@@ -167,6 +169,7 @@
             </Button>
 
             <Button
+              class="justify-start"
               title="Download light variant"
               variant="outline"
               onclick={() => {
@@ -181,6 +184,7 @@
             </Button>
 
             <Button
+              class="justify-start"
               title="Download dark variant"
               variant="outline"
               onclick={() => {
@@ -204,6 +208,7 @@
               class="my-4 h-8"
             />
             <Button
+              class="justify-start"
               title="Download Wordmark logo"
               variant="outline"
               onclick={() => {
@@ -229,6 +234,7 @@
               class="my-4 h-10"
             />
             <Button
+              class="justify-start"
               title="Download Wordmark light variant"
               variant="outline"
               onclick={() => {
@@ -247,6 +253,7 @@
             </Button>
 
             <Button
+              class="justify-start"
               title="Download Wordmark light variant"
               variant="outline"
               onclick={() => {
@@ -261,6 +268,7 @@
             </Button>
 
             <Button
+              class="justify-start"
               title="Download Wordmark dark variant"
               variant="outline"
               onclick={() => {
diff --git a/src/components/ui/dialog/dialog-content.svelte b/src/components/ui/dialog/dialog-content.svelte
index 07004db..786107a 100644
--- a/src/components/ui/dialog/dialog-content.svelte
+++ b/src/components/ui/dialog/dialog-content.svelte
@@ -27,7 +27,7 @@
     bind:ref
     data-slot="dialog-content"
     class={cn(
-      "fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border border-neutral-200 bg-white p-6 shadow-lg duration-200 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg dark:border-neutral-800 dark:bg-neutral-900",
+      "fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-2 rounded-lg border border-neutral-200 bg-white p-6 shadow-lg duration-200 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg dark:border-neutral-800 dark:bg-neutral-900",
       className,
     )}
     {...restProps}
diff --git a/src/components/ui/dialog/dialog-header.svelte b/src/components/ui/dialog/dialog-header.svelte
index fc05bd1..45cd4c8 100644
--- a/src/components/ui/dialog/dialog-header.svelte
+++ b/src/components/ui/dialog/dialog-header.svelte
@@ -14,7 +14,7 @@
 <div
   bind:this={ref}
   data-slot="dialog-header"
-  class={cn("flex flex-col gap-2 text-center sm:text-left", className)}
+  class={cn("mb-2 flex flex-col gap-1 text-center sm:text-left", className)}
   {...restProps}
 >
   {@render children?.()}
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index a3e4098..47cae69 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -11,6 +11,7 @@
   import { ModeWatcher } from "mode-watcher";
   import Sidebar from "@/components/layout/sidebar.svelte";
   import ViewTransitions from "@/components/viewTransitions.svelte";
+  import Sonner from "@/components/ui/sonner/sonner.svelte";
 
   // SSR Data:
   let { data, children }: LayoutProps = $props();
@@ -18,6 +19,7 @@
 
 <ModeWatcher />
 <ViewTransitions />
+<Sonner />
 <Header githubStars={data?.stars} />
 <Sidebar>
   {@render children?.()}