arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-25 17:30:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(Kbd): add color prop

Browse Source
This commit is contained in:
Benjamin Canac
2024-04-05 15:43:41 +02:00
parent 06ea029ef6
commit 2cc41dedcf
5 changed files with 50 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
playground/pages/kbd.vue
View File

@@ -1,6 +1,28 @@
<script setup lang="ts">
import theme from '#build/ui/kbd'
const sizes = Object.keys(theme.variants.size)
</script>
<template>
<div class="flex items-center gap-1">
<UKbd value="⌘" />
<UKbd value="K" />
<div class="flex flex-col gap-2">
<div class="flex items-center gap-1">
<UKbd value="⌘" />
<UKbd value="K" />
</div>
<div class="flex items-center gap-1">
<UKbd value="⌘" color="gray" />
<UKbd value="K" color="gray" />
</div>
<div class="flex items-center gap-1">
<UKbd value="⌘" color="black" />
<UKbd value="K" color="black" />
</div>
<div class="flex items-center gap-1 -ml-[41px]">
<template v-for="size in sizes" :key="size">
<UKbd value="⌘" :size="(size as any)" />
<UKbd value="K" :size="(size as any)" />
</template>
</div>
</div>
</template>