From d929a33c18a993f0a0ca5cb3f19ef68660b41aa0 Mon Sep 17 00:00:00 2001
From: Gear <84141000+macgeargear@users.noreply.github.com>
Date: Wed, 11 Sep 2024 03:17:54 +0700
Subject: [PATCH] fix: style

---
 src/lib/components/Playground.svelte | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/Playground.svelte b/src/lib/components/Playground.svelte
index 0544af7..c57ec75 100644
--- a/src/lib/components/Playground.svelte
+++ b/src/lib/components/Playground.svelte
@@ -115,6 +115,7 @@
 				<Button color="black">Default Black</Button>
 				<Button color="white">Default White</Button>
 				<Button variant="outline">Default Outline</Button>
+				<Button class="bg-amber-700 text-white rounded-2xl">Custom Css</Button>
 			</div>
 			<div class="flex flex-col items-center gap-2">
 				<h4>Large</h4>
@@ -129,7 +130,7 @@
 	<!-- TabCapsule.svelte -->
 	<section class="section">
 		<h2 class="font-bold text-2xl mb-4">Capsule Tabs</h2>
-		<div class="flex items-center gap-2">
+		<div class="flex flex-wrap items-center gap-2">
 			{#each tabs as tab, i}
 				<TabCapsuleItem active={tab.active} label={tab.label} onClick={() => toggle(i)} />
 			{/each}