add questions component
This commit is contained in:
parent
5b3250a2bb
commit
b910716d7d
|
@ -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;
|
|
@ -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%);
|
||||||
|
}
|
|
@ -1,9 +1,15 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import Questions from '../../components/Questions';
|
||||||
|
import LastView from '../../components/LastView';
|
||||||
|
|
||||||
const Comparisons = function () {
|
const Comparisons = function () {
|
||||||
|
|
||||||
return(
|
return(
|
||||||
<h2>Сравнения</h2>
|
<>
|
||||||
|
<h2>Сравнения</h2>
|
||||||
|
<Questions/>
|
||||||
|
<LastView/>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import FavoritesApartamentsList from '../../components/FavoritesApartamentsList';
|
import FavoritesApartamentsList from '../../components/FavoritesApartamentsList';
|
||||||
|
import Questions from '../../components/Questions';
|
||||||
import LastView from '../../components/LastView';
|
import LastView from '../../components/LastView';
|
||||||
|
|
||||||
import './styles/Favorites.css';
|
import './styles/Favorites.css';
|
||||||
|
@ -11,20 +12,7 @@ const Favorites = function () {
|
||||||
<>
|
<>
|
||||||
<h2>Избранное</h2>
|
<h2>Избранное</h2>
|
||||||
<FavoritesApartamentsList/>
|
<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/>
|
<LastView/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in New Issue