Profile page ready.

pages/components/Profile.js

@@ -0,0 +1,19 @@
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faTasks, faCloud, faSearch } from '@fortawesome/free-solid-svg-icons';
+
+const Profile = props => {
+    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>
+                </div>
+            </div>
+        </section>
+    )
+};
+
+export default Profile;

pages/profile.js

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

style.css

@@ -656,3 +656,33 @@ form.solution-add-area > div:last-of-type button {
 form.solution-add-area > div:last-of-type button:hover {
     background-color: var(--button-green-hover);
 }
+
+/* profile */
+
+.profile-action {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 200px;
+    border-radius: 4px;
+    box-shadow: 0px 7px 14px #32325D1A;
+    background: #FFF;
+    font-size: 130%;
+    cursor: pointer;
+    transition: .4s;
+}
+
+.profile-action:hover {
+    background: #838DAC;
+    color: #FFF;
+}
+
+.profile-action span {
+    padding-right: .5rem;
+    padding-bottom: .5rem;
+}
+
+.profile-action svg {
+    font-size: 140%;
+    color: var(--button-orange)
+}