fix adaptive tracker tabs
This commit is contained in:
parent
8c68366152
commit
455be87e26
@ -616,7 +616,7 @@ export const TicketFullScreen = () => {
|
||||
<div className="tracker__tabs__head">
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab active-tab projectsTab"
|
||||
className="tab active-tab"
|
||||
onClick={() => toggleTabs(1)}
|
||||
>
|
||||
<img src={project} alt="img" />
|
||||
@ -624,7 +624,7 @@ export const TicketFullScreen = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab tasksTab"
|
||||
className="tab"
|
||||
onClick={() => toggleTabs(2)}
|
||||
>
|
||||
<img src={tasks} alt="img" />
|
||||
@ -632,7 +632,7 @@ export const TicketFullScreen = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab archiveTab"
|
||||
className="tab"
|
||||
onClick={() => toggleTabs(3)}
|
||||
>
|
||||
<img src={archive} alt="img" />
|
||||
|
@ -71,22 +71,6 @@ export const Navigation = () => {
|
||||
]
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (localStorage.getItem("role_status") === "18") {
|
||||
return;
|
||||
}
|
||||
// if (Object.keys(profileInfo).length) {
|
||||
// return;
|
||||
// }
|
||||
// apiRequest(`/user/me`).then((profileInfo) =>
|
||||
// dispatch(
|
||||
// setProfileInfo(
|
||||
// profileInfo.userCard ? profileInfo.userCard : profileInfo
|
||||
// )
|
||||
// )
|
||||
// );
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="profile-header__info">
|
||||
<div className="profile-header__container">
|
||||
|
@ -25,13 +25,13 @@ export const QuizReport = ({ info }) => {
|
||||
<div className="report__value">
|
||||
{Boolean(correctAnswers()) ? correctAnswers() : 0}
|
||||
</div>
|
||||
<div className="report__text">Правильных ответов</div>
|
||||
<div className="report__text">правильных ответов</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__value report__value_false">
|
||||
{Boolean(correctWrongAnswers()) ? correctWrongAnswers() : 0}
|
||||
</div>
|
||||
<div className="report__text">Не правильных ответов</div>
|
||||
<div className="report__text">неправильных ответов</div>
|
||||
</div>
|
||||
<div className="report__column">
|
||||
<div className="report__status-text">Статус:</div>
|
||||
|
@ -444,7 +444,7 @@ export const ProjectTracker = () => {
|
||||
<div className="tracker__tabs__head">
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab active-tab tab projectsTab"
|
||||
className="tab active-tab tab"
|
||||
onClick={() => dispatch(setToggleTab(1))}
|
||||
>
|
||||
<img src={project} alt="img" />
|
||||
@ -452,7 +452,7 @@ export const ProjectTracker = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab tasksTab"
|
||||
className="tab"
|
||||
onClick={() => dispatch(setToggleTab(2))}
|
||||
>
|
||||
<img src={tasks} alt="img" />
|
||||
@ -460,7 +460,7 @@ export const ProjectTracker = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab archiveTab"
|
||||
className="tab"
|
||||
onClick={() => dispatch(setToggleTab(3))}
|
||||
>
|
||||
<img src={archive} alt="img" />
|
||||
|
@ -76,7 +76,7 @@ const Statistics = () => {
|
||||
<div className="tracker__tabs__head">
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab active-tab projectsTab"
|
||||
className="tab active-tab"
|
||||
onClick={() => toggleTabs(1)}
|
||||
>
|
||||
<img src={project} alt="img" />
|
||||
@ -84,7 +84,7 @@ const Statistics = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab tasksTab"
|
||||
className="tab"
|
||||
onClick={() => toggleTabs(2)}
|
||||
>
|
||||
<img src={tasks} alt="img" />
|
||||
@ -92,7 +92,7 @@ const Statistics = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab archiveTab"
|
||||
className="tab"
|
||||
onClick={() => toggleTabs(3)}
|
||||
>
|
||||
<img src={archive} alt="img" />
|
||||
|
@ -51,7 +51,6 @@ export const Tracker = () => {
|
||||
const [allCompletedTasks, setAllCompletedTasks] = useState([]);
|
||||
|
||||
const [modalCreateProject, setModalCreateProject] = useState(false);
|
||||
const tabs = ["projectsTab", "tasksTab", "archiveTab"];
|
||||
|
||||
useEffect(() => {
|
||||
setLoader(true);
|
||||
@ -143,32 +142,28 @@ export const Tracker = () => {
|
||||
<div className="tracker__tabs">
|
||||
<div className="tracker__tabs__head">
|
||||
<div
|
||||
className={
|
||||
tab === 1 ? "tab active-tab projectsTab" : "tab projectsTab"
|
||||
}
|
||||
className={tab === 1 ? "tab active-tab" : "tab"}
|
||||
onClick={() => toggleTabs(1)}
|
||||
>
|
||||
<img src={project} alt="img" />
|
||||
<p>Проекты </p>
|
||||
</div>
|
||||
<div
|
||||
className={tab === 2 ? "tab active-tab tasksTab" : "tab tasksTab"}
|
||||
className={tab === 2 ? "tab active-tab" : "tab"}
|
||||
onClick={() => toggleTabs(2)}
|
||||
>
|
||||
<img src={tasks} alt="img" />
|
||||
<p>Все мои задачи</p>
|
||||
</div>
|
||||
<div
|
||||
className={
|
||||
tab === 3 ? "tab active-tab archiveTab" : "tab archiveTab"
|
||||
}
|
||||
className={tab === 3 ? "tab active-tab" : "tab"}
|
||||
onClick={() => toggleTabs(3)}
|
||||
>
|
||||
<img src={archive} alt="img" />
|
||||
<p>Архив</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className={`tracker__tabs__content ${tabs[tab - 1]}`}>
|
||||
<div className={`tracker__tabs__content`}>
|
||||
<div
|
||||
className={
|
||||
tab === 1
|
||||
|
@ -49,11 +49,9 @@
|
||||
height: 60px;
|
||||
|
||||
@media (max-width: 650px) {
|
||||
background: none;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
top: 15px;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@ -90,22 +88,19 @@
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
border-radius: 10px;
|
||||
flex-direction: column;
|
||||
padding: 20px;
|
||||
align-items: start;
|
||||
row-gap: 20px;
|
||||
height: auto !important;
|
||||
border-radius: 10px 10px 0 0;
|
||||
padding: 10px;
|
||||
align-items: center;
|
||||
|
||||
p {
|
||||
margin-left: 0;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.active-tab {
|
||||
background: white;
|
||||
border-radius: 12px 12px 5px 5px;
|
||||
border-radius: 12px 12px 0px 0px;
|
||||
position: relative;
|
||||
height: 73px;
|
||||
display: flex;
|
||||
@ -122,9 +117,7 @@
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
border-radius: 10px;
|
||||
align-items: start;
|
||||
top: 0;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -231,10 +224,6 @@
|
||||
padding: 0 15px 15px;
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
background-color: #dff1ff;
|
||||
}
|
||||
|
||||
&__wrapper {
|
||||
display: flex;
|
||||
max-width: 1400px;
|
||||
@ -1913,25 +1902,12 @@
|
||||
@media (max-width: 650px) {
|
||||
&__content {
|
||||
padding: 28px 0 0;
|
||||
background-color: #dff1ff;
|
||||
|
||||
.project {
|
||||
background-color: white;
|
||||
background-color: #eeeeee;
|
||||
max-width: 394px;
|
||||
}
|
||||
}
|
||||
|
||||
.projectsTab {
|
||||
background-color: #dff1ff;
|
||||
}
|
||||
|
||||
.tasksTab {
|
||||
background-color: #e8ffeb;
|
||||
}
|
||||
|
||||
.archiveTab {
|
||||
background-color: #ffecef;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user