From 3ce8e17645d2a3f21f630c0a173df6736d123742 Mon Sep 17 00:00:00 2001
From: kurpfish
Date: Wed, 18 Aug 2021 18:16:57 +0300
Subject: [PATCH 1/3] footer changed
---
src/App.js | 5 +-
src/components/Auth/AuthForDevelopers.js | 35 +------
.../Auth/AuthForDevelopers.module.css | 85 -----------------
src/components/Auth/AuthForPartners.js | 32 +------
src/components/Calendar/Calendar.js | 2 +
src/components/Calendar/Calendar.module.css | 4 +
src/components/Candidate/Candidate.js | 2 +
src/components/Candidate/candidate.css | 4 +
src/components/Footer/Footer.js | 38 +++++++-
src/components/Footer/footer.css | 95 +++++++++++++++++--
src/components/Home/Home.js | 2 +
src/index.js | 2 -
src/pages/FormPage.js | 2 +
src/pages/formPage.scss | 4 +
14 files changed, 154 insertions(+), 158 deletions(-)
diff --git a/src/App.js b/src/App.js
index 4c6c7d50..5ba9fb9e 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,5 +1,7 @@
import React, { Suspense, lazy } from 'react'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
+import { useSelector } from 'react-redux'
+import { selectAuth } from './redux/outstaffingSlice';
import 'bootstrap/dist/css/bootstrap.min.css'
import './fonts/stylesheet.css'
import { ProtectedRoute } from './components/ProtectedRoute/ProtectedRoute';
@@ -12,7 +14,8 @@ import CalendarPage from'./pages/CalendarPage';
import ReportPage from './pages/ReportFormPage.js';
import FormPage from './pages/FormPage.js';
-const App = () => {
+const App = (props) => {
+ const isAuth = useSelector(selectAuth)
return (<>
IT Аутстаффинг в России
diff --git a/src/components/Auth/AuthForDevelopers.js b/src/components/Auth/AuthForDevelopers.js
index a1ee30ae..ca58e2ac 100644
--- a/src/components/Auth/AuthForDevelopers.js
+++ b/src/components/Auth/AuthForDevelopers.js
@@ -8,9 +8,6 @@ import arrow from '../../images/arrow__login_page.png'
import authImg from '../../images/auth_img.png'
import cross from '../../images/cross.png'
import text from '../../images/Body_Text.png'
-import align from '../../images/align-left.png'
-import phone from '../../images/phone.png'
-import telegram from '../../images/telegram.png'
import vector from '../../images/Vector_Smart_Object.png'
import vectorBlack from '../../images/Vector_Smart_Object_black.png'
import { fetchAuth } from '../../server/server'
@@ -22,6 +19,7 @@ import { Loader } from '../Loader/Loader'
import { withSwalInstance } from 'sweetalert2-react';
import swal from 'sweetalert2';
+import { Footer } from '../Footer/Footer'
const SweetAlert = withSwalInstance(swal);
@@ -153,36 +151,7 @@ const AuthForDevelopers = () => {
-
-
-
-
-
-
-
-
-
- Подберем и документально оформим IT-специалистов, после чего передадим исполнителей под ваше руководство.
- Вы получаете полное управление над сотрудниками, имея возможность контролировать и заменять IT штат.{' '}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+7 495 156 78 98
-
Будни с 9:00 до 21:00
-
-
-
+
diff --git a/src/components/Auth/AuthForDevelopers.module.css b/src/components/Auth/AuthForDevelopers.module.css
index 76dc33a7..465f5d4a 100644
--- a/src/components/Auth/AuthForDevelopers.module.css
+++ b/src/components/Auth/AuthForDevelopers.module.css
@@ -361,91 +361,6 @@
}
}
-.developers__footer__left {
- display: flex;
- align-items: center;
- margin-bottom: 60px;
-}
-
-@media (max-width: 575.98px) {
- .developers__footer__left {
- margin-top: 120px;
- }
-}
-
-.footer__left__sp {
- padding: 0 100px 0 34px;
-}
-
-@media (max-width: 575.98px) {
- .footer__left__sp {
- padding: 0;
- margin-left: 10px;
- }
-}
-
-.developers__footer__left > div > span {
- color: #18586e;
- font-family: 'GT Eesti Pro Display';
- font-size: 1.6em;
- font-weight: 400;
- font-style: normal;
- letter-spacing: normal;
- line-height: 16.81px;
- text-align: left;
-}
-
-@media (max-width: 575.98px) {
- .developers__footer__left > div > span {
- font-size: 1.2em;
- }
-}
-
-.developers__footer__icon {
- text-align: end;
-}
-
-.developers__footer__icon > img {
- margin-left: 20px;
-}
-
-@media (max-width: 575.98px) {
- .developers__footer__icon > img {
- margin-left: 10px;
- }
-}
-
-.developers__footer__right {
- display: flex;
- flex-direction: column;
- align-items: left;
-}
-
-@media (max-width: 575.98px) {
- .developers__footer__right {
- margin-bottom: 20px;
- }
-}
-.phone {
- color: #003b65;
- font-family: 'CeraPro';
- font-size: 2.1em;
- letter-spacing: normal;
- line-height: 25px;
- text-align: left;
-}
-
-.workingHours {
- color: #003b65;
- font-family: 'CeraPro';
- font-size: 1.2em;
- font-weight: 400;
- font-style: normal;
- letter-spacing: normal;
- line-height: normal;
- margin-left: 24px;
-}
-
.auth__link {
display: block;
}
diff --git a/src/components/Auth/AuthForPartners.js b/src/components/Auth/AuthForPartners.js
index b06a6dff..dea62a33 100644
--- a/src/components/Auth/AuthForPartners.js
+++ b/src/components/Auth/AuthForPartners.js
@@ -23,6 +23,7 @@ import { Loader } from '../Loader/Loader'
import { withSwalInstance } from 'sweetalert2-react';
import swal from 'sweetalert2';
+import { Footer } from '../Footer/Footer'
const SweetAlert = withSwalInstance(swal);
@@ -144,36 +145,7 @@ const AuthForPartners = () => {
-
-
-
-
-
-
-
-
-
- Подберем и документально оформим IT-специалистов, после чего передадим исполнителей под ваше руководство.
- Вы получаете полное управление над сотрудниками, имея возможность контролировать и заменять IT штат.{' '}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+7 495 156 78 98
-
Будни с 9:00 до 21:00
-
-
-
+
diff --git a/src/components/Calendar/Calendar.js b/src/components/Calendar/Calendar.js
index f36f0a32..a1d1393b 100644
--- a/src/components/Calendar/Calendar.js
+++ b/src/components/Calendar/Calendar.js
@@ -7,6 +7,7 @@ import calendarMale from '../../images/medium_male.png';
import rectangle from '../../images/rectangle_secondPage.png';
import CalendarComponent from './CalendarComponent';
import { currentMonth } from './calendarHelper';
+import { Footer } from '../Footer/Footer';
const Calendar = () => {
const candidateForCalendar = useSelector(selectCurrentCandidate);
@@ -52,6 +53,7 @@ const Calendar = () => {
+
);
};
diff --git a/src/components/Calendar/Calendar.module.css b/src/components/Calendar/Calendar.module.css
index 6b0dc78a..cf0d2939 100644
--- a/src/components/Calendar/Calendar.module.css
+++ b/src/components/Calendar/Calendar.module.css
@@ -293,3 +293,7 @@
letter-spacing: normal;
line-height: normal;
}
+
+.calendar footer {
+ margin-top: 2rem !important;
+}
\ No newline at end of file
diff --git a/src/components/Candidate/Candidate.js b/src/components/Candidate/Candidate.js
index 93139604..20e08cdf 100644
--- a/src/components/Candidate/Candidate.js
+++ b/src/components/Candidate/Candidate.js
@@ -10,6 +10,7 @@ import front from '../../images/front_end.png';
import back from '../../images/back_end.png';
import design from '../../images/design.png';
import { fetchItemsForId } from '../../server/server';
+import { Footer } from '../Footer/Footer';
import './candidate.css';
@@ -129,6 +130,7 @@ const Candidate = () => {
+
);
};
diff --git a/src/components/Candidate/candidate.css b/src/components/Candidate/candidate.css
index f0a02aa8..12eccf2f 100644
--- a/src/components/Candidate/candidate.css
+++ b/src/components/Candidate/candidate.css
@@ -280,4 +280,8 @@
.candidate + .logout-button{
top: 80px !important;
+}
+
+.candidate footer {
+ margin-top: 2.5rem !important;
}
\ No newline at end of file
diff --git a/src/components/Footer/Footer.js b/src/components/Footer/Footer.js
index 506cfb5f..3c9e78b0 100644
--- a/src/components/Footer/Footer.js
+++ b/src/components/Footer/Footer.js
@@ -1,10 +1,46 @@
import React from 'react';
import './footer.css';
+import align from '../../images/align-left.png'
+import phone from '../../images/phone.png'
+import telegram from '../../images/telegram.png'
export const Footer = () => {
return (
+
- 2021 © Outstaffing
+
+
+
+
+
+
+
+
+
+ Подберем и документально оформим IT-специалистов, после чего передадим исполнителей под ваше руководство.
+ Вы получаете полное управление над сотрудниками, имея возможность контролировать и заменять IT штат.{' '}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+7 495 156 78 98
+
Будни с 9:00 до 21:00
+
+
+
+ 2021 © Outstaffing
+
+
)
}
\ No newline at end of file
diff --git a/src/components/Footer/footer.css b/src/components/Footer/footer.css
index 60a7d002..432a8b35 100644
--- a/src/components/Footer/footer.css
+++ b/src/components/Footer/footer.css
@@ -1,11 +1,94 @@
footer {
- padding: 2rem 5rem;
- }
+ margin-top: -3rem;
+}
-footer>div {
- border-top: 2px solid #73c141;
- padding: 1rem;
+footer .copyright {
+ padding: 1rem 1rem 1rem 5.6rem;
font-family: 'Muller';
font-weight: 300;
font-size: 1.2em;
-}
\ No newline at end of file
+}
+
+.footer__left {
+ display: flex;
+ align-items: center;
+}
+
+@media (max-width: 575.98px) {
+ .footer__left {
+ margin-top: 120px;
+ }
+}
+
+.footer__description {
+ padding: 0 100px 0 34px;
+}
+
+@media (max-width: 575.98px) {
+ .footer__description {
+ padding: 0;
+ margin-left: 10px;
+ }
+}
+
+.footer__left > div > span {
+ color: #18586e;
+ font-family: 'GT Eesti Pro Display';
+ font-size: 1.6em;
+ font-weight: 400;
+ font-style: normal;
+ letter-spacing: normal;
+ line-height: 16.81px;
+ text-align: left;
+}
+
+@media (max-width: 575.98px) {
+ .footer__left > div > span {
+ font-size: 1.2em;
+ }
+}
+
+.footer__icon {
+ text-align: end;
+}
+
+.footer__icon > img {
+ margin-left: 20px;
+}
+
+@media (max-width: 575.98px) {
+ .footer__icon > img {
+ margin-left: 10px;
+ }
+}
+
+.footer__right {
+ display: flex;
+ flex-direction: column;
+ align-items: left;
+}
+
+@media (max-width: 575.98px) {
+ .footer__right {
+ margin-bottom: 20px;
+ }
+}
+.footer__phone {
+ color: #003b65;
+ font-family: 'CeraPro';
+ font-size: 2.1em;
+ letter-spacing: normal;
+ line-height: 25px;
+ text-align: left;
+}
+
+.footer__working-hours {
+ color: #003b65;
+ font-family: 'CeraPro';
+ font-size: 1.2em;
+ font-weight: 400;
+ font-style: normal;
+ letter-spacing: normal;
+ line-height: normal;
+ margin-left: 24px;
+}
diff --git a/src/components/Home/Home.js b/src/components/Home/Home.js
index 3e87521a..37498c52 100644
--- a/src/components/Home/Home.js
+++ b/src/components/Home/Home.js
@@ -4,6 +4,7 @@ import Outstaffing from '../Outstaffing/Outstaffing';
import Description from '../Description/Description';
import { fetchProfile, fetchSkills } from '../../server/server';
import { profiles, tags } from '../../redux/outstaffingSlice';
+import { Footer } from '../Footer/Footer';
const Home = () => {
const [isLoadingMore, setIsLoadingMore] = useState(false);
@@ -39,6 +40,7 @@ const Home = () => {
<>
+
>
);
};
diff --git a/src/index.js b/src/index.js
index fc995a6e..6c4f1860 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,7 +3,6 @@ import ReactDOM from 'react-dom';
import { store } from './store/store';
import { Provider } from 'react-redux';
import App from './App';
-import { Footer } from './components/Footer/Footer';
import './index.css';
@@ -11,7 +10,6 @@ ReactDOM.render(
<>
-
>
,
document.getElementById('root')
diff --git a/src/pages/FormPage.js b/src/pages/FormPage.js
index 471b3a06..fa8446fb 100644
--- a/src/pages/FormPage.js
+++ b/src/pages/FormPage.js
@@ -7,6 +7,7 @@ import { WithLogout } from '../hoc/withLogout';
import Form from '../components/Form/Form';
import { LEVELS, SKILLS } from '../components/constants/constants';
import { fetchItemsForId } from '../server/server';
+import { Footer } from '../components/Footer/Footer';
import arrow from '../images/right-arrow.png';
import rectangle from '../images/rectangle_secondPage.png';
@@ -70,6 +71,7 @@ const FormPage = () => {
+
)
diff --git a/src/pages/formPage.scss b/src/pages/formPage.scss
index 63cd27f4..65df0437 100644
--- a/src/pages/formPage.scss
+++ b/src/pages/formPage.scss
@@ -123,4 +123,8 @@
.form-page + .logout-button{
top: 0px !important;
right: 2.5rem;
+}
+
+.form-page footer {
+ margin-top: 2.5rem !important;
}
\ No newline at end of file
From 16032758a9ff439dd0228051bc925df177b52557 Mon Sep 17 00:00:00 2001
From: kurpfish
Date: Thu, 19 Aug 2021 16:17:06 +0300
Subject: [PATCH 2/3] mobile version fixes
---
src/components/Calendar/Calendar.module.css | 2 +-
src/components/Candidate/Candidate.js | 4 +-
src/components/Candidate/candidate.css | 21 ++++++++++
.../Description/Description.module.css | 42 +++++++++----------
src/components/Footer/footer.css | 9 +++-
src/components/LogoutButton/logoutButton.css | 6 +--
.../Outstaffing/Outstaffing.module.css | 10 +++++
src/components/Select/TagSelect.module.css | 8 +++-
src/components/Sidebar/Sidebar.module.css | 12 ++++++
9 files changed, 84 insertions(+), 30 deletions(-)
diff --git a/src/components/Calendar/Calendar.module.css b/src/components/Calendar/Calendar.module.css
index cf0d2939..1b2b597d 100644
--- a/src/components/Calendar/Calendar.module.css
+++ b/src/components/Calendar/Calendar.module.css
@@ -19,7 +19,7 @@
.calendar__title {
font-size: 5em;
text-align: center;
- margin: 40px 0;
+ margin: 60px 0 40px 0;
}
}
diff --git a/src/components/Candidate/Candidate.js b/src/components/Candidate/Candidate.js
index 20e08cdf..0a7863d1 100644
--- a/src/components/Candidate/Candidate.js
+++ b/src/components/Candidate/Candidate.js
@@ -120,11 +120,11 @@ const Candidate = () => {
{currentCandidateObj.vc_text ? currentCandidateObj.vc_text : 'Описание отсутствует...' }
)}
-
+ {/*
Выбрать к собеседованию
-
+ */}
diff --git a/src/components/Candidate/candidate.css b/src/components/Candidate/candidate.css
index 12eccf2f..54cd4e81 100644
--- a/src/components/Candidate/candidate.css
+++ b/src/components/Candidate/candidate.css
@@ -41,6 +41,17 @@
margin-left: 60px;
}
+@media (max-width: 768px) {
+ .candidate__header {
+ flex-direction: column;
+ }
+
+ .candidate__header .arrow {
+ margin-left: 60px;
+ margin-bottom: 40px;
+ }
+}
+
@media (max-width: 575.98px) {
.candidate__header {
display: flex;
@@ -48,6 +59,10 @@
margin-left: 0;
margin-top: 40px;
}
+
+ .candidate__header .arrow {
+ margin-left: 0;
+ }
}
.arrow {
@@ -284,4 +299,10 @@
.candidate footer {
margin-top: 2.5rem !important;
+}
+
+@media (max-width: 1199px) {
+ .candidate + .logout-button {
+ top: 16px !important;
+ }
}
\ No newline at end of file
diff --git a/src/components/Description/Description.module.css b/src/components/Description/Description.module.css
index c14fef86..ba2bd244 100644
--- a/src/components/Description/Description.module.css
+++ b/src/components/Description/Description.module.css
@@ -6,12 +6,11 @@
.description__wrapper {
border: 1px solid #efefef;
background-color: #fdfdfd;
- padding-top: 60px;
+ padding: 60px 40px 0 40px;
border-bottom: none;
position: relative;
}
.description__img {
- margin-left: 40px;
margin-top: 16px;
width: 118px;
height: 118px;
@@ -21,24 +20,8 @@
@media (max-width: 575.98px) {
.description__img {
position: absolute;
- top: 90px;
- left: 90px;
- }
-}
-
-@media (max-width: 375.98px) {
- .description__img {
- position: absolute;
- top: 90px;
- left: 90px;
- }
-}
-
-@media (max-width: 340.98px) {
- .description__img {
- position: absolute;
- top: 90px;
- left: 60px;
+ top: 80px;
+ left: 0;
}
}
@@ -60,7 +43,7 @@
@media (max-width: 575.98px) {
.description__title {
text-align: center;
- margin-bottom: 190px;
+ margin-bottom: 170px;
font-size: 3em;
}
}
@@ -176,7 +159,7 @@
.description__list__item {
font-size: 1.5em;
text-align: center;
- margin-bottom: 120px;
+ margin-bottom: 0;
}
}
@@ -188,6 +171,7 @@
@media (max-width: 575.98px) {
.description__rectangle {
width: 80%;
+ margin: 50px auto 80px auto;
}
}
@@ -215,6 +199,14 @@
}
@media (max-width: 575.98px) {
+ .description {
+ margin-bottom: 16px;
+ }
+
+ .description__footer {
+ margin-top: 0;
+ }
+
.description__footer__btn > button {
width: 160px;
margin-right: 10px;
@@ -237,3 +229,9 @@
text-align: center;
margin: 0 10px;
}
+
+@media (max-width: 1199px) {
+ .description__button {
+ margin: 1.5rem 0;
+ }
+}
\ No newline at end of file
diff --git a/src/components/Footer/footer.css b/src/components/Footer/footer.css
index 432a8b35..9b7af3ac 100644
--- a/src/components/Footer/footer.css
+++ b/src/components/Footer/footer.css
@@ -16,7 +16,7 @@ footer .copyright {
@media (max-width: 575.98px) {
.footer__left {
- margin-top: 120px;
+ margin-top: 80px;
}
}
@@ -73,6 +73,7 @@ footer .copyright {
margin-bottom: 20px;
}
}
+
.footer__phone {
color: #003b65;
font-family: 'CeraPro';
@@ -92,3 +93,9 @@ footer .copyright {
line-height: normal;
margin-left: 24px;
}
+
+@media (max-width: 1199px) {
+ .footer__left {
+ margin-bottom: 20px;
+ }
+}
\ No newline at end of file
diff --git a/src/components/LogoutButton/logoutButton.css b/src/components/LogoutButton/logoutButton.css
index 15c89138..5618f3cf 100644
--- a/src/components/LogoutButton/logoutButton.css
+++ b/src/components/LogoutButton/logoutButton.css
@@ -31,9 +31,9 @@
transition: .3s;
}
-@media (max-width: 1198px) {
+@media (max-width: 1199px) {
.logout-button {
- top: 16px;
+ top: 16px !important;
}
- }
+}
\ No newline at end of file
diff --git a/src/components/Outstaffing/Outstaffing.module.css b/src/components/Outstaffing/Outstaffing.module.css
index 02831d06..52f69d95 100644
--- a/src/components/Outstaffing/Outstaffing.module.css
+++ b/src/components/Outstaffing/Outstaffing.module.css
@@ -162,3 +162,13 @@
list-style: none;
cursor: pointer;
}
+
+@media (max-width: 1199px) {
+ .outstaffing__box {
+ margin-top: 0;
+ }
+
+ .outstaffing__box>div {
+ margin-top: 32px;
+ }
+}
\ No newline at end of file
diff --git a/src/components/Select/TagSelect.module.css b/src/components/Select/TagSelect.module.css
index 283e2a7c..15a6fa32 100644
--- a/src/components/Select/TagSelect.module.css
+++ b/src/components/Select/TagSelect.module.css
@@ -45,7 +45,7 @@
@media (max-width: 575.98px) {
.search__box > button {
- margin-top: 40px;
+ margin-top: 20px;
}
}
@@ -77,4 +77,10 @@
.search__submit:hover .loader path {
fill: #6aaf5c;
+}
+
+@media (max-width: 990px) {
+ .select {
+ margin-right: 1rem;
+ }
}
\ No newline at end of file
diff --git a/src/components/Sidebar/Sidebar.module.css b/src/components/Sidebar/Sidebar.module.css
index 6955c33f..879d64f8 100644
--- a/src/components/Sidebar/Sidebar.module.css
+++ b/src/components/Sidebar/Sidebar.module.css
@@ -131,3 +131,15 @@
left: 50%;
transform: translate(-50%, -50%);
}
+
+@media (max-width: 1199px) {
+ .candidateSidebar {
+ flex-direction: row;
+ padding-left: 16px;
+ }
+
+ .candidateSidebar__info {
+ display: flex;
+ flex-direction: column;
+ }
+}
\ No newline at end of file
From b7463dc44ebe0af844ac4430b5eed9e770c0cabc Mon Sep 17 00:00:00 2001
From: kurpfish
Date: Thu, 19 Aug 2021 17:36:53 +0300
Subject: [PATCH 3/3] form page mobile
---
src/pages/formPage.scss | 48 ++++++++++++++++++++++++++++++++++++++++-
1 file changed, 47 insertions(+), 1 deletion(-)
diff --git a/src/pages/formPage.scss b/src/pages/formPage.scss
index 65df0437..9dc51cd1 100644
--- a/src/pages/formPage.scss
+++ b/src/pages/formPage.scss
@@ -5,6 +5,7 @@
align-items: center;
margin-top: 80px;
margin-left: -32px;
+ cursor: pointer;
&-img {
cursor: pointer;
@@ -97,7 +98,7 @@
}
&__telegram {
- width: 45%;
+ width: 35%;
display: flex;
flex-direction: column;
justify-content: center;
@@ -127,4 +128,49 @@
.form-page footer {
margin-top: 2.5rem !important;
+}
+
+@media (max-width: 991px) {
+ .form-page {
+ &__separator {
+ width: 20%
+ }
+
+ &__telegram {
+ width: 25%;
+ }
+ }
+}
+
+@media (max-width: 767px) {
+ .form-page {
+ &__interview {
+ flex-direction: column;
+
+ form {
+ margin-top: 48px;
+ }
+ }
+
+ &__separator {
+ display: none;
+ }
+
+ &__telegram {
+ margin-top: 5rem;
+ margin-bottom: 2rem;
+ }
+
+ &__arrow-img {
+ display: none;
+ }
+
+ form label {
+ line-height: initial;
+ }
+
+ &__selected img {
+ width: 100px;
+ }
+ }
}
\ No newline at end of file