Merge pull request #14792 from overleaf/rd-report-remove-li-element

Accessibility - use CSS instead of empty list item for spacing in the filetree

GitOrigin-RevId: 2ee330dc867c223394afa9ccce1017a79c7112c1

services/web/frontend/js/features/file-tree/components/file-tree-root.js

@@ -77,9 +77,7 @@ function FileTreeRootFolder() {
         dropRef={dropRef}
         isOver={isOver}
         dataTestId="file-tree-list-root"
-      >
-        <li className="bottom-buffer" />
-      </FileTreeFolderList>
+      />
     </>
   )
 }

services/web/frontend/js/features/history/components/history-file-tree.tsx

@@ -30,8 +30,6 @@ export default function HistoryFileTree() {
       folders={mappedFileTree.folders}
       docs={mappedFileTree.docs ?? []}
       rootClassName="history-file-tree-list"
-    >
-      <li className="bottom-buffer" />
-    </HistoryFileTreeFolderList>
+    />
   )
 }

services/web/frontend/stylesheets/app/editor/file-tree.less

@@ -96,7 +96,9 @@
       margin-left: 22px;
     }
 
-    li.bottom-buffer {
+    &::after {
+      content: '';
+      display: block;
       min-height: @line-height-computed;
     }
 

services/web/frontend/stylesheets/app/editor/history-react.less

@@ -432,7 +432,9 @@ history-root {
       margin-left: 22px;
     }
 
-    li.bottom-buffer {
+    &::after {
+      content: '';
+      display: block;
       min-height: @line-height-computed;
     }