change file-info modal window styles
This commit is contained in:
@@ -3494,26 +3494,6 @@
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
|
||||
&-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 16px 20px;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
color: white;
|
||||
}
|
||||
|
||||
&-title {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
&-content {
|
||||
padding: 20px;
|
||||
max-height: calc(90vh - 80px);
|
||||
@@ -3582,7 +3562,8 @@
|
||||
}
|
||||
|
||||
.info-header {
|
||||
background: #f8fafc;
|
||||
background: linear-gradient(0deg, #6366f1 50%, #8b5cf6 130%);
|
||||
color: white;
|
||||
padding: 16px 20px;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
|
||||
@@ -3594,11 +3575,9 @@
|
||||
}
|
||||
|
||||
.info-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
padding: 12px 20px;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
@@ -3611,9 +3590,9 @@
|
||||
.info-value {
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
text-align: right;
|
||||
text-align: left;
|
||||
word-break: break-word;
|
||||
max-width: 150px;
|
||||
/* max-width: 150px; */
|
||||
}
|
||||
|
||||
.status-badges {
|
||||
|
||||
@@ -7,13 +7,6 @@ export function FileInfoModalWindow({ fileInfo, setWindowClose, setWindowChildre
|
||||
|
||||
return (
|
||||
<div className="modal-window-view-file">
|
||||
<div className="modal-window-view-file-header">
|
||||
<div
|
||||
className="modal-window-view-file-title"
|
||||
>
|
||||
{fileInfo.fileName ? fileInfo.fileName : '-'}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="modal-window-view-file-content"
|
||||
>
|
||||
|
||||
@@ -6,8 +6,6 @@ import { useQueryClient } from '@tanstack/react-query';
|
||||
import { Pagination } from '@/app/components/Pagination';
|
||||
import { useTranslations } from 'next-intl';
|
||||
import { AllowedExtensions } from '@/app/ui/search/section-search-file';
|
||||
import { getFileType } from '@/app/lib/getFileType';
|
||||
|
||||
export interface SearchItem {
|
||||
url: string,
|
||||
pageTitle: string,
|
||||
|
||||
@@ -49,13 +49,6 @@ export function SearchedUserFilesList({ list, allowedExtensions }: { list: FileI
|
||||
<div
|
||||
className="modal-window-view-file"
|
||||
>
|
||||
<div className="modal-window-view-file-header">
|
||||
<div
|
||||
className="modal-window-view-file-title"
|
||||
>
|
||||
{e.originalFileName}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="modal-window-view-file-content"
|
||||
>
|
||||
@@ -77,30 +70,36 @@ export function SearchedUserFilesList({ list, allowedExtensions }: { list: FileI
|
||||
<h4>{t('file-information')}</h4>
|
||||
</div>
|
||||
<div className="info-item">
|
||||
<span className="info-label">{t('id-in-the-system')}:</span>
|
||||
<span className="info-value">
|
||||
{e.supportId ? e.supportId : '#'}
|
||||
</span>
|
||||
<div className="info-label">{t('file-name')}:</div>
|
||||
<div className="info-value">
|
||||
{e.originalFileName ? e.originalFileName : '#'}
|
||||
</div>
|
||||
</div>
|
||||
<div className="info-item">
|
||||
<span className="info-label">{t('upload-date')}:</span>
|
||||
<span className="info-value">
|
||||
<div className="info-label">{t('id-in-the-system')}:</div>
|
||||
<div className="info-value">
|
||||
{e.supportId ? e.supportId : '#'}
|
||||
</div>
|
||||
</div>
|
||||
<div className="info-item">
|
||||
<div className="info-label">{t('upload-date')}:</div>
|
||||
<div className="info-value">
|
||||
{e.uploadDate ? formatDate(e.uploadDate) : '#'}
|
||||
<br />
|
||||
{e.uploadDate ? formatDateTime(e.uploadDate) : '#'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="info-item">
|
||||
<span className="info-label">{t('file-size')}:</span>
|
||||
<span className="info-value">
|
||||
<div className="info-label">{t('file-size')}:</div>
|
||||
<div className="info-value">
|
||||
{convertBytes(e.fileSize)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="info-item">
|
||||
<span className="info-label">{t('protection-status')}:</span>
|
||||
<span className="info-value">
|
||||
<div className="info-label">{t('protection-status')}:</div>
|
||||
<div className="info-value">
|
||||
{e.status ? t(e.status) : '#'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user