Fix issue with VisuallyHidden checkbox interactions in table (#6334)

* resolve CHROME BUG

* changeset

.changeset/dirty-cheetahs-guess.md

@@ -0,0 +1,5 @@
+---
+'@keystone-next/keystone': patch
+---
+
+Resolved bug with visually hidden elements in ListView checkboxes expanding to fill the whole body on click of elements near the bottom of the screen.

packages/keystone/src/___internal-do-not-use-will-break-in-patch/admin-ui/pages/ListPage/index.tsx

@@ -244,7 +244,6 @@ const ListPage = ({ listKey }: ListPageProps) => {
 
   const theme = useTheme();
   const showCreate = !(metaQuery.data?.keystone.adminMeta.list?.hideCreate ?? true) || null;
-
   return (
     <PageContainer header={<ListPageHeader listKey={listKey} />}>
       {metaQuery.error ? (
@@ -523,7 +522,6 @@ function ListTable({
   const { query } = useRouter();
   const shouldShowLinkIcon =
     !list.fields[selectedFields.keys().next().value].views.Cell.supportsLinkTo;
-
   return (
     <Box paddingBottom="xlarge">
       <TableContainer>
@@ -614,7 +612,7 @@ function ListTable({
                       minHeight: 38,
                       alignItems: 'center',
                       justifyContent: 'start',
-                      // cursor: 'pointer',
+                      position: 'relative',
                     }}
                   >
                     <CheckboxControl
@@ -742,6 +740,7 @@ const TableHeaderCell = (props: HTMLAttributes<HTMLElement>) => {
         padding: spacing.small,
         textAlign: 'left',
         position: 'sticky',
+        zIndex: 1,
         top: 0,
       }}
       {...props}