s412146/tasko-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

More links added.

Browse Source
This commit is contained in:
FilipHalon 2020-01-20 13:11:45 +01:00
parent 2bc3b6f3d9
commit bd02838d6a
5 changed files with 55 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
pages/components/ActiveTask.js
View File

@ -1,3 +1,4 @@
import Link from 'next/link';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faTasks, faPaperPlane } from '@fortawesome/free-solid-svg-icons';
@ -32,7 +33,9 @@ const ActiveTask = props => {
}
<div>
<span>1 godzinę temu</span>
<span>Zobacz <FontAwesomeIcon icon={faTasks} /> </span>
<Link href="/tasks">
<span className="task-link">Zobacz <FontAwesomeIcon icon={faTasks} /> </span>
</Link>
</div>
</div>
)

13
pages/components/Header.js
View File

@ -2,7 +2,9 @@ import Link from 'next/link';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faCog, faTasks, faComments, faCommentDots, faUserPlus, faUser } from '@fortawesome/free-solid-svg-icons';
const Header = () => {
const Header = props => {
const isLogged = props.isLogged === "logged";
return (
<header>
<nav>
@ -35,12 +37,19 @@ const Header = () => {
</li>
</div>
<div className="navbar-auth">
{isLogged ?
<li>
<Link href="/profile">
<a>User name</a>
</Link>
</li>:
<li>
<Link href="/login">
<a><FontAwesomeIcon icon={faUser} /> Zaloguj się</a>
</Link>
</li>
<li>
}
<li className={isLogged ? "hidden" : ""}>
<Link href="/register">
<a><FontAwesomeIcon icon={faUserPlus} /> Zarejestruj się</a>
</Link>

23
pages/components/Profile.js
View File

@ -1,15 +1,30 @@
import Link from 'next/link';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faTasks, faCloud, faSearch } from '@fortawesome/free-solid-svg-icons';
const Profile = props => {
const isDeveloperAccount = props.accountType === "developer"
return (
<section className="task-description">
<div className="task-description">
<div className="task-area">
<div className="profile-action"><span><FontAwesomeIcon icon={faSearch} /></span><span>Przeglądaj zadania</span></div>
<div className="profile-action"><span><FontAwesomeIcon icon={faTasks} /></span><span>Dodaj zadanie</span></div>
<div className="profile-action"><span><FontAwesomeIcon icon={faSearch} /></span><span>Zobacz rozwiązania</span></div>
<div className="profile-action"><span><FontAwesomeIcon icon={faSearch} /></span><span>Zobacz wstawione zadania</span></div>
<Link href="/active-tasks">
<div className="profile-action"><span><FontAwesomeIcon icon={faSearch} /></span><span>Przeglądaj zadania</span></div>
</Link>
{!isDeveloperAccount &&
<Link href="/new-task-add">
<div className="profile-action"><span><FontAwesomeIcon icon={faTasks} /></span><span>Dodaj zadanie</span></div>
</Link>
}
<Link href="/added-tasks">
<div className="profile-action"><span><FontAwesomeIcon icon={faSearch} /></span><span>Zobacz rozwiązania</span></div>
</Link>
{!isDeveloperAccount &&
<Link href="/added-tasks">
<div className="profile-action"><span><FontAwesomeIcon icon={faSearch} /></span><span>Zobacz wstawione zadania</span></div>
</Link>
}
</div>
</div>
</section>

2
pages/profile.js
View File

@ -5,7 +5,7 @@ const ProfilePage = () => {
return (
<main>
<Sidebar/>
<Profile/>
<Profile accountType=""/>
</main>
)
};

25
style.css
View File

@ -30,6 +30,10 @@ body {
height: 100%;
}
.hidden {
display: none;
}
/* navbar */
header {
@ -72,6 +76,11 @@ nav a {
font-size: 80%;
}
nav a:hover {
background-color: #5D6CED;
color: #FFF;
}
@media (min-width: 400px) {
nav a {
font-size: 90%;
@ -86,11 +95,6 @@ nav img {
border: solid 1px rgba(255, 255, 255, .1);
}
.navbar-auth li:last-of-type a:last-of-type {
background-color: #5D6CED;
color: #FFF;
}
/* footer */
footer {
@ -541,7 +545,12 @@ div.task-description {
.active-task > div:last-of-type span:last-of-type {
border-radius: 4px;
color: #FFF;
background: var(--button-blue-hover);
}
.active-task > div:last-of-type span:last-of-type:hover {
background: var(--button-blue);
cursor: pointer;
}
/* active tasks */
@ -601,6 +610,12 @@ div.solution-add-area {
border-radius: 4px;
background: #212844;
color: #838DAC;
transition: .4s;
}
.solution-add-message-bottom button:hover {
background: #838DAC;
color: #212844;
}
.solution-add-status {