Подключил шрифты

This commit is contained in:
2023-01-09 20:53:23 +03:00
parent 4c636c424a
commit c4d44e3855
28 changed files with 305 additions and 292 deletions

View File

@@ -1,92 +1,64 @@
import React, { useEffect, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { selectCurrentCandidate, auth } from '../../redux/outstaffingSlice'
import { Link, useHistory, useParams } from 'react-router-dom'
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'
import React, {useEffect, useState} from 'react'
import {useSelector} from 'react-redux'
import {selectCurrentCandidate} from '../../redux/outstaffingSlice'
import {Link} from 'react-router-dom'
import { fetchReportList } from '../../server/server'
import { getRole } from '../../redux/roleSlice'
import CalendarComponent from './CalendarComponent'
import {currentMonth} from './calendarHelper'
import {Footer} from '../Footer/Footer'
import rectangle from '../../images/rectangle_secondPage.png'
import './calendar.scss'
const getDateParamString = ({ paramName, value }) => {
return value ? `${paramName}=${value}` : ''
}
const Calendar = ({onSelect}) => {
const Calendar = ({ onSelect }) => {
const dispatch = useDispatch()
const candidateForCalendar = useSelector(selectCurrentCandidate)
const role = useSelector(getRole)
const { userId } = useParams()
const [month, setMonth] = useState('')
const [fromDate, setFromDate] = useState(null)
const [toDate, setToDate] = useState(null)
const candidateForCalendar = useSelector(selectCurrentCandidate);
const history = useHistory()
// useEffect(() => {
// fetchReportList({
// link: `${
// process.env.REACT_APP_API_URL
// }/api/reports/index?user_id=${userId}${getDateParamString({
// paramName: 'fromDate',
// value: fromDate
// })}${getDateParamString({
// paramName: 'toDate',
// value: toDate
// })}`,
// history,
// role,
// logout: () => {}
// })
// }, [])
const [month, setMonth] = useState('');
useEffect(() => {
setMonth(currentMonth)
}, [month])
}, [month]);
const { name, skillsName, photo } = candidateForCalendar
const {name, skillsName, photo} = candidateForCalendar;
const abbreviatedName = name && name.substring(0, name.lastIndexOf(' '))
const abbreviatedName = name && name.substring(0, name.lastIndexOf(' '));
return (
<section className='calendar'>
<div className='row'>
<h2 className='calendar__profile'>
Добрый день, <span>Александр !</span>
</h2>
<div className='col-12 col-xl-12 d-flex justify-content-between align-items-center flex-column flex-sm-row'>
<div className='calendar__info'>
<img className='calendar__info-img' src={photo} alt='img' />
<h3 className='calendar__info-name'>{abbreviatedName}</h3>
</div>
<div className='calendar__title'>
<h3 className='calendar__title-text'>{skillsName} разработчик</h3>
<img className='calendar__title-img' src={rectangle} alt='img' />
</div>
<div>
<Link to='/report'>
<button className='calendar__btn'>Заполнить отчет за день</button>
</Link>
<section className='calendar'>
<div className='row'>
<h2 className='calendar__profile'>
Добрый день, <span>Александр !</span>
</h2>
<div className='col-12 col-xl-12 d-flex justify-content-between align-items-center flex-column flex-sm-row'>
<div className='calendar__info'>
<img className='calendar__info-img' src={photo} alt='img'/>
<h3 className='calendar__info-name'>{abbreviatedName}</h3>
</div>
<div className='calendar__title'>
<h3 className='calendar__title-text'>{skillsName} разработчик</h3>
<img className='calendar__title-img' src={rectangle} alt='img'/>
</div>
<div>
<Link to='/report'>
<button className='calendar__btn'>Заполнить отчет за день</button>
</Link>
</div>
</div>
</div>
</div>
<div className='row'>
<div className='col-12 col-xl-12'>
<CalendarComponent onSelect={onSelect} />
<p className='calendar__hours'>
{month} : <span> 60 часов </span>
</p>
<div className='row'>
<div className='col-12 col-xl-12'>
<CalendarComponent onSelect={onSelect}/>
<p className='calendar__hours'>
{month} : <span> 60 часов </span>
</p>
</div>
</div>
</div>
<Footer />
</section>
<Footer/>
</section>
)
}
};
export default Calendar

View File

@@ -1,9 +1,9 @@
.calendar {
margin-bottom: 40px;
font-family: 'LabGrotesque', sans-serif;
&__profile {
color: #282828;
font-family: 'GT Eesti Pro Display';
font-size: 3.4em;
font-weight: 700;
font-style: normal;
@@ -29,7 +29,6 @@
height: 112px;
&-name {
font-family: 'GT Eesti Pro Display';
font-size: 2em;
font-weight: 400;
font-style: normal;
@@ -53,7 +52,6 @@
&__title {
&-text {
font-family: 'GT Eesti Pro Display';
font-size: 2.7em;
font-weight: 700;
font-style: normal;
@@ -86,7 +84,6 @@
}
&__hours {
font-family: 'GT Eesti Pro Display';
font-size: 2.2em;
font-weight: 600;
font-style: normal;
@@ -96,7 +93,6 @@
margin-left: 68px;
span {
font-family: 'GT Eesti Pro Display';
font-weight: 100;
font-style: normal;
letter-spacing: normal;

View File

@@ -7,12 +7,13 @@
padding-right: 54px;
padding-top: 48px;
padding-bottom: 94px;
font-family: 'LabGrotesque', sans-serif;
&__header {
display: flex;
h3 {
font-family: 'GT Eesti Pro Display';
font-size: 2.5em;
font-weight: 400;
font-style: normal;
@@ -33,7 +34,6 @@
span {
color: #18586e;
font-family: 'GT Eesti Pro Display';
font-size: 1.6em;
font-weight: 500;
font-style: normal;
@@ -62,7 +62,6 @@
p {
color: #398208;
font-family: 'GT Eesti Pro Display';
font-size: 25px;
font-weight: 400;
font-style: normal;
@@ -87,7 +86,6 @@
border: 1px solid #c4c4c4;
background-color: #ffffff;
margin-top: 20px;
font-family: 'GT Eesti Pro Display';
font-size: 1.2em;
font-weight: 100;
font-style: normal;