Add WIP TabsOption Component.
This commit is contained in:
parent
2cf54a8221
commit
5652c56995
|
@ -0,0 +1,65 @@
|
||||||
|
import React, {Component} from "react";
|
||||||
|
|
||||||
|
const tabs = [
|
||||||
|
{"name": "Generate Wallet"},
|
||||||
|
{"name": "Send Ether & Tokens"},
|
||||||
|
{"name": "Swap"},
|
||||||
|
{"name": "Send Offline"},
|
||||||
|
{"name": "Contracts"},
|
||||||
|
{"name": "View Wallet"},
|
||||||
|
{"name": "Help"}
|
||||||
|
|
||||||
|
]
|
||||||
|
|
||||||
|
export default class TabsOptions extends Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props)
|
||||||
|
this.state = {
|
||||||
|
showLeftArrow: false,
|
||||||
|
showRightArrow: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
tabClick() {
|
||||||
|
}
|
||||||
|
|
||||||
|
scrollLeft() {
|
||||||
|
}
|
||||||
|
|
||||||
|
scrollRight() {
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<nav role="navigation" aria-label="main navigation" className="container nav-container overflowing">
|
||||||
|
{this.state.showLeftArrow && <a aria-hidden="true" className="nav-arrow-left"
|
||||||
|
onClick={() => this.scrollLeft(100)}>«</a> }
|
||||||
|
<div className="nav-scroll">
|
||||||
|
<ul className="nav-inner">
|
||||||
|
{tabs.map((object, i) => {
|
||||||
|
return (
|
||||||
|
<li className="nav-item"
|
||||||
|
key={i}
|
||||||
|
onClick={this.tabClick(i)}>
|
||||||
|
<a tabIndex="0" aria-label="nav item: {{tab.name | translate}}">
|
||||||
|
{object.name}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
)}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{this.state.showRightArrow &&
|
||||||
|
<a aria-hidden="true" className="nav-arrow-right"
|
||||||
|
onClick={() => this.scrollRight(100)}
|
||||||
|
ng-mouseover="scrollHoverIn(false,2);" ng-mouseleave="scrollHoverOut()">»</a
|
||||||
|
>}
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue