mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-24 00:40:34 +01:00
chore: add local module for better development dx (#2)
* chore: add local module for better dx developing nuxt/ui * up * up * up * feat(Kbd): new * chore(Badge): update * chore(Collapsible): remove content prop * chore(Container): clean * chore(Avatar): update root bg * chore(Link): clean * feat(Tooltip): handle shortcuts * playground(collapsible): update --------- Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
export default {
|
||||
slots: {
|
||||
root: 'inline-flex items-center justify-center shrink-0 select-none overflow-hidden rounded-full align-middle bg-gray-100 dark:bg-gray-800',
|
||||
root: 'inline-flex items-center justify-center shrink-0 select-none overflow-hidden rounded-full align-middle bg-gray-50 dark:bg-gray-800',
|
||||
image: 'h-full w-full rounded-[inherit] object-cover',
|
||||
fallback: 'font-medium leading-none text-gray-500 dark:text-gray-400 truncate',
|
||||
icon: 'text-gray-500 dark:text-gray-400 shrink-0'
|
||||
|
||||
@@ -4,4 +4,5 @@ export { default as button } from './button'
|
||||
export { default as collapsible } from './collapsible'
|
||||
export { default as container } from './container'
|
||||
export { default as icons } from './icons'
|
||||
export { default as kbd } from './kbd'
|
||||
export { default as tooltip } from './tooltip'
|
||||
13
src/theme/kbd.ts
Normal file
13
src/theme/kbd.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
export default {
|
||||
base: 'inline-flex items-center justify-center text-gray-900 dark:text-white px-1 rounded font-medium font-sans bg-gray-50 dark:bg-gray-800 ring ring-gray-300 dark:ring-gray-700 ring-inset',
|
||||
variants: {
|
||||
size: {
|
||||
xs: 'h-4 min-w-[16px] text-[10px]',
|
||||
sm: 'h-5 min-w-[20px] text-[11px]',
|
||||
md: 'h-6 min-w-[24px] text-[12px]'
|
||||
}
|
||||
},
|
||||
defaultVariants: {
|
||||
size: 'sm'
|
||||
}
|
||||
}
|
||||
@@ -1,6 +1,9 @@
|
||||
export default {
|
||||
slots: {
|
||||
content: 'bg-white dark:bg-gray-900 text-gray-900 dark:text-white shadow rounded ring ring-gray-200 dark:ring-gray-800 h-6 px-2 py-1 text-xs font-normal truncate relative data-[state=delayed-open]:data-[side=top]:animate-[tooltip-down_200ms_ease-out] data-[state=delayed-open]:data-[side=right]:animate-[tooltip-left_200ms_ease-out] data-[state=delayed-open]:data-[side=left]:animate-[tooltip-right_200ms_ease-out] data-[state=delayed-open]:data-[side=bottom]:animate-[tooltip-up_200ms_ease-out]',
|
||||
arrow: 'fill-white dark:fill-gray-700'
|
||||
content: 'flex items-center gap-1 bg-white dark:bg-gray-900 text-gray-900 dark:text-white shadow rounded ring ring-gray-200 dark:ring-gray-800 h-6 px-2 py-1 text-xs select-none max-w-48 will-change-[transform,opacity] data-[state=delayed-open]:data-[side=top]:animate-[tooltip-down_200ms_ease-out] data-[state=delayed-open]:data-[side=right]:animate-[tooltip-left_200ms_ease-out] data-[state=delayed-open]:data-[side=left]:animate-[tooltip-right_200ms_ease-out] data-[state=delayed-open]:data-[side=bottom]:animate-[tooltip-up_200ms_ease-out]',
|
||||
arrow: 'fill-gray-200 dark:fill-gray-800',
|
||||
text: 'truncate',
|
||||
// eslint-disable-next-line quotes
|
||||
shortcuts: `hidden lg:inline-flex items-center shrink-0 gap-0.5 before:content-['·'] before:mr-0.5`
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user