mirror of
https://github.com/magnum-opus-tender-hack/frontend.git
synced 2024-11-22 00:06:35 +03:00
Merge pull request #9 from magnum-opus-tender-hack/verstka2
add pages about us && about project
This commit is contained in:
commit
b7e591979c
42
pages/about-project.tsx
Normal file
42
pages/about-project.tsx
Normal file
|
@ -0,0 +1,42 @@
|
||||||
|
import { NextPage } from "next";
|
||||||
|
import { MyHeader } from "../сomponents/header";
|
||||||
|
import styles from '../styles/Home.module.css'
|
||||||
|
import 'antd/dist/antd.css';
|
||||||
|
|
||||||
|
|
||||||
|
const AboutProject: NextPage = () => {
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={styles.aboutProjectContainer}>
|
||||||
|
<MyHeader></MyHeader>
|
||||||
|
<div className={styles.h1}>
|
||||||
|
О проекте
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className={styles.h2}>Ссылки</div>
|
||||||
|
<div>Demo: <a href="">Скоро будет!</a></div>
|
||||||
|
<div>GitHub: <a href="https://github.com/magnum-opus-tender-hack">https://github.com/magnum-opus-tender-hack</a></div>
|
||||||
|
<div>Frontend: <a href="https://github.com/magnum-opus-tender-hack/frontend">https://github.com/magnum-opus-tender-hack/frontend</a></div>
|
||||||
|
<div>Backend: <a href="https://github.com/magnum-opus-tender-hack/backend">https://github.com/magnum-opus-tender-hack/backend</a></div>
|
||||||
|
<div>Презентация: <a href="">Скоро будет!</a></div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className={styles.h2}>Описание</div>
|
||||||
|
<div>
|
||||||
|
Наша идея решения заключается в том чтобы максимально упростить когнитивную нагрузку
|
||||||
|
на поиск в целом, сведя весь фокус в одну поисковую строку. Пользователю достаточно
|
||||||
|
просто начать вводить информацию о продукте в поисковой строке, наша система сама начнет
|
||||||
|
его дополнять и предлагать варианты. К тому же реализовано автоматическое определение
|
||||||
|
сорта высказывания. Например автоматическое определение что пользователь начинает
|
||||||
|
вводить название продукта или его категорию. Также автоматически определяться могут
|
||||||
|
категории из необработанной части базы данных - поля из Характеристик в выданном нам
|
||||||
|
excel файле
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AboutProject;
|
27
pages/about-us.tsx
Normal file
27
pages/about-us.tsx
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
import { NextPage } from "next";
|
||||||
|
import { MyHeader } from "../сomponents/header";
|
||||||
|
import styles from '../styles/Home.module.css'
|
||||||
|
import 'antd/dist/antd.css';
|
||||||
|
|
||||||
|
|
||||||
|
const AboutUs: NextPage = () => {
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={styles.aboutContainer}>
|
||||||
|
<MyHeader></MyHeader>
|
||||||
|
<div className={styles.h1}>
|
||||||
|
Наша команда
|
||||||
|
</div>
|
||||||
|
<div className={styles.imgWrapper}>
|
||||||
|
<img className={styles.img} src="/member1.png"></img>
|
||||||
|
<img className={styles.img} src="/member2.png"></img>
|
||||||
|
<img className={styles.img} src="/member3.png"></img>
|
||||||
|
<img className={styles.img} src="/member5.png"></img>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AboutUs;
|
|
@ -10,6 +10,7 @@ import {useAppDispatch, useAppSelector} from '../hooks';
|
||||||
import {search, createHints} from '../store/reducers/asyncActions';
|
import {search, createHints} from '../store/reducers/asyncActions';
|
||||||
import {products, hints, INode} from '../store/reducers/nodesInputReducer'
|
import {products, hints, INode} from '../store/reducers/nodesInputReducer'
|
||||||
import { ProductsView } from '../сomponents/ProductsView'
|
import { ProductsView } from '../сomponents/ProductsView'
|
||||||
|
import { MyHeader } from '../сomponents/header'
|
||||||
|
|
||||||
const Home: NextPage = () => {
|
const Home: NextPage = () => {
|
||||||
const [goods, setGoods] = useState([]);
|
const [goods, setGoods] = useState([]);
|
||||||
|
@ -34,6 +35,7 @@ const Home: NextPage = () => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.container}>
|
<div className={styles.container}>
|
||||||
|
<MyHeader></MyHeader>
|
||||||
<Search onData={(data)=>setGoods(data)}></Search>
|
<Search onData={(data)=>setGoods(data)}></Search>
|
||||||
{
|
{
|
||||||
getProducts.length == 0? null:<ProductsView></ProductsView>
|
getProducts.length == 0? null:<ProductsView></ProductsView>
|
||||||
|
|
BIN
public/member1.png
Normal file
BIN
public/member1.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 136 KiB |
BIN
public/member2.png
Normal file
BIN
public/member2.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 122 KiB |
BIN
public/member3.png
Normal file
BIN
public/member3.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 100 KiB |
BIN
public/member5.png
Normal file
BIN
public/member5.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 104 KiB |
|
@ -4,7 +4,41 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap:100px;
|
gap:100px;
|
||||||
padding:100px;
|
padding:100px;
|
||||||
|
margin-top: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.aboutContainer{
|
||||||
|
padding:100px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap:100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.aboutProjectContainer{
|
||||||
|
padding:100px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap:100px;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.h1{
|
||||||
|
font-size: 48px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
.h2{
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
.imgWrapper{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
gap:10px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
.img{
|
||||||
|
width: 250px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 800px) {
|
@media screen and (max-width: 800px) {
|
||||||
|
|
|
@ -21,6 +21,7 @@ a {
|
||||||
color-scheme: dark;
|
color-scheme: dark;
|
||||||
}
|
}
|
||||||
body {
|
body {
|
||||||
|
|
||||||
transition: 0.3s;
|
transition: 0.3s;
|
||||||
|
|
||||||
color: white;
|
color: white;
|
||||||
|
|
35
сomponents/header/header.module.css
Normal file
35
сomponents/header/header.module.css
Normal file
|
@ -0,0 +1,35 @@
|
||||||
|
.header{
|
||||||
|
position: fixed;
|
||||||
|
top:0px;
|
||||||
|
left: 0px;
|
||||||
|
width: 100%;
|
||||||
|
height: 60px;
|
||||||
|
background-color: #fafaff;
|
||||||
|
border-radius: 0px 0px 10px 10px;
|
||||||
|
box-shadow: 0px 5px 10px rgba(88, 88, 146, 0.18);
|
||||||
|
padding: 15px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 50px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.link a{
|
||||||
|
transition: 0.3s;
|
||||||
|
font-weight: 500;
|
||||||
|
text-decoration: none;
|
||||||
|
color: rgb(249, 90, 90) !important
|
||||||
|
}
|
||||||
|
|
||||||
|
.link a:active{
|
||||||
|
transition: 0.3s;
|
||||||
|
text-decoration: none;
|
||||||
|
color: rgb(255, 47, 47) !important
|
||||||
|
}
|
||||||
|
|
||||||
|
.link a:hover{
|
||||||
|
transition: 0.3s;
|
||||||
|
font-weight: 400;
|
||||||
|
text-decoration: none;
|
||||||
|
color: rgb(255, 47, 47) !important
|
||||||
|
}
|
13
сomponents/header/index.tsx
Normal file
13
сomponents/header/index.tsx
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
import Link from "next/link";
|
||||||
|
import React from "react"
|
||||||
|
import styles from "./header.module.css"
|
||||||
|
|
||||||
|
export const MyHeader:React.FC = () =>{
|
||||||
|
return(
|
||||||
|
<div className={styles.header}>
|
||||||
|
<div className={styles.link}><Link href="/">Главная</Link></div>
|
||||||
|
<div className={styles.link}><Link className={styles.link} href="/about-us">О нас</Link></div>
|
||||||
|
<div className={styles.link}><Link className={styles.link} href="/about-project">О проекте</Link></div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user