mirrors/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools.git synced 2025-05-09 07:35:01 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

ui-lib(button): size variants

Browse source
This commit is contained in:
Corentin Thomasset 2023-05-07 23:29:55 +02:00 • committed by Corentin THOMASSET
parent edae4c6915
commit 401f13f7e3
3 changed files with 51 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

41
src/ui/c-button/c-button.demo.vue
View file

@ -2,28 +2,39 @@
<div v-for="buttonVariant of buttonVariants" :key="buttonVariant">
<h2>{{ _.capitalize(buttonVariant) }}</h2>
<c-button v-for="buttonType of buttonTypes" :key="buttonType" :variant="buttonVariant" :type="buttonType" mx-1>
Button
</c-button>
<div v-for="buttonSize of buttonSizes" :key="buttonSize" mb-2>
<c-button
v-for="buttonType of buttonTypes"
:key="buttonType"
:variant="buttonVariant"
:type="buttonType"
:size="buttonSize"
mx-1
>
Button
</c-button>
<c-button
v-for="buttonType of buttonTypes"
:key="buttonType"
:variant="buttonVariant"
:type="buttonType"
circle
mx-1
>
A
</c-button>
<c-button
v-for="buttonType of buttonTypes"
:key="buttonType"
:variant="buttonVariant"
:type="buttonType"
:size="buttonSize"
circle
mx-1
>
A
</c-button>
</div>
</div>
</template>
<script lang="ts" setup>
import _ from 'lodash';
const buttonVariants = ['basic', 'text'];
const buttonTypes = ['default', 'primary'];
const buttonVariants = ['basic', 'text'] as const;
const buttonTypes = ['default', 'primary'] as const;
const buttonSizes = ['small', 'medium', 'large'] as const;
</script>
<style lang="less" scoped></style>