Cleaned up Taskview Index
This commit is contained in:
parent
0280d5bd3a
commit
25312a6d93
4 changed files with 23 additions and 85 deletions
7
main.js
7
main.js
File diff suppressed because one or more lines are too long
|
|
@ -5,28 +5,28 @@ import Todoview from "./Todoview"
|
||||||
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
|
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
|
||||||
|
|
||||||
export default function Index(props: any){
|
export default function Index(props: any){
|
||||||
const display = <div id="classDisplay">
|
const display = <div className="taskView">
|
||||||
<Tabs>
|
<Tabs>
|
||||||
<TabList>
|
<TabList>
|
||||||
<Tab>
|
<Tab>
|
||||||
<span className="material-icons md-24">task_alt</span>
|
<span className="material-icons md-24">task_alt</span>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab>
|
<Tab>
|
||||||
<span className="material-icons">today</span>
|
<span className="material-icons">today</span>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab>
|
<Tab>
|
||||||
<span className="material-icons">add_circle_outline</span>
|
<span className="material-icons">add_circle_outline</span>
|
||||||
</Tab>
|
</Tab>
|
||||||
</TabList>
|
</TabList>
|
||||||
<TabPanel>
|
<TabPanel>
|
||||||
<Habitsview habits={props.data.habits} onChange={props.handleChangeHabits}/>
|
<Habitsview habits={props.data.habits} onChange={props.handleChangeHabits}/>
|
||||||
</TabPanel>
|
</TabPanel>
|
||||||
<TabPanel>
|
<TabPanel>
|
||||||
<Dailiesview dailys={props.data.dailys} onChange={props.handleChangeDailys} />
|
<Dailiesview dailys={props.data.dailys} onChange={props.handleChangeDailys} />
|
||||||
</TabPanel>
|
</TabPanel>
|
||||||
<TabPanel>
|
<TabPanel>
|
||||||
<Todoview todos={props.data.todos} onChange={props.handleChangeTodos} />
|
<Todoview todos={props.data.todos} onChange={props.handleChangeTodos} />
|
||||||
</TabPanel>
|
</TabPanel>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
</div>
|
</div>
|
||||||
return(display);
|
return(display);
|
||||||
|
|
|
||||||
|
|
@ -1,58 +0,0 @@
|
||||||
.react-tabs {
|
|
||||||
-webkit-tap-highlight-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-tabs__tab-list {
|
|
||||||
border-bottom: 1px solid #aaa;
|
|
||||||
margin: 0 0 10px;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-tabs__tab {
|
|
||||||
display: inline-block;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
border-bottom: none;
|
|
||||||
bottom: -1px;
|
|
||||||
position: relative;
|
|
||||||
list-style: none;
|
|
||||||
padding: 6px 12px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-tabs__tab--selected {
|
|
||||||
background: #fff;
|
|
||||||
border-color: #aaa;
|
|
||||||
color: black;
|
|
||||||
border-radius: 5px 5px 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-tabs__tab--disabled {
|
|
||||||
color: GrayText;
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-tabs__tab:focus {
|
|
||||||
box-shadow: 0 0 5px hsl(208, 99%, 50%);
|
|
||||||
border-color: hsl(208, 99%, 50%);
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.re
|
|
||||||
|
|
||||||
.react-tabs__tab:focus:after {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
height: 5px;
|
|
||||||
left: -4px;
|
|
||||||
right: -4px;
|
|
||||||
bottom: -5px;
|
|
||||||
background: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-tabs__tab-panel {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-tabs__tab-panel--selected {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
import * as React from "react"
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue