frontdev/no-copy-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

change colors and styles for complaint/case form

Browse Source
This commit is contained in:
smanylov
2026-04-17 18:23:13 +07:00
parent c7939b8923
commit 1b4ad64ef6
6 changed files with 100 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/styles/violation-details.scss
+55 -36
View File
@@ -142,11 +142,11 @@
}
.btn-primary-small {
border: 2px solid v.$status-in-work;
color: v.$status-in-work;
border: 2px solid v.$status-showed;
color: v.$status-showed;
&:hover {
background: v.$status-in-work;
background: v.$status-showed;
color: white;
}
}
@@ -292,6 +292,15 @@
display: flex;
justify-content: space-between;
align-items: center;
.pagination-controls-pages button,
.pagination-controls .arrow {
color: v.$text-p;
&.current {
background-color: #e9ecef;
}
}
}
.source-status {
@@ -823,21 +832,42 @@
}
}
.note-form-flex {
display: flex;
gap: 10px;
}
.note-case-label {
font-weight: 600;
display: block;
background: #e9ecef;
color: v.$text-p;
padding: 5px 10px;
}
.note-case-input,
.note-textarea {
width: 100%;
min-height: 80px;
padding: 10px 20px;
border: 1px solid v.$border-color-1;
border-radius: 8px;
font-family: inherit;
resize: vertical;
background: v.$white;
box-sizing: border-box;
background: #f8fafc;
padding: 10px 20px;
border-radius: 0 0 8px 8px;
&:hover {
background: v.$bg-light;
}
&:focus {
outline: none;
box-shadow: 2px 2px 4px v.$shadow-1;
}
}
.note-textarea {
width: 100%;
min-height: 80px;
font-family: inherit;
resize: none;
vertical-align: top;
&-wrapper {
display: flex;
@@ -846,43 +876,32 @@
}
}
.note-form-flex {
display: flex;
gap: 10px;
margin-bottom: 10px;
}
.note-case-input {
border: 1px solid v.$border-color-1;
border-radius: 8px;
box-sizing: border-box;
background: #f8fafc;
padding: 10px 20px;
&::-webkit-outer-spin-button,
&::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
&:focus {
outline: none;
box-shadow: 2px 2px 4px v.$shadow-1;
}
&::placeholder {
font-size: 12px;
}
}
.note-case-label {
font-weight: 600;
}
.note-form-group {
border: 1px solid #e9ecef;
box-sizing: border-box;
padding: 0px;
border-radius: 8px;
margin-bottom: 10px;
overflow: hidden;
input {
display: block;
}
input[name="amount"] {
&::placeholder {
font-size: 12px;
}
}
}
}
src/app/ui/file-page/violation-table/case-complaint.tsx
+19 -13
View File
@@ -86,20 +86,26 @@ export default function CaseComplaint({ selectedViolation, updateStatusHandler }
<div className="note-form">
<form action={formAction}>
<input type="hidden" name="violationId" value={localViolation.id} />
<label
className="note-case-label"
htmlFor="note"
<section
className="note-form-group"
>
{t('text-of-the-complaint')}
</label>
<textarea
name="note"
className="note-textarea"
placeholder={`${t('text-area-error-fill-complaint-text')}...`}
value={noteText}
onChange={(e) => setNoteText(e.target.value)}
>
</textarea>
<label
className="note-case-label"
htmlFor="note"
>
{t('text-of-the-complaint')}
</label>
<textarea
name="note"
className="note-textarea"
placeholder={`${t('text-area-error-fill-complaint-text')}...`}
value={noteText}
onChange={(e) => setNoteText(e.target.value)}
>
</textarea>
</section>
<div
className="button-actions"
>
src/app/ui/file-page/violation-table/case-legal.tsx
+4 -3
View File
@@ -86,8 +86,7 @@ export default function CaseViolation({ selectedViolation, updateStatusHandler }
className="note-case-label"
htmlFor="caseTitle"
>
{/* {t('case-name')} */}
Название претензии
{t('case-name')}
</label>
<input
type="text"
@@ -147,7 +146,7 @@ export default function CaseViolation({ selectedViolation, updateStatusHandler }
</div>
<section
className="note-textarea-wrapper"
className="note-form-group"
>
<label
className="note-case-label"
@@ -155,12 +154,14 @@ export default function CaseViolation({ selectedViolation, updateStatusHandler }
>
{t('text-of-the-case')}
</label>
<textarea
name="note"
className="note-textarea"
placeholder={t('fill-text-of-the-case') + '...'}
>
</textarea>
{state?.errorMessage?.textArea && (
<p
className="text-sm text-red-500"
src/app/ui/file-page/violation-table/file-page-violation-info-tabs.tsx
+10 -6
View File
@@ -6,6 +6,7 @@ import { ViolationFileDetail } from '@/app/hooks/react-query/useFileViolations';
import { MatchStatus } from '@/app/actions/violationActions';
import { useEffect, useState } from 'react';
import { useUserProfile } from '@/app/hooks/react-query/useUserDataInfo';
import { useTranslations } from 'next-intl';
type UpdateStatusHandler = (id: number, status: MatchStatus) => Promise<boolean>;
@@ -14,6 +15,7 @@ const STATUSES_IN_WORK = ['COMPLAINT_IN_WORK', 'LEGAL_IN_WORK', 'COMPLAINT_AND_L
type TabType = 'complaint' | 'legal'
export default function FilePageViolationInfoTabs({ selectedViolation, updateStatusHandler }: { selectedViolation: ViolationFileDetail, updateStatusHandler: UpdateStatusHandler }) {
const t = useTranslations('Global');
const [activeTab, setActiveTab] = useState<TabType>('complaint');
const [showTabs, setShowTabs] = useState(false);
const isInWork = STATUSES_IN_WORK.includes(selectedViolation.status);
@@ -61,7 +63,9 @@ export default function FilePageViolationInfoTabs({ selectedViolation, updateSta
if (!isInWork && !showTabs) {
return (
<div className="violation-info-choice">
<h4>Вы можете</h4>
<h4>
{t('you-can')}
</h4>
<div className="violation-info-choice-buttons">
<button
className="btn btn-primary"
@@ -70,11 +74,11 @@ export default function FilePageViolationInfoTabs({ selectedViolation, updateSta
setActiveTab('complaint');
}}
>
Подать жалобу
{t('file-a-complaint')}
</button>
<span>
или
{t('or')}
</span>
<button
@@ -84,7 +88,7 @@ export default function FilePageViolationInfoTabs({ selectedViolation, updateSta
setActiveTab('legal');
}}
>
Подать притензию
{t('file-a-claim')}
</button>
</div>
</div>
@@ -98,13 +102,13 @@ export default function FilePageViolationInfoTabs({ selectedViolation, updateSta
className={`btn-s btn-primary ${activeTab === 'complaint' ? 'active' : ''} ${localViolation.status === 'COMPLAINT_IN_WORK' || localViolation.status === 'COMPLAINT_AND_LEGAL_IN_WORK' ? '' : 'action'}`}
onClick={() => setActiveTab('complaint')}
>
{localViolation.status === 'COMPLAINT_IN_WORK' || localViolation.status === 'COMPLAINT_AND_LEGAL_IN_WORK' ? 'Жалоба' : 'Подать жалобу'}
{localViolation.status === 'COMPLAINT_IN_WORK' || localViolation.status === 'COMPLAINT_AND_LEGAL_IN_WORK' ? t('complaint') : t('file-a-complaint')}
</button>
<button
className={`btn-s btn-primary ${activeTab === 'legal' ? 'active' : ''} ${localViolation.status === 'LEGAL_IN_WORK' || localViolation.status === 'COMPLAINT_AND_LEGAL_IN_WORK' ? '' : 'action'}`}
onClick={() => setActiveTab('legal')}
>
{localViolation.status === 'LEGAL_IN_WORK' || localViolation.status === 'COMPLAINT_AND_LEGAL_IN_WORK' ? 'Претензия' : 'Подать претензию'}
{localViolation.status === 'LEGAL_IN_WORK' || localViolation.status === 'COMPLAINT_AND_LEGAL_IN_WORK' ? t('case') : t('file-a-claim')}
</button>
</div>
<div className="violation-info-content">
src/i18n/messages/en.json
+6 -1
View File
@@ -409,6 +409,7 @@
"type": "Type",
"lawyer": "Lawyer",
"not-assigned": "Not assigned",
"case": "Case",
"create-case": "Create case",
"case-name": "Case name",
"amount-of-damage": "Amount of damage",
@@ -424,7 +425,11 @@
"under-moderation": "Under moderation",
"full-link": "Full link",
"follow-the-link": "Follow the link",
"date-of-discovery": "Date of discovery"
"date-of-discovery": "Date of discovery",
"file-a-claim": "File a claim",
"file-a-complaint": "File a complaint",
"you-can": "You can",
"complaint": "Complaint"
},
"Login-register-form": {
"and": "and",
src/i18n/messages/ru.json
+6 -1
View File
@@ -409,6 +409,7 @@
"type": "Тип",
"lawyer": "Адвокат",
"not-assigned": "Не назначено",
"case": "Претензия",
"create-case": "Создать претензию",
"case-name": "Название претензии",
"amount-of-damage": "Сумма ущерба",
@@ -424,7 +425,11 @@
"under-moderation": "На модерации",
"full-link": "Полная ссылка",
"follow-the-link": "Перейти",
"date-of-discovery": "Дата обнаружения"
"date-of-discovery": "Дата обнаружения",
"file-a-claim": "Подать претензию",
"file-a-complaint": "Подать жалобу",
"you-can": "Вы можете",
"complaint": "Жалоба"
},
"Login-register-form": {
"and": "и",