first commit
This commit is contained in:
49
resources/css/presets/aura/selectbutton/index.js
Normal file
49
resources/css/presets/aura/selectbutton/index.js
Normal file
@ -0,0 +1,49 @@
|
||||
export default {
|
||||
root: ({ props }) => ({
|
||||
class: ['shadow-sm', { 'opacity-60 select-none pointer-events-none cursor-default': props.disabled }]
|
||||
}),
|
||||
button: ({ context, props }) => ({
|
||||
class: [
|
||||
'relative',
|
||||
// Font
|
||||
'text-sm',
|
||||
'leading-none',
|
||||
|
||||
// Flex Alignment
|
||||
'inline-flex items-center align-bottom text-center',
|
||||
|
||||
// Spacing
|
||||
'px-2.5 py-1.5',
|
||||
|
||||
// Shape
|
||||
'ring-1',
|
||||
{ 'ring-surface-200 dark:ring-surface-700': !props.invalid },
|
||||
'first:rounded-l-md first:rounded-tr-none first:rounded-br-none',
|
||||
'last:rounded-tl-none last:rounded-bl-none last:rounded-r-md ',
|
||||
|
||||
// Color
|
||||
{
|
||||
'bg-surface-0 dark:bg-surface-900': !context.active,
|
||||
'text-surface-700 dark:text-white/80': !context.active,
|
||||
'bg-surface-100 dark:bg-surface-700': context.active
|
||||
},
|
||||
|
||||
// Invalid State
|
||||
{ 'ring-red-500 dark:ring-red-400': props.invalid },
|
||||
|
||||
// States
|
||||
'focus:outline-none focus:outline-offset-0 focus:ring-primary-500 dark:focus:ring-primary-400 focus:z-10',
|
||||
'hover:bg-surface-200 dark:hover:bg-surface-600/80',
|
||||
{ 'opacity-60 select-none pointer-events-none cursor-default': context.disabled },
|
||||
|
||||
// Transition
|
||||
'transition duration-200',
|
||||
|
||||
// Misc
|
||||
'cursor-pointer select-none overflow-hidden'
|
||||
]
|
||||
}),
|
||||
label: {
|
||||
class: 'font-semibold'
|
||||
}
|
||||
};
|
Reference in New Issue
Block a user