added button component

This commit is contained in:
Pedro Cabral
2026-04-21 14:33:46 +02:00
parent 1b5d3f5bdf
commit 1bc3e5f885
5 changed files with 155 additions and 18 deletions

View File

@@ -0,0 +1,8 @@
<button
{{ $attributes
->merge(['class' => $classes()])
->merge(['disabled' => $disabled])
}}
>
{{ $slot }}
</button>

View File

@@ -27,33 +27,29 @@
<h3 class="text-l font-semibold">Enabled</h3>
<div class="flex gap-4">
<button class="bg-primary text-text-inverted px-4 py-2 rounded">
Primary
</button>
<x-button onclick="alert('Default was clicked!')">Default</x-button>
<button class="bg-secondary text-black px-4 py-2 rounded">
Secondary
</button>
<x-button variant="primary" onclick="alert('Primary was clicked!')">Primary</x-button>
<button class="border border-primary text-primary px-4 py-2 rounded">
Outline
</button>
<x-button variant="secondary" onclick="alert('Secondary was clicked!')">Secondary</x-button>
<x-button variant="outline" onclick="alert('Outline was clicked!')">Outline</x-button>
</div>
<h3 class="text-l font-semibold">Disabled</h3>
<div class="flex gap-4">
<button class="bg-primary text-text-inverted px-4 py-2 rounded" disabled>
Primary
</button>
<x-button disabled>Default</x-button>
<button class="bg-secondary text-black px-4 py-2 rounded" disabled>
Secondary
</button>
<x-button variant="primary" disabled>Primary</x-button>
<button class="border border-primary text-primary px-4 py-2 rounded" disabled>
Outline
</button>
<x-button variant="secondary" disabled>Secondary</x-button>
<x-button variant="outline" disabled>Outline</x-button>
</div>
</section>