feat(ui): document default color choice for buttons
This commit is contained in:
parent
ae384cbd46
commit
50edbf0cfa
|
@ -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
|
||||
|
|
Loading…
Reference in New Issue