diff --git a/packages/sanity-studio/src/plugins/navigator/components/List.tsx b/packages/sanity-studio/src/plugins/navigator/components/List.tsx
index 64267015..97103a46 100644
--- a/packages/sanity-studio/src/plugins/navigator/components/List.tsx
+++ b/packages/sanity-studio/src/plugins/navigator/components/List.tsx
@@ -30,11 +30,11 @@ const ListWrapper = styled(Box)`
border: 2px solid transparent;
padding: 2px;
border-radius: 8px;
- width: 100%;
height: 88vh;
overflow-y: auto;
margin: 0;
display: flex;
+ gap: 0.25rem;
flex-direction: column;
`;
@@ -174,39 +174,25 @@ const List = ({ loading }: { loading: boolean }) => {
aria-label="Pages and folders"
aria-activedescendant={`item-${activeDescendant}`}
>
-
- {virtualizer.getVirtualItems().map((virtualChild) => {
- const item = items[virtualChild.index];
- return (
-
- );
- })}
-
+ {virtualizer.getVirtualItems().map((virtualChild) => {
+ const item = items[virtualChild.index];
+ return (
+
+ );
+ })}
);
};
-const ListItem = ({
- item,
- active,
- setActive,
- idx,
- virtualChild,
-}: ListItemProps) => {
+const ListItem = ({ item, active, setActive, idx }: ListItemProps) => {
const { defaultLocaleId, setCurrentDir, currentDir } = useNavigator();
const innerRef = useRef(null);
const listItemId = `item-${idx}`;
@@ -278,14 +264,6 @@ const ListItem = ({
aria-selected={listItemId === active}
currentScheme={scheme}
isPreviewed={previewed}
- style={{
- position: "absolute",
- top: 0,
- left: 0,
- width: "100%",
- height: `${virtualChild?.size}px`,
- transform: `translateY(${virtualChild?.start}px)`,
- }}
>
) : (
<>{!isLoading ? fallback : null}>