fix focus styles

platform/ui/src/components/Thumbnail/Thumbnail.jsx

@@ -34,7 +34,7 @@ const Thumbnail = ({
       ref={drag}
       className={classnames(
         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}
       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',
           isActive
             ? '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 ? (

platform/ui/src/components/ThumbnailNoImage/ThumbnailNoImage.jsx

@@ -24,7 +24,7 @@ const ThumbnailNoImage = ({
     <div
       ref={drag}
       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'
       )}
       onDoubleClick={onClick}