adjust auto refresh position

Signed-off-by: Ronni Skansing <rskansing@gmail.com>

frontend/src/lib/components/AutoRefresh.svelte

@@ -66,20 +66,23 @@
 	});
 </script>
 
-<div class="flex items-center gap-2">
-	<span class="font-semibold text-slate-600 dark:text-gray-300 py-2 transition-colors duration-200"
-		>Auto-Refresh</span
-	>
-	<div class="relative">
-		<TextFieldSelect
-			id="autoRefresh"
-			value={$autoRefreshStore.enabled
-				? options.byValue($autoRefreshStore.interval.toString())
-				: 'Disabled'}
-			onSelect={handleIntervalChange}
-			options={options.keys()}
-			inline={true}
-			size={'small'}
-		></TextFieldSelect>
+<div class="absolute top-0 right-0 min-w-[180px]">
+	<div class="flex items-center gap-2">
+		<span
+			class="font-semibold text-slate-600 dark:text-gray-300 transition-colors duration-200 whitespace-nowrap"
+			>Auto-Refresh</span
+		>
+		<div class="relative">
+			<TextFieldSelect
+				id="autoRefresh"
+				value={$autoRefreshStore.enabled
+					? options.byValue($autoRefreshStore.interval.toString())
+					: 'Disabled'}
+				onSelect={handleIntervalChange}
+				options={options.keys()}
+				inline={true}
+				size={'small'}
+			></TextFieldSelect>
+		</div>
 	</div>
 </div>

frontend/src/routes/campaign-template/+page.svelte

@@ -7,7 +7,6 @@
 	import TextField from '$lib/components/TextField.svelte';
 	import TableRow from '$lib/components/table/TableRow.svelte';
 	import TableCell from '$lib/components/table/TableCell.svelte';
-	import TableCellLink from '$lib/components/table/TableCellLink.svelte';
 	import TableUpdateButton from '$lib/components/table/TableUpdateButton.svelte';
 	import TableDeleteButton from '$lib/components/table/TableDeleteButton2.svelte';
 	import TableCellAction from '$lib/components/table/TableCellAction.svelte';

frontend/src/routes/campaign/+page.svelte

@@ -1082,17 +1082,18 @@
 
 <HeadTitle title="Campaigns" />
 
-<main class="">
-	<div class="flex justify-between">
+<main>
+	<div class="relative">
 		<Headline>Campaigns</Headline>
-		<AutoRefresh
-			isLoading={false}
-			onRefresh={() => {
-				refreshCampaigns(false);
-			}}
-		/>
+		<div class="absolute top-0 right-0">
+			<AutoRefresh
+				isLoading={false}
+				onRefresh={() => {
+					refreshCampaigns(false);
+				}}
+			/>
+		</div>
 	</div>
-
 	<BigButton on:click={openCreateModal}>New Campaign</BigButton>
 	<Table
 		columns={[

frontend/src/routes/campaign/[id]/+page.svelte

@@ -958,14 +958,15 @@
 
 <main>
 	{#if initialPageLoadComplete}
-		<div class="flex justify-between">
-			<Headline
-				>Campaign: {campaign.name ?? ''}
-				{#if campaign.isTest}
-					<TestLabel />
-				{/if}
-			</Headline>
-
+		<div class="relative">
+			<div class="flex justify-between">
+				<Headline
+					>Campaign: {campaign.name ?? ''}
+					{#if campaign.isTest}
+						<TestLabel />
+					{/if}
+				</Headline>
+			</div>
 			<AutoRefresh
 				isLoading={false}
 				onRefresh={async () => {