frontend/src/pages/Main/index.tsx
2023-05-20 01:29:17 +03:00

82 lines
3.4 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import react from 'react'
import { Button } from '../../elements/Button';
import { FavoriteCard, FavoriteCardIE } from '../../elements/FavoriteCard';
import { GenerateCard } from '../../elements/GenerateCard';
import { RusPassHeader } from '../../elements/Header';
import { TourCard, TourCardIE } from '../../elements/TourCard';
import './style.css'
export const Main: react.FC = () => {
const TourPropsCard = {
title: 'Я покажу тебе Москву',
days: 8,
imageURL: 'https://images.unsplash.com/photo-1575936123452-b67c3203c357?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8aW1hZ2V8ZW58MHx8MHx8fDA%3D&w=1000&q=80',
placeCards: [
{
title:'Парк Горького',
type: 'Место',
imageURL:'https://images.unsplash.com/photo-1575936123452-b67c3203c357?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8aW1hZ2V8ZW58MHx8MHx8fDA%3D&w=1000&q=80',
},
{
title:'Отель Москва',
type: 'Отель',
imageURL:'https://images.unsplash.com/photo-1575936123452-b67c3203c357?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8aW1hZ2V8ZW58MHx8MHx8fDA%3D&w=1000&q=80',
},
{
title:'Ресторан Сказка',
type: 'Ресторан',
imageURL:'https://images.unsplash.com/photo-1575936123452-b67c3203c357?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8aW1hZ2V8ZW58MHx8MHx8fDA%3D&w=1000&q=80',
}
]
} as TourCardIE
const favoriteCardProps = {
imageURL:'restourant.png',
title:'Кафе Сказка',
location:'Казань'
} as FavoriteCardIE
return (
<div className='mainWrapper'>
<RusPassHeader></RusPassHeader>
<div className='mainCard'>
<h2>Рекомендации</h2>
<div className='cardWrapper'>
<GenerateCard></GenerateCard>
<TourCard {...TourPropsCard}></TourCard>
<TourCard {...TourPropsCard}></TourCard>
<TourCard {...TourPropsCard}></TourCard>
<TourCard {...TourPropsCard}></TourCard>
<TourCard {...TourPropsCard}></TourCard>
</div>
</div>
<div className='mainCard'>
<h2>Добавьте в избранное</h2>
<div className='cardWrapper' style={{gap:'10px'}}>
<FavoriteCard {...favoriteCardProps}></FavoriteCard>
<FavoriteCard {...favoriteCardProps}></FavoriteCard>
<FavoriteCard {...favoriteCardProps}></FavoriteCard>
<FavoriteCard {...favoriteCardProps}></FavoriteCard>
<FavoriteCard {...favoriteCardProps}></FavoriteCard>
<FavoriteCard {...favoriteCardProps}></FavoriteCard>
</div>
<div>
<Button className=''>Посмотреть все</Button>
</div>
</div>
<a href='/'>Документация</a>
<div className='mainIconWrapper'>
<img className='mainIcon' src='icons/yt.svg'></img>
<img className='mainIcon' src='icons/vk.svg'></img>
<img className='mainIcon' src='icons/dz.svg'></img>
<img className='mainIcon' src='icons/tg.svg'></img>
<img className='mainIcon' src='icons/ok.svg'></img>
</div>
<div className='grey'>© 2023 A project of the Government of Moscow</div>
</div>
);
}