Compare commits
1 Commits
master
...
feat-event
Author | SHA1 | Date | |
---|---|---|---|
|
bc62cc71ae |
@ -1,13 +1,20 @@
|
|||||||
|
import React, { useState } from 'react';
|
||||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||||
import { faSearch } from '@fortawesome/free-solid-svg-icons';
|
import { faSearch } from '@fortawesome/free-solid-svg-icons';
|
||||||
import RecentTask from './RecentTask';
|
import RecentTask from './RecentTask';
|
||||||
|
|
||||||
const Sidebar = () => {
|
const Sidebar = () => {
|
||||||
|
const [recentTasks, setRecentTasks] = useState([]);
|
||||||
|
|
||||||
|
const handleSearch = e => {
|
||||||
|
const searchPhrase = e.target.value;
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className="sidebar">
|
<section className="sidebar">
|
||||||
<div className="search-area">
|
<div className="search-area">
|
||||||
<FontAwesomeIcon icon={faSearch} />
|
<FontAwesomeIcon icon={faSearch} />
|
||||||
<input type="text" placeholder="Wyszukaj"/>
|
<input type="text" placeholder="Wyszukaj" onChange={handleSearch}/>
|
||||||
</div>
|
</div>
|
||||||
<div className="recent-task-list">
|
<div className="recent-task-list">
|
||||||
<div>Ostatnie zadania</div>
|
<div>Ostatnie zadania</div>
|
||||||
|
15
style.css
15
style.css
@ -275,7 +275,8 @@ button:hover {
|
|||||||
/* tasks */
|
/* tasks */
|
||||||
|
|
||||||
main {
|
main {
|
||||||
display: flex;
|
display: grid;
|
||||||
|
grid: auto / 3fr 7fr;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -283,17 +284,17 @@ main {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
section.task-description{
|
/* section.task-description{
|
||||||
width: 100%;
|
width: 70%;
|
||||||
}
|
} */
|
||||||
|
|
||||||
div.task-description {
|
div.task-description {
|
||||||
/* position: absolute;
|
/* position: absolute;
|
||||||
left: 350px; */
|
left: 350px; */
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
width: 100%;
|
/* width: 100%; */
|
||||||
max-width: 900px;
|
/* max-width: 900px; */
|
||||||
margin: 10%;
|
margin: 10%;
|
||||||
|
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
@ -411,7 +412,7 @@ div.task-description {
|
|||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
/* position: absolute; */
|
/* position: absolute; */
|
||||||
width: 500px;
|
/* width: 30%; */
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border: var(--sidebar-border);
|
border: var(--sidebar-border);
|
||||||
background: #F6F9FC;
|
background: #F6F9FC;
|
||||||
|
Loading…
Reference in New Issue
Block a user