add questions component

pairent_frontend_react/src/components/Questions/Questions.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+
+import './styles/Questions.css';
+
+const Questions = function () {
+    return (
+        <section className="questionBtnSection">
+            <button className="questionBtn orangeBtn">
+                <h3>Рестик или кафешка?</h3>
+                <p>Какой общепит предпочтительнее для вас возле жилища?</p>
+            </button>
+            <button className="questionBtn greenBtn">
+                <h3>Двушка или однушка?</h3>
+                <p>Как выбрать квартиру под себя, чтобы не переплачивать?</p>
+            </button>
+            <button className="questionBtn blueBtn">
+                <h3>Совмещенный или отдельно?</h3>
+                <p>Какой санузел будет для вас лучшим вариантом?</p>
+            </button>
+        </section>  
+    );
+}
+
+export default Questions;

pairent_frontend_react/src/components/Questions/styles/Questions.css

@@ -0,0 +1,50 @@
+/*Кнопки с вопросами*/
+.questionBtnSection{
+    display: flex;
+    justify-content: space-between;
+    margin-top: 55px;
+}
+
+.questionBtn{
+    width: 323px;
+    height: 128px;
+    padding: 2% 5% 2% 3%;
+    border-radius: 12px;
+    text-align: left;
+}
+
+.questionBtn h3{
+    font-size: 18px;
+    color: #fff;
+}
+
+.questionBtn p{
+    margin-top: 16px;
+    font-size: 16px;
+    line-height: 19px;
+    color: #fff;
+}
+
+.orangeBtn{
+    background: linear-gradient(180deg, #F76D09 0%, #FFA800 100%);
+}
+
+.orangeBtn:active{
+    background: linear-gradient(180deg, #FFA800 0%, #F76D09 100%);
+}
+
+.greenBtn{
+    background: linear-gradient(180deg, #107A34 0%, #51A633 100%);
+}
+
+.greenBtn:active{
+    background: linear-gradient(180deg, #51A633 0%, #107A34 100%);
+}
+
+.blueBtn{
+    background: linear-gradient(180deg, #2E50A7 0%, #0993F7 100%);
+}
+
+.blueBtn:active{
+    background: linear-gradient(180deg, #0993F7 0%, #2E50A7 100%);
+}

pairent_frontend_react/src/pages/Comparisons/index.jsx

@@ -1,9 +1,15 @@
 import React from 'react';
+import Questions from '../../components/Questions';
+import LastView from '../../components/LastView';
 
 const Comparisons = function () {
 
     return(
-        <h2>Сравнения</h2>
+        <>
+            <h2>Сравнения</h2>
+            <Questions/>
+            <LastView/>
+        </>
     );
 }
 

pairent_frontend_react/src/pages/Favorites/index.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 
 import FavoritesApartamentsList from '../../components/FavoritesApartamentsList';
+import Questions from '../../components/Questions';
 import LastView from '../../components/LastView';
 
 import './styles/Favorites.css';
@@ -11,20 +12,7 @@ const Favorites = function () {
         <>
             <h2>Избранное</h2>
             <FavoritesApartamentsList/>
-            <section className="questionBtnSection">
+            <Questions/>
-                <button className="questionBtn orangeBtn">
-                    <h3>Рестик или кафешка?</h3>
-                    <p>Какой общепит предпочтительнее для вас возле жилища?</p>
-                </button>
-                <button className="questionBtn greenBtn">
-                    <h3>Двушка или однушка?</h3>
-                    <p>Как выбрать квартиру под себя, чтобы не переплачивать?</p>
-                </button>
-                <button className="questionBtn blueBtn">
-                    <h3>Совмещенный или отдельно?</h3>
-                    <p>Какой санузел будет для вас лучшим вариантом?</p>
-                </button>
-            </section>
             <LastView/>
         </>
     );