eightequal/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Create button (#62)

Browse Source
This commit is contained in:
Adrian O.V
2023-06-05 23:34:52 -04:00
committed by GitHub
parent ae3a35816e
commit d98a6adfb3
6 changed files with 444 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
docs/.vitepress/config.js
View File

@@ -29,6 +29,7 @@ export default {
{ text: 'Pagination', link: '/components/pagination' },
{ text: 'Modal', link: '/components/modal' },
{ text: 'Dropdown Select', link: '/components/dropdown-select' },
{ text: 'Dropdown Button', link: '/components/dropdown-button' },
{ text: 'Project Card', link: '/components/project-card' },
{ text: 'Environment Indicator', link: '/components/environment-indicator' },
{ text: 'Categories', link: '/components/categories' },

116
docs/components/dropdown-button.md Normal file
View File

@@ -0,0 +1,116 @@
# Dropdown
<DemoContainer>
<DropdownButton
:options="['delete', 'save', 'recycle', 'reduce', 'reuse']"
default-value="delete"
name="dropdown-one"
>
<template #delete>
<TrashIcon /> Delete
</template>
<template #save>
<CheckIcon /> Save
</template>
<template #recycle>
<UpdatedIcon /> Recycle
</template>
<template #reduce>
<ChevronDownIcon /> Reduce
</template>
<template #reuse>
<TransferIcon /> Reuse
</template>
</DropdownButton>
<DropdownButton
:options="['delete', 'save', 'recycle', 'reduce', 'reuse']"
default-value="delete"
name="dropdown-two"
render-up
>
<template #delete>
<TrashIcon /> Delete
</template>
<template #save>
<CheckIcon /> Save
</template>
<template #recycle>
<UpdatedIcon /> Recycle
</template>
<template #reduce>
<ChevronDownIcon /> Reduce
</template>
<template #reuse>
<CalendarIcon /> Reuse
</template>
</DropdownButton>
<DropdownButton
:options="['delete', 'save', 'recycle', 'reduce', 'reuse']"
default-value="delete"
name="dropdown-three"
disabled
>
<template #delete>
<TrashIcon /> Delete
</template>
<template #save>
<CheckIcon /> Save
</template>
<template #recycle>
<UpdatedIcon /> Recycle
</template>
<template #reduce>
<ChevronDownIcon /> Reduce
</template>
<template #reuse>
<CalendarIcon /> Reuse
</template>
</DropdownButton>
<DropdownButton
:options="['delete', 'save', 'recycle', 'reduce', 'reuse']"
default-value="delete"
name="dropdown-four"
render-up
disabled
>
<template #delete>
<TrashIcon /> Delete
</template>
<template #save>
<CheckIcon /> Save
</template>
<template #recycle>
<UpdatedIcon /> Recycle
</template>
<template #reduce>
<ChevronDownIcon /> Reduce
</template>
<template #reuse>
<CalendarIcon /> Reuse
</template>
</DropdownButton>
</DemoContainer>
```vue
<DropdownButton
:options="['delete', 'save', 'recycle', 'reduce', 'reuse']"
default-value="delete"
@option-click="handleOptionClick"
render-up
>
<template #delete>
<TrashIcon /> Delete
</template>
<template #save>
<CheckIcon /> Save
</template>
<template #recycle>
<UpdatedIcon /> Recycle
</template>
<template #reduce>
<ChevronDownIcon /> Reduce
</template>
<template #reuse>
<CalendarIcon /> Reuse
</template>
</DropdownButton>
```