From 1421152a9356c7def86143dfb31a3586d5491d55 Mon Sep 17 00:00:00 2001
From: Wolfgang Müller
Date: Fri, 14 Feb 2025 11:57:03 +0100
Subject: frontend: Migrate to Tailwind 4.0

---
 frontend/src/lib/tabs/Tabs.svelte | 12 +++---------
 1 file changed, 3 insertions(+), 9 deletions(-)

(limited to 'frontend/src/lib/tabs/Tabs.svelte')

diff --git a/frontend/src/lib/tabs/Tabs.svelte b/frontend/src/lib/tabs/Tabs.svelte
index 1ae7c32..3c5611e 100644
--- a/frontend/src/lib/tabs/Tabs.svelte
+++ b/frontend/src/lib/tabs/Tabs.svelte
@@ -30,18 +30,18 @@
 
 <div class="flex h-full max-h-full flex-col">
 	<nav>
-		<ul class="me-3 ms-1 flex border-b-2 border-slate-700 text-sm">
+		<ul class="ms-1 me-3 flex border-b-2 border-slate-700 text-sm">
 			{#each Object.entries(context.tabs) as [id, { title }]}
 				<li class="-mb-0.5">
 					<button
 						type="button"
 						class:active={context.current === id}
-						class="focus-background relative flex gap-1 p-1 px-3 hover:border-b-2 hover:border-slate-200"
+						class="relative flex gap-1 p-1 px-3 hover:border-b-2 hover:border-slate-200 [&.active]:border-b-2 [&.active]:border-indigo-500"
 						onclick={() => (context.current = id)}
 					>
 						{#if badges[id]}
 							<div
-								class="absolute right-0 top-1 h-2 w-2 rounded-full bg-emerald-400"
+								class="absolute top-1 right-0 h-2 w-2 rounded-full bg-emerald-400"
 								title="There are pending changes"
 								transition:fade={fadeFast}
 							></div>
@@ -54,9 +54,3 @@
 	</nav>
 	{@render children?.()}
 </div>
-
-<style lang="postcss">
-	button.active {
-		@apply border-b-2 border-indigo-500;
-	}
-</style>
-- 
cgit v1.2.3-2-gb3c3