apuc/guild_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed img in components

Browse Source
This commit is contained in:
MaxOvs19
2023-05-24 13:49:09 +03:00
parent 2aa2b15d2d
commit 08f7d13f01
40 changed files with 1133 additions and 1092 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
src/components/Achievement/Achievement.js → src/components/Achievement/Achievement.jsx
View File

14
src/components/AuthBox/AuthBox.js → src/components/AuthBox/AuthBox.jsx
View File

@@ -1,20 +1,18 @@
import React, { useEffect, useRef, useState } from "react";
import { Link, useNavigate } from "react-router-dom";
import { useNavigate } from "react-router-dom";
import { useDispatch, useSelector } from "react-redux";
import { Loader } from "../Loader/Loader";
import { auth, selectAuth, setUserInfo } from "../../redux/outstaffingSlice";
import { loading } from "../../redux/loaderSlice";
import { setRole } from "../../redux/roleSlice";
import { selectIsLoading } from "../../redux/loaderSlice";
import ModalErrorLogin from "../../components/UI/ModalErrorLogin/ModalErrorLogin";
import ModalRegistration from "../UI/ModalRegistration/ModalRegistration";
import ModalErrorLogin from "../UI/ModalErrorLogin/ModalErrorLogin";
import { Loader } from "../Loader/Loader";
import { apiRequest } from "../../api/request";
import ellipse from "../../images/ellipse.png";
import ModalRegistration from "../UI/ModalRegistration/ModalRegistration";
import "./authBox.scss";
@@ -78,7 +76,7 @@ export const AuthBox = ({ title }) => {
Войти в <span>систему</span>
</h2>
<div className="auth-box__title">
<img src={ellipse} alt="" />
<img src={ellipse} alt="." />
<span>{title}</span>
</div>
<form ref={ref} className="auth-box__form">

2
src/components/AuthHeader/AuthHeader.js → src/components/AuthHeader/AuthHeader.jsx
View File

@@ -2,7 +2,7 @@ import React from "react";
import { NavLink } from "react-router-dom";
import { scrollToForm } from "../../helper";
import userIcon from "../../images/userIcon.png";
import userIcon from "../../images/userIcon.svg";
import "./authHeader.scss";

2
src/components/AuthHeader/authHeader.scss
View File

@@ -53,7 +53,7 @@
}
.candidate {
color: #1458DD;
color: #1458dd;
}
}
}

78
src/components/Calendar/Calendar.js
View File

