Apply the dedicated styling modifier to the "Select all" row in the Stage Files modal

Author: robertpiosik

packages/ui/src/components/editor/panel/modals/StageFilesModal/StageFilesModal.module.scss

@@ -19,6 +19,16 @@
       }
     }
 
+    &--select-all {
+      &:hover {
+        background-color: transparent;
+      }
+
+      strong:hover {
+        text-decoration: underline;
+      }
+    }
+
     &__details {
       flex: 1;
       overflow: hidden;

packages/ui/src/components/editor/panel/modals/StageFilesModal/StageFilesModal.tsx

@@ -4,6 +4,7 @@ import { Button } from '../../Button'
 import { Modal } from '../Modal'
 import { Checkbox } from '../../../common/Checkbox'
 import { IconButton } from '../../IconButton/IconButton'
+import cn from 'classnames'
 
 type Props = {
   files: string[]
@@ -44,7 +45,12 @@ export const StageFilesModal: React.FC<Props> = (props) => {
       content_max_height="calc(100vh - 150px)"
       content_slot={
         <div className={styles.files}>
-          <label className={styles.files__item}>
+          <label
+            className={cn(
+              styles.files__item,
+              styles['files__item--select-all']
+            )}
+          >
             <Checkbox
               checked={all_selected}
               on_change={handle_toggle_select_all}