Merge pull request #1009 from embark-framework/features/icons-for-explorer

Add icons for the contract page
This commit is contained in:
Iuri Matias 2018-10-30 20:46:23 +01:00 committed by GitHub
commit 4ee0f38278
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 9 deletions

View File

@ -1,5 +1,6 @@
import PropTypes from "prop-types";
import React from 'react';
import FontAwesomeIcon from "react-fontawesome";
import { TabContent, TabPane, Nav, NavItem, NavLink, Card, CardBody, CardTitle } from 'reactstrap';
import classnames from 'classnames';
@ -37,7 +38,7 @@ class ContractLayout extends React.Component {
className={classnames({ active: this.state.activeTab === '1' })}
onClick={() => { this.toggle('1'); }}
>
Overview
<FontAwesomeIcon className="mr-2" name="bolt" />Interact
</NavLink>
</NavItem>
<NavItem>
@ -45,7 +46,7 @@ class ContractLayout extends React.Component {
className={classnames({ active: this.state.activeTab === '2' })}
onClick={() => { this.toggle('2'); }}
>
Detail
<FontAwesomeIcon className="mr-2" name="info-circle" />Details
</NavLink>
</NavItem>
<NavItem>
@ -53,7 +54,7 @@ class ContractLayout extends React.Component {
className={classnames({ active: this.state.activeTab === '3' })}
onClick={() => { this.toggle('3'); }}
>
Transactions
<FontAwesomeIcon className="mr-2" name="list-alt" />Transactions
</NavLink>
</NavItem>
<NavItem>
@ -61,7 +62,7 @@ class ContractLayout extends React.Component {
className={classnames({ active: this.state.activeTab === '4' })}
onClick={() => { this.toggle('4'); }}
>
Debugger
<FontAwesomeIcon className="mr-2" name="bug" />Debugger
</NavLink>
</NavItem>
</Nav>

View File

@ -36,16 +36,16 @@ class TextEditorToolbar extends Component {
{this.props.isContract &&
<React.Fragment>
<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 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 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 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>
</React.Fragment>
}

View File

@ -21,7 +21,7 @@ class TextEditorAsideContainer extends Component {
case 'debugger':
return (
<React.Fragment>
<h2>{contract.className} - Details</h2>
<h2>{contract.className} - Debugger</h2>
<ContractDebuggerContainer key={index} contract={contract}/>
</React.Fragment>
);