fix focus styles

This commit is contained in:
Rodrigo Antinarelli 2020-06-30 16:05:18 -03:00
parent 90ca52585a
commit 520e1c0774
3 changed files with 4 additions and 4 deletions

View File

@ -34,7 +34,7 @@ const Thumbnail = ({
ref={drag} ref={drag}
className={classnames( className={classnames(
className, className,
'flex flex-col flex-1 px-3 mb-8 cursor-pointer outline-none' 'flex flex-col flex-1 px-3 mb-8 cursor-pointer outline-none group'
)} )}
onDoubleClick={onClick} onDoubleClick={onClick}
role="button" role="button"
@ -45,7 +45,7 @@ const Thumbnail = ({
'flex flex-1 items-center justify-center rounded-md bg-black text-base text-white overflow-hidden mb-2 min-h-32', 'flex flex-1 items-center justify-center rounded-md bg-black text-base text-white overflow-hidden mb-2 min-h-32',
isActive isActive
? 'border-2 border-primary-light' ? 'border-2 border-primary-light'
: 'border border-secondary-light hover:border-blue-300' : 'border border-secondary-light group-focus:border-blue-300 hover:border-blue-300'
)} )}
> >
{imageSrc ? ( {imageSrc ? (

View File

@ -24,7 +24,7 @@ const ThumbnailNoImage = ({
<div <div
ref={drag} ref={drag}
className={classnames( className={classnames(
'flex flex-row flex-1 px-4 py-3 cursor-pointer outline-none border-transparent hover:border-blue-300 rounded', 'flex flex-row flex-1 px-4 py-3 cursor-pointer outline-none border-transparent hover:border-blue-300 focus:border-blue-300 rounded',
isActive ? 'border-2 border-primary-light' : 'border' isActive ? 'border-2 border-primary-light' : 'border'
)} )}
onDoubleClick={onClick} onDoubleClick={onClick}

View File

@ -717,7 +717,7 @@ module.exports = {
backgroundRepeat: ['responsive'], backgroundRepeat: ['responsive'],
backgroundSize: ['responsive'], backgroundSize: ['responsive'],
borderCollapse: ['responsive'], borderCollapse: ['responsive'],
borderColor: ['responsive', 'hover', 'focus', 'active'], borderColor: ['responsive', 'hover', 'focus', 'active', 'group-focus'],
borderRadius: ['responsive', 'focus', 'first', 'last'], borderRadius: ['responsive', 'focus', 'first', 'last'],
borderStyle: ['responsive', 'focus'], borderStyle: ['responsive', 'focus'],
borderWidth: ['responsive', 'focus', 'first', 'last'], borderWidth: ['responsive', 'focus', 'first', 'last'],