delete svg 32m

Components/ErrorViewer/index.tsx

@@ -36,6 +36,7 @@ export const ErrorViewer : React.FC<ErrorViewerIE> = (props) =>{
         {   open?
             <div className={styles.fixes}>
                 <div className={styles.paragraphs}>
+                    <div style={{display: props.correct? "none":""}}>ПРИМЕРЫ ИЗ ДРУГИХ НПА</div>
                     {
                         props.paragraph.map(
                             (value, index)=><div className={styles.paragraph}>

Components/FileUploader/index.tsx

@@ -8,7 +8,6 @@ import { host } from "../../pages/api/consts";
 interface FileUploaderIE{
     onResponse: (response:any)=>void
 }
-
 export const FileUploader:React.FC<FileUploaderIE> = (data) =>{
 
     const props = {
@@ -32,8 +31,8 @@ export const FileUploader:React.FC<FileUploaderIE> = (data) =>{
       };
       
     return (
-            <Upload {...props}>
-              <Button icon={<UploadOutlined></UploadOutlined>}>Click to Upload</Button>
+            <Upload {...props} multiple>
+              <Button icon={<UploadOutlined></UploadOutlined>}>Загрузите файлы для проверки</Button>
             </Upload>
       );
 }

Components/header/index.tsx

@@ -15,7 +15,7 @@ export const Header:React.FC = () =>{
                 <div className={styles.item} onClick={()=>router.push("/")}>
                     Проверить документы 
                 </div>
-                <div className={styles.item} onClick={()=>router.push("/how-to-use")}>
+                <div className={styles.item} onClick={()=>router.push("/guide")}>
                     Инструкция
                 </div>
                 <div className={styles.item} onClick={()=>router.push("/history")}>

pages/about.tsx

@@ -23,20 +23,20 @@ const About: NextPage = () => {
       </Head>
       <main className={styles.main}>
         <Header></Header>
-        <div className={styles.uploader}>
-            <div className={styles.h1}>Наша команда</div>
-            <div>
-                <img src="/images/member1.png"></img>
-                <img src="/images/member2.png"></img>
-                <img src="/images/member3.png"></img>
-                <img src="/images/member4.png"></img>
-                <img src="/images/member5.png"></img>
+        <div className={styles.upload} style={{paddingTop:"100px", paddingBottom:"100px"}}>
+            <div className={styles.h1} >Наша команда</div>
+            <div className={styles.profileWrapper}>
+                <img className={styles.profileCard} src="/images/member1.png"></img>
+                <img className={styles.profileCard} src="/images/member2.png"></img>
+                <img className={styles.profileCard} src="/images/member3.png"></img>
+                <img className={styles.profileCard} src="/images/member4.png"></img>
+                <img className={styles.profileCard} src="/images/member5.png"></img>
             </div>
             <div>
-                <div>Cсылка на репозиторий GitHub:</div>
-                <div>https://github.com/orgs/Ai-hack-MAGNUM-OPUS/repositories</div>
-                <div>Cсылка на презентацию:</div>
-                <div>https://github.com/orgs/Ai-hack-MAGNUM-OPUS/repositories</div>
+                <div className={styles.mText}>Cсылка на репозиторий GitHub:</div>
+                <div className={styles.sourceLink}>https://github.com/orgs/Ai-hack-MAGNUM-OPUS/repositories</div>
+                <div className={styles.mText}>Cсылка на презентацию:</div>
+                <div className={styles.sourceLink}>https://github.com/orgs/Ai-hack-MAGNUM-OPUS/repositories</div>
             </div>
         </div>
       </main>

pages/guide.tsx

@@ -0,0 +1,46 @@
+import type { NextPage } from 'next'
+import Head from 'next/head'
+import { ErrorViewer } from '../Components/ErrorViewer'
+import { FileUploader } from '../Components/FileUploader'
+import { Header } from '../Components/header'
+import styles from '../styles/Home.module.css'
+import 'antd/dist/antd.css';
+import { ItemSelect, SelectItemIE } from '../Components/ItemSelect'
+import { useState } from 'react'
+import { useRouter } from 'next/router'
+
+
+
+const Guide: NextPage = () => {
+
+  
+  return (
+    <div className={styles.container}>
+      <Head>
+        <title>Create Next App</title>
+        <meta name="description" content="Generated by create next app" />
+        <link rel="icon" href="/favicon.ico" />
+      </Head>
+      <main className={styles.main}>
+        <Header></Header>
+        <div className={styles.upload} style={{paddingTop:"100px", paddingBottom:"100px"}}>
+           <div>
+            Как пользоваться?
+            <ul>
+                <li>1.  Загрузите файл нажав кнопку “click to upload”, затем вы можете загружать еще файлы, нажимая на эту кнопку, либо вы можете кликнуть «далее» и пройти на следующий экран. Система поддерживает файлы форматов: doc, docx</li>
+                <li>2.  На следующем экране отобразится инструмент просмотра результатов. Справа находится элемент выбора файла, по которому вы хотите просмотреть результаты. </li>
+                <li>3.  Слева же находятся сами результаты. В виде 39 карточек классов, нажав на которые отобразится больше информации. А именно: все абзацы, что принадлежат этому классу, также возле каждого абзаца будет точность, с которой он относится к классу. Если точность меньше 50%, то рядом с номером абзаца будет отображаться красный круг, если она больше 50%, но меньше 70%, то желтый и если больше 70%, то зеленый соответственно. </li>
+                <li>4.  Также на каждой карточке присутствует либо галка, либо крест. Галка означает что к данному классу относится хотя бы один абзац текста. Если же ни один абзац не относится к классу, то стоит крест и предложены варианты реализации этого абзаца в другом, ранее подтвержденном документе.</li>
+                <li>5.  По мимо того, с помощью блока инструментов вы можете отформатировать результаты теса, убрать или добавить классы, в которых найдены ошибки. Еще вы можете скачать docx документ после работы сервиса, в том же блоке. Там будут выделены все ошибки.</li>
+                <li>6.  Чтобы не загружать файл еще раз. Вы можете найти его в истории файлов и посмотреть результаты еще раз. Отобразятся они в том же формате, что и при загрузке файла. </li>
+                <li>7.  Помимо того, если вы можете скачать расширение для программы MS Word, и большинство функций будут доступны уже внутри него, это позволит экономить время на загрузку файла.</li>
+
+            </ul>
+           </div>
+        </div>
+      </main>
+    </div>
+  )
+}
+
+export default Guide

pages/index.tsx

@@ -23,8 +23,8 @@ const Upload: NextPage = () => {
   return (
     <div className={styles.container}>
       <Head>
-        <title>Create Next App</title>
-        <meta name="description" content="Generated by create next app" />
+        <title>Проверка НПА</title>
+        <meta name="description" content="Помощник проверки НПА" />
         <link rel="icon" href="/favicon.ico" />
       </Head>
       <main className={styles.main}>

styles/Home.module.css

@@ -187,4 +187,37 @@
     transition: 0.3s;
     color: #F4F7FD;
     padding: 12px 26px;
+}
+
+.profileCard{
+    width: 15%;
+}
+.profileWrapper{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap:25px
+}
+
+.mText{
+    font-style: normal;
+    font-weight: 500;
+    font-size: 16px;
+    line-height: 200%;
+    color: #000000;
+    text-align: center;
+}
+.sourceLink{
+    text-align: center;
+    font-style: normal;
+    font-weight: 300;
+    font-size: 16px;
+    line-height: 200%;
+    /* identical to box height, or 48px */
+
+    text-align: center;
+    text-decoration-line: underline;
+
+    /* main/black */
+    color: #000000;
 }