@@ -1,78 +0,0 @@
import React, {useEffect, useState} from 'react'
import {useSelector} from 'react-redux'
import {Link, Navigate, useNavigate} from 'react-router-dom'
import CalendarComponent from './CalendarComponent'
import {currentMonth} from './calendarHelper'
import {Footer} from '../Footer/Footer'
import {LogoutButton} from "../LogoutButton/LogoutButton";
import {selectCurrentCandidate} from '../../redux/outstaffingSlice'
import rectangle from '../../images/rectangle_secondPage.png'
import './calendar.scss'
import {urlForLocal} from "../../helper";
const Calendar = () => {
if(localStorage.getItem('role_status') !== '18') {
return <Navigate to="/profile" replace/>
}
const candidateForCalendar = useSelector(selectCurrentCandidate);
const [month, setMonth] = useState('');
const navigate = useNavigate();
useEffect(() => {
setMonth(currentMonth)
}, [month]);
const {name, skillsName, photo} = candidateForCalendar;
const abbreviatedName = name && name.substring(0, name.lastIndexOf(' '));
return (
<div className='container'>
<section className='calendar'>
<div className='row'>
<div className='calendar__header'>
<h2 className='calendar__profile'>
Добрый день, <span>Александр !</span>
</h2>
<LogoutButton />
</div>
<div className='col-12 col-xl-12 d-flex justify-content-between align-items-center flex-column flex-sm-row'>
<div className='calendar__info'>
{photo && <img className='calendar__info-img' src={urlForLocal(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 className='row'>
<div className='col-12 col-xl-12'>
<CalendarComponent onSelect={() => { navigate('/report/0') }}/>
<p className='calendar__hours'>
{month} : <span> 60 часов </span>
</p>
</div>
</div>
<Footer/>
</section>
</div>
)
};
export default Calendar

88
src/components/Calendar/Calendar.jsx Normal file
View File

@@ -0,0 +1,88 @@
import React, { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { Link, Navigate, useNavigate } from "react-router-dom";
import CalendarComponent from "./CalendarComponent";
import { currentMonth } from "./calendarHelper";
import { Footer } from "../Footer/Footer";
import { LogoutButton } from "../LogoutButton/LogoutButton";
import { urlForLocal } from "../../helper";
import { selectCurrentCandidate } from "../../redux/outstaffingSlice";
import rectangle from "../../images/rectangle_secondPage.png";
import "./calendar.scss";
const Calendar = () => {
if (localStorage.getItem("role_status") !== "18") {
return <Navigate to="/profile" replace />;
}
const candidateForCalendar = useSelector(selectCurrentCandidate);
const [month, setMonth] = useState("");
const navigate = useNavigate();
useEffect(() => {
setMonth(currentMonth);
}, [month]);
const { name, skillsName, photo } = candidateForCalendar;
const abbreviatedName = name && name.substring(0, name.lastIndexOf(" "));
return (
<div className="container">
<section className="calendar">
<div className="row">
<div className="calendar__header">
<h2 className="calendar__profile">
Добрый день, <span>Александр !</span>
</h2>
<LogoutButton />
</div>
<div className="col-12 col-xl-12 d-flex justify-content-between align-items-center flex-column flex-sm-row">
<div className="calendar__info">
{photo && (
<img
className="calendar__info-img"
src={urlForLocal(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 className="row">
<div className="col-12 col-xl-12">
<CalendarComponent
onSelect={() => {
navigate("/report/0");
}}
/>
<p className="calendar__hours">
{month} : <span> 60 часов </span>
</p>
</div>
</div>
<Footer />
</section>
</div>
);
};
export default Calendar;

92
src/components/Calendar/CalendarComponent.js
View File

@@ -1,92 +0,0 @@
import React, { useState, useEffect } from 'react'
import ellipse from '../../images/ellipse.png'
import rectangle from '../../images/rectangle__calendar.png'
import calendarIcon from '../../images/calendar_icon.png'
import moment from 'moment'
import 'moment/locale/ru'
import { calendarHelper, currentMonthAndDay, } from './calendarHelper'
import './calendarComponent.scss'
const CalendarComponent = ({ onSelect }) => {
const [value, setValue] = useState(moment())
const [calendar, setCalendar] = useState([])
useEffect(() => {
setCalendar(calendarHelper(value))
}, [value])
function beforeToday(day) {
return day.isBefore(new Date(), 'day')
}
function isToday(day) {
return day.isSame(new Date(), 'day')
}
function dayStyles(day) {
if (beforeToday(day)) return `before`
if (isToday(day)) return `today`
if (day.day() === 6 || day.day() === 0) return `selected`
return ''
}
function prevMonth() {
return value.clone().subtract(1, 'month')
}
function nextMonth() {
return value.clone().add(1, 'month');
}
return (
<div className='calendar-component'>
<div className='calendar-component__header'>
<h3>Мои отчеты</h3>
<div className='calendar-component__header-box'>
<img src={ellipse} alt='' />
<span onClick={() => setValue(prevMonth())}>{prevMonth().format('MMMM')}</span>
</div>
<div className='calendar-component__header-box'>
<img src={ellipse} alt='' />
<span onClick={() => setValue(nextMonth())}>{nextMonth().format('MMMM')}</span>
</div>
</div>
<div className='calendar-component__rectangle'>
<img src={rectangle} alt='' />
</div>
<div className='calendar-component__body'>
<div>
<p>Пн</p>
<p>Вт</p>
<p>Ср</p>
<p>Чт</p>
<p>Пт</p>
<p>Сб</p>
<p>Вс</p>
</div>
<div className='calendar-component__form'>
{calendar.map((week) =>
week.map((day) => (
<button
onClick={() => { setValue(day); onSelect(day) }}
key={day}
className={dayStyles(day)}
name={day.format('dddd')}
id='btn'
>
<img className={'calendar__icon'} src={calendarIcon} alt='' />
{currentMonthAndDay(day)}
</button>
))
)}
</div>
</div>
</div>
)
}
export default CalendarComponent

101
src/components/Calendar/CalendarComponent.jsx Normal file
View File

@@ -0,0 +1,101 @@
import React, { useState, useEffect } from "react";
import { calendarHelper, currentMonthAndDay } from "./calendarHelper";
import ellipse from "../../images/ellipse.png";
import rectangle from "../../images/rectangle__calendar.png";
import calendarIcon from "../../images/calendar_icon.png";
import moment from "moment";
import "moment/locale/ru";
import "./calendarComponent.scss";
const CalendarComponent = ({ onSelect }) => {
const [value, setValue] = useState(moment());
const [calendar, setCalendar] = useState([]);
useEffect(() => {
setCalendar(calendarHelper(value));
}, [value]);
function beforeToday(day) {
return day.isBefore(new Date(), "day");
}
function isToday(day) {
return day.isSame(new Date(), "day");
}
function dayStyles(day) {
if (beforeToday(day)) return `before`;
if (isToday(day)) return `today`;
if (day.day() === 6 || day.day() === 0) return `selected`;
return "";
}
function prevMonth() {
return value.clone().subtract(1, "month");
}
function nextMonth() {
return value.clone().add(1, "month");
}
return (
<div className="calendar-component">
<div className="calendar-component__header">
<h3>Мои отчеты</h3>
<div className="calendar-component__header-box">
<img src={ellipse} alt="" />
<span onClick={() => setValue(prevMonth())}>
{prevMonth().format("MMMM")}
</span>
</div>
<div className="calendar-component__header-box">
<img src={ellipse} alt="" />
<span onClick={() => setValue(nextMonth())}>
{nextMonth().format("MMMM")}
</span>
</div>
</div>
<div className="calendar-component__rectangle">
<img src={rectangle} alt="" />
</div>
<div className="calendar-component__body">
<div>
<p>Пн</p>
<p>Вт</p>
<p>Ср</p>
<p>Чт</p>
<p>Пт</p>
<p>Сб</p>
<p>Вс</p>
</div>
<div className="calendar-component__form">
{calendar.map((week) =>
week.map((day) => (
<button
onClick={() => {
setValue(day);
onSelect(day);
}}
key={day}
className={dayStyles(day)}
name={day.format("dddd")}
id="btn"
>
<img className={"calendar__icon"} src={calendarIcon} alt="" />
{currentMonthAndDay(day)}
</button>
))
)}
</div>
</div>
</div>
);
};
export default CalendarComponent;

4
src/components/Calendar/calendar.scss
View File

@@ -1,6 +1,6 @@
.calendar {
margin-bottom: 40px;
font-family: 'LabGrotesque', sans-serif;
font-family: "LabGrotesque", sans-serif;
&__header {
display: flex;
@@ -85,7 +85,7 @@
);
border: none;
color: #ffffff;
font-family: 'Muller';
font-family: "Muller";
font-size: 1.6em;
letter-spacing: normal;
text-align: center;

101
src/components/Calendar/calendarComponent.scss
View File

@@ -210,12 +210,6 @@
padding: 28px 10px 48px 10px;
&__header {
//h3 {
// position: absolute;
// top: -10%;
// left: 25%;
//}
&-box {
margin-left: 20px;
}
@@ -233,101 +227,6 @@
}
}
//@media (max-width: 768px) {
// .calendar-component__form > button {
// width: 70px;
// height: 40px;
//
// img {
// display: none;
// }
// }
//}
//@media (max-width: 540.98px) {
// .calendar-component__form > button {
// width: 68px;
// height: 40px;
// }
//}
//
//@media (max-width: 520.98px) {
// .calendar-component__form > button {
// width: 66px;
// height: 40px;
// }
//}
//
//@media (max-width: 500.98px) {
// .calendar-component__form > button {
// width: 64px;
// height: 40px;
// }
//}
//
//@media (max-width: 480.98px) {
// .calendar-component__form > button {
// width: 60px;
// height: 40px;
// }
//}
//
//@media (max-width: 460.98px) {
// .calendar-component__form > button {
// width: 56px;
// height: 40px;
// }
//}
//
//@media (max-width: 440.98px) {
// .calendar-component__form > button {
// width: 52px;
// height: 40px;
// }
//}
//
//@media (max-width: 428.98px) {
// .calendar-component__form > button {
// width: 50px;
// height: 40px;
// }
//}
//
//@media (max-width: 414.98px) {
// .calendar-component__form > button {
// width: 49px;
// height: 40px;
// }
//}
//
//@media (max-width: 395.98px) {
// .calendar-component__form > button {
// width: 46px;
// height: 40px;
// }
//}
//
//@media (max-width: 350.98px) {
// .calendar-component__form > button {
// width: 44px;
// height: 40px;
// }
//}
//
//@media (max-width: 349.98px) {
// .calendar-component__form > button {
// width: 42px;
// height: 40px;
// }
//}
//
//@media (max-width: 346.98px) {
// .calendar-component__form > button {
// width: 40px;
// height: 40px;
// }
//}
.calendar__icon {
margin-right: 10px;
margin-top: -4px;

13
src/components/Candidate/Candidate.js
View File

@@ -7,6 +7,7 @@ import Sidebar from "../CandidateSidebar/CandidateSidebar";
import { ProfileHeader } from "../ProfileHeader/ProfileHeader";
import { ProfileBreadcrumbs } from "../ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../Footer/Footer";
import { Navigation } from "../Navigation/Navigation";
import {
currentCandidate,
@@ -16,17 +17,17 @@ import {
import { apiRequest } from "../../api/request";
import { createMarkup } from "../../helper";
import gitImgItem from "../../images/gitItemImg.png";
import gitImgItem from "../../images/gitItemImg.svg";
import rectangle from "../../images/rectangle_secondPage.png";
import front from "../Outstaffing/images/front_end.png";
import back from "../Outstaffing/images/back_end.png";
import design from "../Outstaffing/images/design.png";
import rightArrow from "../../images/arrowRight.png";
import front from "../../images/front-end.webp";
import back from "../../images/back-end.webp";
import design from "../../images/design.webp";
import rightArrow from "../../images/arrowRight.svg";
import { LEVELS, SKILLS } from "../../constants/constants";
import "./candidate.scss";
import { Navigation } from "../Navigation/Navigation";
const Candidate = () => {
if (localStorage.getItem("role_status") !== "18") {

4
src/components/CandidateSidebar/CandidateSidebar.js → src/components/CandidateSidebar/CandidateSidebar.jsx
View File

@@ -1,8 +1,8 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import { Achievement } from "../Achievement/Achievement";
import { Achievement } from "../Achievement/Achievement";
import ModalAspt from "../UI/ModalAspt/ModalAspt";
import { urlForLocal } from "../../helper";
import { LEVELS, SKILLS } from "../../constants/constants";

41
src/components/CardControl/CardControl.js
View File

@@ -1,20 +1,23 @@
import React from 'react'
import rightArrow from "../../images/arrowRight.png"
import { Link } from 'react-router-dom'
import './CardControl.scss'
import React from "react";
import { Link } from "react-router-dom";
export const CardControl = ({title,path,description, img}) => {
return (
<Link to={`/${path}`} className='control-card'>
<div className='control-card__about'>
<img src={img} alt='itemImg' />
<h3>{title}</h3>
</div>
<div className='control-card__info'>
<p dangerouslySetInnerHTML={{ __html: description }}></p>
<div className='control-card__infoLink'>
<img src={rightArrow} alt='arrow' />
</div>
</div>
</Link>)
}
import rightArrow from "../../images/arrowRight.svg";
import "./CardControl.scss";
export const CardControl = ({ title, path, description, img }) => {
return (
<Link to={`/${path}`} className="control-card">
<div className="control-card__about">
<img src={img} alt="itemImg" />
<h3>{title}</h3>
</div>
<div className="control-card__info">
<p dangerouslySetInnerHTML={{ __html: description }}></p>
<div className="control-card__infoLink">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
);
};

43
src/components/CategoriesItem/CategoriesItem.js
View File

@@ -1,25 +1,30 @@
import React from "react";
import {Link} from "react-router-dom";
import { Link } from "react-router-dom";
import rightArrow from "../../images/arrowRight.png"
import rightArrow from "../../images/arrowRight.svg";
import './categoriesItem.scss'
import "./categoriesItem.scss";
export const CategoriesItem = ({img, title, skills, available, link}) => {
return(
<Link to={link} className={available ? "categoriesItem" : "categoriesItem categoriesItem__disable"}>
<div className='categoriesItem__title'>
<img src={img} alt='img' />
<h5>{title}</h5>
</div>
<div className='categoriesItem__description'>
<p>{skills}</p>
<div className='more'>
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
)
export const CategoriesItem = ({ img, title, skills, available, link }) => {
return (
<Link
to={link}
className={
available ? "categoriesItem" : "categoriesItem categoriesItem__disable"
}
>
<div className="categoriesItem__title">
<img src={img} alt="img" />
<h5>{title}</h5>
</div>
<div className="categoriesItem__description">
<p>{skills}</p>
<div className="more">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
);
};
export default CategoriesItem
export default CategoriesItem;

11
src/components/FrequentlyAskedQuestionsItem/FrequentlyAskedQuestionsItem.jsx
View File

@@ -1,14 +1,17 @@
import React from "react";
import "./FrequentlyAskedQuestionsItem.scss";
import { FREQUENTLY_ASKED_QUESTION_ROUTE } from "../../constants/router-path";
import { Link } from "react-router-dom";
import questionIcon from "./../../images/faq/question.svg";
import "./FrequentlyAskedQuestionsItem.scss";
export const FrequentlyAskedQuestionsItem = ({ rubric }) => {
return (
<div className="frequently-asked-questions-item">
<div className="frequently-asked-questions-item__head">
<div className="frequently-asked-questions-item__icon-question"><img src={questionIcon} alt="" /></div>
<div className="frequently-asked-questions-item__icon-question">
<img src={questionIcon} alt="" />
</div>
<div className="frequently-asked-questions-item__title">
{rubric?.title}
</div>
@@ -16,7 +19,7 @@ export const FrequentlyAskedQuestionsItem = ({ rubric }) => {
{rubric?.questions?.map((question) => (
<Link
key={question.id}
to={FREQUENTLY_ASKED_QUESTION_ROUTE + "/" + question.id}
to={`/frequently-asked-question/${question.id}`}
className="frequently-asked-questions-item__body"
>
<p>{question.title}</p>

136
src/components/Outstaffing/Outstaffing.js
View File

@@ -1,28 +1,30 @@
import React from 'react'
import {useSelector, useDispatch} from 'react-redux'
import React from "react";
import { useSelector, useDispatch } from "react-redux";
import OutstaffingBlock from '../OutstaffingBlock/OutstaffingBlock'
import TagSelect from '../Select/TagSelect'
import OutstaffingBlock from "../OutstaffingBlock/OutstaffingBlock";
import TagSelect from "../Select/TagSelect";
import {selectTags, getPositionId, setPositionId} from '../../redux/outstaffingSlice'
import front from './images/front_end.png'
import back from './images/back_end.png'
import design from './images/design.png'
import './outstaffing.scss'
import {
selectTags,
getPositionId,
setPositionId,
} from "../../redux/outstaffingSlice";
import front from "../../images/front-end.webp";
import back from "../../images/back-end.webp";
import design from "../../images/design.webp";
import "./outstaffing.scss";
const createSelectPositionHandler =
({positionId, setPositionId, dispatch}) =>
(id) => {
if (id === positionId) {
dispatch(setPositionId(null))
} else {
dispatch(setPositionId(id))
}
};
({ positionId, setPositionId, dispatch }) =>
(id) => {
if (id === positionId) {
dispatch(setPositionId(null));
} else {
dispatch(setPositionId(id));
}
};
const Outstaffing = () => {
const dispatch = useDispatch();
@@ -32,56 +34,56 @@ const Outstaffing = () => {
const onSelectPosition = createSelectPositionHandler({
positionId,
setPositionId,
dispatch
dispatch,
});
return (
<>
<section className='outstaffing'>
<div className='row'>
<div className='col-12 col-xl-4'>
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === 'skills_front')
}
img={front}
header='Frontend разработчики'
positionId='2'
isSelected={positionId === '2'}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
<div className='col-12 col-xl-4'>
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === 'skills_back')
}
img={back}
header='Backend разработчики'
positionId='1'
isSelected={positionId === '1'}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
<div className='col-12 col-xl-4'>
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === 'skills_design')
}
img={design}
header='Дизайн проектов'
positionId='5'
isSelected={positionId === '5'}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
<>
<section className="outstaffing">
<div className="row">
<div className="col-12 col-xl-4">
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === "skills_front")
}
img={front}
header="Frontend разработчики"
positionId="2"
isSelected={positionId === "2"}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
</section>
<TagSelect/>
</>
)
<div className="col-12 col-xl-4">
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === "skills_back")
}
img={back}
header="Backend разработчики"
positionId="1"
isSelected={positionId === "1"}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
<div className="col-12 col-xl-4">
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === "skills_design")
}
img={design}
header="Дизайн проектов"
positionId="5"
isSelected={positionId === "5"}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
</div>
</section>
<TagSelect />
</>
);
};
export default Outstaffing
export default Outstaffing;

BIN
src/components/Outstaffing/images/back_end.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 15 KiB

BIN
src/components/Outstaffing/images/design.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 19 KiB

BIN
src/components/Outstaffing/images/front_end.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 14 KiB

48
src/components/features/quiz/CardAviableTest.js
View File

@@ -1,34 +1,38 @@
import React from 'react'
import { Link } from 'react-router-dom'
import rightArrow from "../../../images/arrowRight.png"
import StarRating from '../../StarRating/StarRating'
import React from "react";
import { Link } from "react-router-dom";
import rightArrow from "../../../images/arrowRight.svg";
import StarRating from "../../StarRating/StarRating";
export const CardAvailableTest = ({ title, description, path, passedTest }) => {
return (
<div className='card-available-test'>
<Link to={`/${path}`} className="card-available-test__container" style={{ opacity: passedTest ? 0.3 : 1, pointerEvents: passedTest ? 'none' : 'all' }}>
<div className='card-available-test__top-head'>
<div className="card-available-test">
<Link
to={`/${path}`}
className="card-available-test__container"
style={{
opacity: passedTest ? 0.3 : 1,
pointerEvents: passedTest ? "none" : "all",
}}
>
<div className="card-available-test__top-head">
<StarRating />
<h3 className='card-available-test__title'>{title}</h3>
<h3 className="card-available-test__title">{title}</h3>
</div>
<div className='card-available-test__info'>
<div className="card-available-test__info">
<p dangerouslySetInnerHTML={{ __html: description }}></p>
<div className='card-available-test__infoLink'>
<img src={rightArrow} alt='arrow' />
<div className="card-available-test__infoLink">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
{passedTest && <div className='card-available-test__finished'>
<p>
Получить отчет по тестированию
</p>
<Link to={'/quiz/report'}>Отчет по тесту</Link>
</div>}
{passedTest && (
<div className="card-available-test__finished">
<p>Получить отчет по тестированию</p>
<Link to={"/quiz/report"}>Отчет по тесту</Link>
</div>
)}
</div>
)
}
);
};