diff --git a/app/src/App.css b/app/src/App.css index 66fb95fe..b5a84cc6 100644 --- a/app/src/App.css +++ b/app/src/App.css @@ -328,3 +328,20 @@ table.ratio-table td.min-width { background-size: 200% 100%; animation: skeleton-shimmer 1.5s infinite; } + +/* Sticky footer for file browser */ +.sticky-footer { + position: fixed; + bottom: 0; + left: 0; + right: 0; + padding: 0.5em 1em; + background-color: #f9fafb; + border-top: 1px solid rgba(34, 36, 38, 0.15); + z-index: 100; +} + +.sticky-footer.inverted { + background-color: #1b1c1d; + border-top: 1px solid rgba(255, 255, 255, 0.1); +} diff --git a/app/src/components/FileBrowser.js b/app/src/components/FileBrowser.js index 21fab418..a34530cc 100644 --- a/app/src/components/FileBrowser.js +++ b/app/src/components/FileBrowser.js @@ -7,7 +7,6 @@ import { PlaceholderLine, TableBody, TableCell, - TableFooter, TableHeader, TableHeaderCell, TableRow @@ -20,7 +19,7 @@ import {SortableTable} from "./SortableTable"; import {useBrowseFiles, useMediaDirectory, useWROLMode} from "../hooks/customHooks"; import {FileRowTagIcon, FilesRefreshButton} from "./Files"; import {FilePreviewContext} from "./FilePreview"; -import {SettingsContext} from "../contexts/contexts"; +import {SettingsContext, ThemeContext} from "../contexts/contexts"; import {BulkTagModal} from "./BulkTagModal"; function depthIndentation(path) { @@ -146,6 +145,7 @@ export function FileBrowser() { const [isDirectoryIgnored, setIsDirectoryIgnored] = React.useState(false); const {settings, fetchSettings} = React.useContext(SettingsContext); + const {inverted} = React.useContext(ThemeContext); const selectedPathsCount = selectedPaths ? selectedPaths.length : 0; @@ -217,88 +217,85 @@ export function FileBrowser() { } } - const footer = - - - - - - setMakeDirectoryOpen(false)} - parent={selectedPaths.length ? selectedPaths[0] : null} - onSubmit={handleMakeDirectory} - /> - + setMakeDirectoryOpen(false)} + parent={selectedPaths.length ? selectedPaths[0] : null} + onSubmit={handleMakeDirectory} + /> + -} \ No newline at end of file +}