feat(pdf-marking): integrates layouts

This commit is contained in:
eugene 2024-08-14 12:36:51 +03:00
parent 50c8f2b2d0
commit 64dbd7d479
3 changed files with 31 additions and 25 deletions

View File

@ -13,6 +13,7 @@ import signPageStyles from '../../pages/sign/style.module.scss'
import styles from './style.module.scss' import styles from './style.module.scss'
import { CurrentUserFile } from '../../types/file.ts' import { CurrentUserFile } from '../../types/file.ts'
import FileList from '../FileList' import FileList from '../FileList'
import { StickySideColumns } from '../../layouts/StickySideColumns.tsx'
interface PdfMarkingProps { interface PdfMarkingProps {
files: CurrentUserFile[] files: CurrentUserFile[]
@ -112,30 +113,35 @@ const PdfMarking = (props: PdfMarkingProps) => {
return ( return (
<> <>
<Container className={signPageStyles.container}> <Container className={signPageStyles.container}>
<div className={styles.container}> <StickySideColumns
<div> left={
{currentFile !== null && ( <div>
<FileList {currentFile !== null && (
files={files} <FileList
currentFile={currentFile} files={files}
setCurrentFile={setCurrentFile} currentFile={currentFile}
handleDownload={handleDownload} setCurrentFile={setCurrentFile}
/> handleDownload={handleDownload}
/>
)}
</div>
}
>
<div className={styles.container}>
{currentUserMarks?.length > 0 && (
<div className={styles.pdfView}>
<PdfView
currentFile={currentFile}
files={files}
handleMarkClick={handleMarkClick}
selectedMarkValue={selectedMarkValue}
selectedMark={selectedMark}
currentUserMarks={currentUserMarks}
/>
</div>
)} )}
</div> </div>
{currentUserMarks?.length > 0 && ( </StickySideColumns>
<div className={styles.pdfView}>
<PdfView
currentFile={currentFile}
files={files}
handleMarkClick={handleMarkClick}
selectedMarkValue={selectedMarkValue}
selectedMark={selectedMark}
currentUserMarks={currentUserMarks}
/>
</div>
)}
</div>
{selectedMark !== null && ( {selectedMark !== null && (
<MarkFormField <MarkFormField
handleSubmit={handleSubmit} handleSubmit={handleSubmit}

View File

@ -24,6 +24,6 @@
} }
.content { .content {
max-width: 550px; max-width: 550px;
width: 100%; width: 550px;
margin: 0 auto; margin: 0 auto;
} }

View File

@ -2,8 +2,8 @@
.container { .container {
color: $text-color; color: $text-color;
width: 550px; //width: 550px;
max-width: 550px; //max-width: 550px;
.inputBlock { .inputBlock {
position: relative; position: relative;