feat(ui): document default color choice for buttons

This commit is contained in:
upsiflu 2024-12-18 16:58:27 +01:00
parent ae384cbd46
commit 50edbf0cfa
1 changed files with 21 additions and 4 deletions

View File

@ -1,6 +1,7 @@
<script setup>
import Button from '~/components/ui/Button.vue'
import Layout from '~/components/ui/Layout.vue'
import { color } from '~/composables/colors.ts';
const click = () => new Promise(resolve => setTimeout(resolve, 1000))
</script>
@ -23,14 +24,30 @@ In addition, use [Colors] and [Variants]
Buttons come in different types depending on the type of action they represent.
Find [a complete overview of recommended styles on the color page](../../using-color#links-and-buttons).
### Default
<Layout flex>
```vue-html
<Button>
Default button
</Button>
```
<Layout class="preview">
<Button>
Default button
</Button>
</Layout>
</Layout>
### Primary
Primary buttons represent **positive** actions such as uploading, confirming, and accepting changes.
::: info
This is the default type. If you don't specify a type, a primary button is rendered.
:::
```vue-html
<Button primary>
Primary button