Button

The thing you click to make stuff happen, like submitting a form or navigating to another page.

Adding the component

php artisan spur:add essentials/button

If you use this to add the component, it will automatically add it to config/spur.php and auto-fetch the components files.

config/spur.php
"components": [
  'essentials/button',
]

If you manually add the component in config/spur.php you would need to run
php artisan spur:fetch to import the component

Usage

Simple Button

<x-spur.button>Button</x-spur.button>

Button Sizes

<x-spur.button size="x-small">Button</x-spur.button>
<x-spur.button size="small">Button</x-spur.button>
<x-spur.button size="normal">Button</x-spur.button>
<x-spur.button size="medium">Button</x-spur.button>
<x-spur.button size="large">Button</x-spur.button>

Button Styles

<x-spur.button rounded="circular">Button</x-spur.button>
<x-spur.button rounded="rounded">Button</x-spur.button>

Outlined Button

<x-spur.button outline>Button</x-spur.button>

Plain Button

<x-spur.button plain>Button</x-spur.button>

Button Colors

<x-spur.button color="black">Button</x-spur.button>
<x-spur.button color="light">Button</x-spur.button>
<x-spur.button color="yellow">Button</x-spur.button>
<x-spur.button color="green">Button</x-spur.button>
<x-spur.button color="indigo">Button</x-spur.button>
<x-spur.button color="blue">Button</x-spur.button>
<x-spur.button color="red">Button</x-spur.button>