Added tasks page prepared.

This commit is contained in:
FilipHalon 2020-01-20 03:17:09 +01:00
parent df07975da1
commit 193abe4f3f
4 changed files with 40 additions and 6 deletions

13
pages/added-tasks.js Normal file
View File

@ -0,0 +1,13 @@
import Sidebar from './components/Sidebar';
import ActiveTasks from './components/ActiveTasks';
const AddedTasksPage = () => {
return (
<main>
<Sidebar />
<ActiveTasks ownTasks="ownTasks"/>
</main>
)
};
export default AddedTasksPage;

View File

@ -1,7 +1,9 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faTasks } from '@fortawesome/free-solid-svg-icons'; import { faTasks, faPaperPlane } from '@fortawesome/free-solid-svg-icons';
const ActiveTask = props => {
const isOwnTask = props.ownTask === "ownTask";
const ActiveTask = () => {
return ( return (
<div className="active-task"> <div className="active-task">
<div className="recent-task"> <div className="recent-task">
@ -13,10 +15,21 @@ const ActiveTask = () => {
<span><image src="/UAM-logo-siw-amu.jpg" alt="" /></span> <span><image src="/UAM-logo-siw-amu.jpg" alt="" /></span>
</div> </div>
<div className="active-task-summary"> <div className="active-task-summary">
{isOwnTask ?
<span>
Autor rozwiązania: Jan Kowalski
</span>
:
<span> <span>
Twoim zadaniem będzie posortowanie ciągu liczb całkowitych. Jednakże nie podajemy ograniczenia na liczbę elementów tego ciągu. Napisz program, który będzie fajny. Twoim zadaniem będzie posortowanie ciągu liczb całkowitych. Jednakże nie podajemy ograniczenia na liczbę elementów tego ciągu. Napisz program, który będzie fajny.
</span> </span>
}
</div> </div>
{isOwnTask &&
<div className="solution-add-message-bottom">
<button><FontAwesomeIcon icon={faPaperPlane} /> Wyślij wiadomość</button>
</div>
}
<div> <div>
<span>1 godzinę temu</span> <span>1 godzinę temu</span>
<span>Zobacz <FontAwesomeIcon icon={faTasks} /> </span> <span>Zobacz <FontAwesomeIcon icon={faTasks} /> </span>

View File

@ -1,9 +1,12 @@
import ActiveTask from "./ActiveTask" import ActiveTask from "./ActiveTask"
const ActiveTasks = () => { const ActiveTasks = props => {
const isOwnTask = props.ownTasks === "ownTasks";
return ( return (
<section className="task-description"> <section className="task-description">
<div className="task-description"> <div className="task-description">
{!isOwnTask &&
<div className="task-general-info"> <div className="task-general-info">
<div> <div>
<h2>Zadania</h2> <h2>Zadania</h2>
@ -11,10 +14,11 @@ const ActiveTasks = () => {
{/* <p>Firmy: 100</p> */} {/* <p>Firmy: 100</p> */}
</div> </div>
</div> </div>
}
<div className="task-area"> <div className="task-area">
<ActiveTask /> <ActiveTask ownTask={isOwnTask && "ownTask"}/>
<ActiveTask /> <ActiveTask ownTask={isOwnTask && "ownTask"}/>
<ActiveTask /> <ActiveTask ownTask={isOwnTask && "ownTask"}/>
</div> </div>
</div> </div>
</section> </section>

View File

@ -261,6 +261,10 @@ main {
} }
section.task-description{
width: 100%;
}
div.task-description { div.task-description {
/* position: absolute; /* position: absolute;
left: 350px; */ left: 350px; */