4nk/lecoffre-front
4
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

error message on deposited documents

Browse Source
This commit is contained in:
Hugo Lextrait 2023-05-11 19:01:22 +02:00
parent ff66a61887
commit c3dd1115dc
2 changed files with 85 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

152
src/front/Components/DesignSystem/DepositDocument/classes.module.scss
View File

@ -1,100 +1,104 @@
.root {
padding: 24px;
background-color: var(--white);
border: 1px dashed #e7e7e7;
.container {
height: fit-content;
&[data-drag-over="true"] {
border: 1px dashed var(--grey);
}
.root {
padding: 24px;
background-color: var(--white);
border: 1px dashed #e7e7e7;
&.validated {
border: 1px dashed var(--green-flash);
}
height: fit-content;
.top-container {
display: flex;
align-items: center;
.left {
margin-right: 28px;
&[data-drag-over="true"] {
border: 1px dashed var(--grey);
}
.separator {
background-color: #939393;
width: 1px;
align-self: stretch;
&.validated {
border: 1px dashed var(--green-flash);
}
.right {
margin-left: 18px;
.top-container {
display: flex;
align-items: center;
.validated {
color: var(--green-flash);
.left {
margin-right: 28px;
}
.refused-button {
font-size: 14px;
color: var(--re-hover);
margin-left: 8px;
.separator {
background-color: #939393;
width: 1px;
align-self: stretch;
}
.title {
.right {
margin-left: 18px;
.validated {
color: var(--green-flash);
}
.refused-button {
font-size: 14px;
color: var(--re-hover);
margin-left: 8px;
}
.title {
display: flex;
align-items: center;
gap: 8px;
}
}
}
.documents-container {
display: flex;
flex-direction: column;
gap: 16px;
margin-top: 16px;
.file-container {
display: flex;
align-items: center;
gap: 8px;
justify-content: space-between;
.left-part {
display: flex;
align-items: center;
gap: 8px;
}
.cross {
cursor: pointer;
}
}
}
.bottom-container {
margin-top: 16px;
.add-button {
.add-document {
display: flex;
align-items: center;
gap: 14px;
}
}
}
.text {
margin-bottom: 12px;
}
}
.documents-container {
.modal-content {
display: flex;
flex-direction: column;
gap: 16px;
margin-top: 16px;
.file-container {
display: flex;
align-items: center;
justify-content: space-between;
.left-part {
display: flex;
align-items: center;
gap: 8px;
}
.cross {
cursor: pointer;
}
}
}
.bottom-container {
margin-top: 16px;
.add-button {
.add-document {
display: flex;
align-items: center;
gap: 14px;
}
}
}
.text {
margin-bottom: 12px;
.error-message {
color: var(--red-flash);
margin-top: 8px;
}
}
.modal-content {
display: flex;
flex-direction: column;
gap: 16px;
}
.error-message {
color: var(--red-flash);
margin-top: 8px;
}

10
src/front/Components/DesignSystem/DepositDocument/index.tsx
View File

@ -66,7 +66,7 @@ export default class DepositDocument extends React.Component<IProps, IState> {
public override render(): JSX.Element {
return (
<>
<div className={classes["container"]}>
<div
className={classNames(
classes["root"],
@ -158,8 +158,12 @@ export default class DepositDocument extends React.Component<IProps, IState> {
</div>
</Confirm>
</div>
{<div></div>}
</>
{this.props.document.document_status === EDocumentStatus.REFUSED && (
<Typography typo={ITypo.CAPTION_14} className={classes["error-message"]}>
Ce document n’est pas conforme. Veuillez le déposer à nouveau.
</Typography>
)}
</div>
);
}