diff --git a/pairent_frontend_react/src/API/Apartment.js b/pairent_frontend_react/src/API/Apartment.js
index 3f5bc72..697b019 100644
--- a/pairent_frontend_react/src/API/Apartment.js
+++ b/pairent_frontend_react/src/API/Apartment.js
@@ -2,6 +2,8 @@
* Apartment class model
*/
class Apartment {
+ /** @type {number} */
+ id
/** @type {string} */
perimetrs
/** @type {string} */
diff --git a/pairent_frontend_react/src/components/ApartmentsList/index.jsx b/pairent_frontend_react/src/components/ApartmentsList/index.jsx
new file mode 100644
index 0000000..779dbdb
--- /dev/null
+++ b/pairent_frontend_react/src/components/ApartmentsList/index.jsx
@@ -0,0 +1,23 @@
+import React from "react";
+import CardApartment from '../CardApartament';
+
+/**
+ *
+ * @param {{
+ * list: import('../../API/Apartment').Apartment[]
+ * }} props
+ */
+export default function ApartmentsList(props) {
+ const list = props.list;
+ console.log(list);
+
+ return (
+
+ {
+ list.map((el, i) => {
+ return
+ })
+ }
+
+ )
+}
\ No newline at end of file
diff --git a/pairent_frontend_react/src/pages/IndexPage/index.jsx b/pairent_frontend_react/src/pages/IndexPage/index.jsx
index 3bd7af0..7b03e95 100644
--- a/pairent_frontend_react/src/pages/IndexPage/index.jsx
+++ b/pairent_frontend_react/src/pages/IndexPage/index.jsx
@@ -3,6 +3,7 @@ import { Swiper, SwiperSlide } from 'swiper/react';
import { Scrollbar, Navigation } from 'swiper/core';
import ISVGIcon from '../../components/UI/Icon/SVGIcon';
import Select from 'react-select';
+import ApartmentsList from "../../components/ApartmentsList";
import styled from 'styled-components';
import 'swiper/css';
@@ -11,6 +12,7 @@ import 'swiper/css/navigation';
// swiper customization
import './swiper.css';
+import ApartamentService from "../../API/ApartamentService";
const SVGIcon = styled(ISVGIcon)`
@@ -61,7 +63,7 @@ const PeriodButton = styled.button`
display: inline-block;
margin-right: 16px;
- border-radius: 14px;
+ border-radius: 10px;
padding: 0 16px;
box-shadow: 0 2px 16px #ffffff30;
@@ -93,6 +95,7 @@ const SubmitBtn = styled.button`
border-radius: 8px;
color: #f9f9f9;
font-weight: 700;
+ float: right;
&:active {
background: #3759bf
@@ -131,10 +134,6 @@ const SearchBarInput = styled.input`
outline: none;
`;
-const ListSelect = styled.datalist`
-
-`;
-
const FiltersForm = () => {
const apart_sizes = [
@@ -209,6 +208,8 @@ const FiltersForm = () => {
value={state.area_to}
onChange={(e) => setState({area_to: e.target.value})}/>
+ м²
+