chore: move download button into header (#219)

Move download button into header

Author: OLILHR

src/lib/components/features/download-button.svelte

@@ -4,7 +4,7 @@
   import { IconDownload, IconSpinner } from "$lib/components";
   import { downloadCalendar } from "$lib/services/download-ics";
 
-  export let background = "bg-fristenkalender_primary";
+  export let background = "bg-fristenkalender_secondary";
   export let textColor = "text-black";
   export let selectedYear: number;
 

src/lib/components/shared/header.svelte

@@ -5,6 +5,7 @@
     CalendarMonthSelect,
     CalendarTypeSelect,
     CalendarYearSelect,
+    DownloadButton,
     IconSymbol,
   } from "$lib/components";
   import type { MonthValue } from "$lib/types/calendar-month";
@@ -32,10 +33,13 @@
     </div>
   </div>
 
-  <div class="flex-none py-2 pr-1">
-    <AuthButton
-      background="bg-fristenkalender_secondary"
-      textColor="text-black/70"
-    />
+  <div class="flex-none py-2 pr-3">
+    <div class="flex items-center gap-4">
+      <DownloadButton {selectedYear} />
+      <AuthButton
+        background="bg-fristenkalender_secondary"
+        textColor="text-black/70"
+      />
+    </div>
   </div>
 </header>

src/routes/fristenkalender/+page.svelte

@@ -4,7 +4,7 @@
   import { goto } from "$app/navigation";
   import { base } from "$app/paths";
   import { page } from "$app/stores";
-  import { DownloadButton, GlossaryToggle, Header } from "$lib/components";
+  import { GlossaryToggle, Header } from "$lib/components";
   import CalendarTable from "$lib/components/features/calendar-table.svelte";
   import type { MonthValue } from "$lib/types/calendar-month";
   import type { TypeValue } from "$lib/types/calendar-type";
@@ -96,9 +96,6 @@
           ?.label || "alle"}
       </h2>
     </div>
-    <div class="px-24 py-12">
-      <DownloadButton {selectedYear} />
-    </div>
   </div>
   <div class="flex-1 min-h-0 px-24 pb-8">
     <CalendarTable {selectedYear} {selectedMonth} {selectedType} />