diff --git a/src/components/DrawPDFFields/style.module.scss b/src/components/DrawPDFFields/style.module.scss index f1993eb..1b13c31 100644 --- a/src/components/DrawPDFFields/style.module.scss +++ b/src/components/DrawPDFFields/style.module.scss @@ -50,6 +50,7 @@ .pdfImageWrapper { position: relative; user-select: none; + margin-bottom: 10px; &.drawing { cursor: crosshair; diff --git a/src/components/FileList/index.tsx b/src/components/FileList/index.tsx index ba69332..f1fdcd8 100644 --- a/src/components/FileList/index.tsx +++ b/src/components/FileList/index.tsx @@ -17,20 +17,21 @@ const FileList = ({ }: FileListProps) => { const isActive = (file: CurrentUserFile) => file.id === currentFile.id return ( -
-
- +
+
+
    + {files.map((file: CurrentUserFile) => ( +
  • setCurrentFile(file)} + > + {file.id} + {file.filename} +
  • + ))} +
+
diff --git a/src/components/FileList/style.module.scss b/src/components/FileList/style.module.scss index 4103897..b754bdb 100644 --- a/src/components/FileList/style.module.scss +++ b/src/components/FileList/style.module.scss @@ -7,6 +7,29 @@ grid-gap: 0px; } +.filesPageContainer { + width: 100%; + display: grid; + grid-template-columns: 0.75fr 1.5fr 0.75fr; + grid-gap: 30px; + flex-grow: 1; +} + +ul { + list-style-type: none; /* Removes bullet points */ + margin: 0; /* Removes default margin */ + padding: 0; /* Removes default padding */ +} + + +.wrap { + position: sticky; + top: 15px; + display: flex; + flex-direction: column; + grid-gap: 15px; +} + .files { display: flex; flex-direction: column; @@ -33,6 +56,10 @@ cursor: grab; } +.wrap { + margin-top: 5px; +} + .fileItem { transition: ease 0.2s; display: flex; @@ -49,6 +76,7 @@ font-size: 16px; font-weight: 500; + &.active { background: #4c82a3; color: white; diff --git a/src/components/PDFView/PdfPageItem.tsx b/src/components/PDFView/PdfPageItem.tsx index 01ab512..a670f2f 100644 --- a/src/components/PDFView/PdfPageItem.tsx +++ b/src/components/PDFView/PdfPageItem.tsx @@ -34,9 +34,7 @@ const PdfPageItem = ({
diff --git a/src/components/PDFView/index.tsx b/src/components/PDFView/index.tsx index 2936f59..c032a3c 100644 --- a/src/components/PDFView/index.tsx +++ b/src/components/PDFView/index.tsx @@ -42,9 +42,9 @@ const PdfView = ({ ) } const isNotLastPdfFile = (index: number, files: CurrentUserFile[]): boolean => - !(index !== files.length - 1) + index !== files.length - 1 return ( - + <> {files.map((currentUserFile, index, arr) => { const { hash, pdfFile, filename, id } = currentUserFile if (!hash) return @@ -65,7 +65,7 @@ const PdfView = ({
) })} - + ) } diff --git a/src/components/PDFView/style.module.scss b/src/components/PDFView/style.module.scss index 3ebbc85..5029747 100644 --- a/src/components/PDFView/style.module.scss +++ b/src/components/PDFView/style.module.scss @@ -19,6 +19,7 @@ display: flex; width: 100%; flex-direction: column; + } .pdfView { @@ -26,4 +27,5 @@ flex-direction: column; width: 100%; height: 100%; + gap: 10px; }