mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-10 01:12:37 +00:00
Update TW demos for the new fixes
This commit is contained in:
parent
67f80538b4
commit
03987ed2fd
10 changed files with 168 additions and 94 deletions
|
@ -35,10 +35,12 @@ export default {
|
|||
{ 'opacity-60 select-none pointer-events-none cursor-default': props?.disabled }
|
||||
]
|
||||
}),
|
||||
labelContainer: 'overflow-hidden flex flex-auto cursor-pointer',
|
||||
labelContainer: {
|
||||
class: 'overflow-hidden flex flex-auto cursor-pointer'
|
||||
},
|
||||
label: ({ props }) => ({
|
||||
class: [
|
||||
'block overflow-hidden whitespace-nowrap cursor-pointer overflow-ellipsis',
|
||||
'block overflow-hidden whitespace-nowrap cursor-pointer text-ellipsis',
|
||||
'text-gray-800 dark:text-white/80',
|
||||
'p-3 transition duration-200',
|
||||
{
|
||||
|
@ -51,7 +53,9 @@ export default {
|
|||
token: {
|
||||
class: ['py-1 px-2 mr-2 bg-gray-300 dark:bg-gray-700 text-gray-700 dark:text-white/80 rounded-full', 'cursor-default inline-flex items-center']
|
||||
},
|
||||
removeTokenIcon: 'ml-2',
|
||||
removeTokenIcon: {
|
||||
class: 'ml-2'
|
||||
},
|
||||
trigger: {
|
||||
class: ['flex items-center justify-center shrink-0', 'bg-transparent text-gray-600 dark:text-white/70 w-12 rounded-tr-lg rounded-br-lg']
|
||||
},
|
||||
|
@ -75,7 +79,9 @@ export default {
|
|||
}
|
||||
]
|
||||
}),
|
||||
headercheckboxicon: 'w-4 h-4 transition-all duration-200 text-white text-base',
|
||||
headercheckboxicon: {
|
||||
class: 'w-4 h-4 transition-all duration-200 text-white text-base'
|
||||
},
|
||||
closeButton: {
|
||||
class: [
|
||||
'flex items-center justify-center overflow-hidden relative',
|
||||
|
@ -84,21 +90,23 @@ export default {
|
|||
'focus:outline-none focus:outline-offset-0 focus:shadow-[0_0_0_0.2rem_rgba(191,219,254,1)] dark:focus:shadow-[0_0_0_0.2rem_rgba(147,197,253,0.5)]'
|
||||
]
|
||||
},
|
||||
closeButtonIcon: 'w-4 h-4 inline-block',
|
||||
closeButtonIcon: {
|
||||
class: 'w-4 h-4 inline-block'
|
||||
},
|
||||
wrapper: {
|
||||
class: ['max-h-[200px] overflow-auto', 'bg-white text-gray-700 border-0 rounded-md shadow-lg', 'dark:bg-gray-900 dark:text-white/80']
|
||||
},
|
||||
list: 'py-3 list-none m-0',
|
||||
list: {
|
||||
class: 'py-3 list-none m-0'
|
||||
},
|
||||
item: ({ context }) => ({
|
||||
class: [
|
||||
'cursor-pointer font-normal overflow-hidden relative whitespace-nowrap',
|
||||
'm-0 p-3 border-0 transition-shadow duration-200 rounded-none',
|
||||
'dark:text-white/80 dark:hover:bg-gray-800',
|
||||
'hover:text-gray-700 hover:bg-gray-200',
|
||||
{
|
||||
'text-gray-700': !context.focused && !context.selected,
|
||||
'bg-gray-300 text-gray-700 dark:text-white/80 dark:bg-gray-800/90': context.focused && !context.selected,
|
||||
'bg-blue-400 text-blue-700 dark:bg-blue-400 dark:text-white/80': context.focused && context.selected,
|
||||
'text-gray-700 hover:text-gray-700 hover:bg-gray-200 dark:text-white/80 dark:hover:bg-gray-800': !context.focused && !context.selected,
|
||||
'bg-gray-300 text-gray-700 dark:text-white/80 dark:bg-gray-800/90 hover:text-gray-700 hover:bg-gray-200 dark:text-white/80 dark:hover:bg-gray-800': context.focused && !context.selected,
|
||||
'bg-blue-100 text-blue-700 dark:bg-blue-400 dark:text-white/80': context.focused && context.selected,
|
||||
'bg-blue-50 text-blue-700 dark:bg-blue-300 dark:text-white/80': !context.focused && context.selected
|
||||
}
|
||||
]
|
||||
|
@ -117,11 +125,15 @@ export default {
|
|||
}
|
||||
]
|
||||
}),
|
||||
checkboxicon: 'w-4 h-4 transition-all duration-200 text-white text-base',
|
||||
checkboxicon: {
|
||||
class: 'w-4 h-4 transition-all duration-200 text-white text-base'
|
||||
},
|
||||
itemgroup: {
|
||||
class: ['m-0 p-3 text-gray-800 bg-white font-bold', 'dark:bg-gray-900 dark:text-white/80', 'cursor-auto']
|
||||
},
|
||||
filtercontainer: 'relative',
|
||||
filtercontainer: {
|
||||
class: 'relative'
|
||||
},
|
||||
filterinput: {
|
||||
class: [
|
||||
'pr-7 -mr-7',
|
||||
|
@ -131,8 +143,12 @@ export default {
|
|||
'hover:border-blue-500 focus:outline-none focus:outline-offset-0 focus:shadow-[0_0_0_0.2rem_rgba(191,219,254,1)] dark:focus:shadow-[0_0_0_0.2rem_rgba(147,197,253,0.5)]'
|
||||
]
|
||||
},
|
||||
filtericon: '-mt-2 absolute top-1/2',
|
||||
clearicon: 'text-gray-500 right-12 -mt-2 absolute top-1/2',
|
||||
filtericon: {
|
||||
class: '-mt-2 absolute top-1/2'
|
||||
},
|
||||
clearicon: {
|
||||
class: 'text-gray-500 right-12 -mt-2 absolute top-1/2'
|
||||
},
|
||||
transition: TRANSITIONS.overlay
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue