mirror of https://github.com/embarklabs/embark.git
Merge pull request #1009 from embark-framework/features/icons-for-explorer
Add icons for the contract page
This commit is contained in:
commit
4ee0f38278
|
@ -1,5 +1,6 @@
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import FontAwesomeIcon from "react-fontawesome";
|
||||||
import { TabContent, TabPane, Nav, NavItem, NavLink, Card, CardBody, CardTitle } from 'reactstrap';
|
import { TabContent, TabPane, Nav, NavItem, NavLink, Card, CardBody, CardTitle } from 'reactstrap';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
|
||||||
|
@ -37,7 +38,7 @@ class ContractLayout extends React.Component {
|
||||||
className={classnames({ active: this.state.activeTab === '1' })}
|
className={classnames({ active: this.state.activeTab === '1' })}
|
||||||
onClick={() => { this.toggle('1'); }}
|
onClick={() => { this.toggle('1'); }}
|
||||||
>
|
>
|
||||||
Overview
|
<FontAwesomeIcon className="mr-2" name="bolt" />Interact
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</NavItem>
|
</NavItem>
|
||||||
<NavItem>
|
<NavItem>
|
||||||
|
@ -45,7 +46,7 @@ class ContractLayout extends React.Component {
|
||||||
className={classnames({ active: this.state.activeTab === '2' })}
|
className={classnames({ active: this.state.activeTab === '2' })}
|
||||||
onClick={() => { this.toggle('2'); }}
|
onClick={() => { this.toggle('2'); }}
|
||||||
>
|
>
|
||||||
Detail
|
<FontAwesomeIcon className="mr-2" name="info-circle" />Details
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</NavItem>
|
</NavItem>
|
||||||
<NavItem>
|
<NavItem>
|
||||||
|
@ -53,7 +54,7 @@ class ContractLayout extends React.Component {
|
||||||
className={classnames({ active: this.state.activeTab === '3' })}
|
className={classnames({ active: this.state.activeTab === '3' })}
|
||||||
onClick={() => { this.toggle('3'); }}
|
onClick={() => { this.toggle('3'); }}
|
||||||
>
|
>
|
||||||
Transactions
|
<FontAwesomeIcon className="mr-2" name="list-alt" />Transactions
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</NavItem>
|
</NavItem>
|
||||||
<NavItem>
|
<NavItem>
|
||||||
|
@ -61,7 +62,7 @@ class ContractLayout extends React.Component {
|
||||||
className={classnames({ active: this.state.activeTab === '4' })}
|
className={classnames({ active: this.state.activeTab === '4' })}
|
||||||
onClick={() => { this.toggle('4'); }}
|
onClick={() => { this.toggle('4'); }}
|
||||||
>
|
>
|
||||||
Debugger
|
<FontAwesomeIcon className="mr-2" name="bug" />Debugger
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</NavItem>
|
</NavItem>
|
||||||
</Nav>
|
</Nav>
|
||||||
|
|
|
@ -36,16 +36,16 @@ class TextEditorToolbar extends Component {
|
||||||
{this.props.isContract &&
|
{this.props.isContract &&
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Overview)})} onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Overview)}>
|
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Overview)})} onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Overview)}>
|
||||||
<FontAwesomeIcon className="mr-2" name="bolt" /> Interact
|
<FontAwesomeIcon className="mr-2" name="bolt" />Interact
|
||||||
</NavLink>
|
</NavLink>
|
||||||
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Detail)})} href="#" onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Detail)}>
|
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Detail)})} href="#" onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Detail)}>
|
||||||
<FontAwesomeIcon className="mr-2" name="info-circle" /> Details
|
<FontAwesomeIcon className="mr-2" name="info-circle" />Details
|
||||||
</NavLink>
|
</NavLink>
|
||||||
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Transactions)})} href="#" onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Transactions)}>
|
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Transactions)})} href="#" onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Transactions)}>
|
||||||
<FontAwesomeIcon className="mr-2" name="list-alt" /> Transactions
|
<FontAwesomeIcon className="mr-2" name="list-alt" />Transactions
|
||||||
</NavLink>
|
</NavLink>
|
||||||
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Debugger)})} href="#" onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Debugger)}>
|
<NavLink className={classnames('btn', { active: this.isActiveTab(TextEditorToolbarTabs.Debugger)})} href="#" onClick={() => this.props.openAsideTab(TextEditorToolbarTabs.Debugger)}>
|
||||||
<FontAwesomeIcon className="mr-2" name="bug" /> Debugger
|
<FontAwesomeIcon className="mr-2" name="bug" />Debugger
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
}
|
}
|
||||||
|
|
|
@ -21,7 +21,7 @@ class TextEditorAsideContainer extends Component {
|
||||||
case 'debugger':
|
case 'debugger':
|
||||||
return (
|
return (
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<h2>{contract.className} - Details</h2>
|
<h2>{contract.className} - Debugger</h2>
|
||||||
<ContractDebuggerContainer key={index} contract={contract}/>
|
<ContractDebuggerContainer key={index} contract={contract}/>
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in New Issue