DRY-er Container with title

This commit is contained in:
Jaco Greeff 2016-11-29 11:58:00 +01:00
parent cfc1dabd57
commit b6efd6b1fd
7 changed files with 14 additions and 22 deletions

View File

@ -16,7 +16,7 @@
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { Container, ContainerTitle } from '../../../ui'; import { Container } from '../../../ui';
import Event from './Event'; import Event from './Event';
import styles from '../contract.css'; import styles from '../contract.css';
@ -48,8 +48,7 @@ export default class Events extends Component {
}); });
return ( return (
<Container> <Container title='events'>
<ContainerTitle title='events' />
<table className={ styles.events }> <table className={ styles.events }>
<tbody>{ list }</tbody> <tbody>{ list }</tbody>
</table> </table>

View File

@ -19,7 +19,7 @@ import React, { Component, PropTypes } from 'react';
import { Card, CardTitle, CardText } from 'material-ui/Card'; import { Card, CardTitle, CardText } from 'material-ui/Card';
import InputQuery from './inputQuery'; import InputQuery from './inputQuery';
import { Container, ContainerTitle, Input, InputAddress } from '../../../ui'; import { Container, Input, InputAddress } from '../../../ui';
import styles from './queries.css'; import styles from './queries.css';
@ -55,8 +55,7 @@ export default class Queries extends Component {
.map((fn) => this.renderInputQuery(fn)); .map((fn) => this.renderInputQuery(fn));
return ( return (
<Container> <Container title='queries'>
<ContainerTitle title='queries' />
<div className={ styles.methods }> <div className={ styles.methods }>
<div className={ styles.vMethods }> <div className={ styles.vMethods }>
{ noInputQueries } { noInputQueries }

View File

@ -19,7 +19,7 @@ import { connect } from 'react-redux';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import NavigationRefresh from 'material-ui/svg-icons/navigation/refresh'; import NavigationRefresh from 'material-ui/svg-icons/navigation/refresh';
import { Button, Container, ContainerTitle, ParityBackground } from '../../../ui'; import { Button, Container, ParityBackground } from '../../../ui';
import { updateBackground } from '../actions'; import { updateBackground } from '../actions';
@ -55,8 +55,7 @@ class Background extends Component {
render () { render () {
return ( return (
<Container> <Container title='Background Pattern'>
<ContainerTitle title='Background Pattern' />
<div className={ layout.layout }> <div className={ layout.layout }>
<div className={ layout.overview }> <div className={ layout.overview }>
<div>The background pattern you can see right now is unique to your Parity installation. It will change every time you create a new Signer token. This is so that decentralized applications cannot pretend to be trustworthy.</div> <div>The background pattern you can see right now is unique to your Parity installation. It will change every time you create a new Signer token. This is so that decentralized applications cannot pretend to be trustworthy.</div>

View File

@ -17,7 +17,7 @@
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { MenuItem } from 'material-ui'; import { MenuItem } from 'material-ui';
import { Select, Container, ContainerTitle } from '../../../ui'; import { Select, Container } from '../../../ui';
import layout from '../layout.css'; import layout from '../layout.css';
@ -43,8 +43,7 @@ export default class Parity extends Component {
render () { render () {
return ( return (
<Container> <Container title='Parity'>
<ContainerTitle title='Parity' />
<div className={ layout.layout }> <div className={ layout.layout }>
<div className={ layout.overview }> <div className={ layout.overview }>
<div>Control the Parity node settings and mode of operation via this interface.</div> <div>Control the Parity node settings and mode of operation via this interface.</div>

View File

@ -16,7 +16,7 @@
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { Container, ContainerTitle } from '../../../ui'; import { Container } from '../../../ui';
import layout from '../layout.css'; import layout from '../layout.css';
import styles from './proxy.css'; import styles from './proxy.css';
@ -31,8 +31,7 @@ export default class Proxy extends Component {
const proxyurl = `${dappsUrl}/proxy/proxy.pac`; const proxyurl = `${dappsUrl}/proxy/proxy.pac`;
return ( return (
<Container> <Container title='Proxy'>
<ContainerTitle title='Proxy' />
<div className={ layout.layout }> <div className={ layout.layout }>
<div className={ layout.overview }> <div className={ layout.overview }>
<div>The proxy setup allows you to access Parity and all associated decentralized applications via memorable addresses.</div> <div>The proxy setup allows you to access Parity and all associated decentralized applications via memorable addresses.</div>

View File

@ -19,7 +19,7 @@ import { connect } from 'react-redux';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import { Checkbox } from 'material-ui'; import { Checkbox } from 'material-ui';
import { Container, ContainerTitle } from '../../../ui'; import { Container } from '../../../ui';
import { toggleView } from '../actions'; import { toggleView } from '../actions';
@ -34,8 +34,7 @@ class Views extends Component {
render () { render () {
return ( return (
<Container> <Container title='Views'>
<ContainerTitle title='Views' />
<div className={ layout.layout }> <div className={ layout.layout }>
<div className={ layout.overview }> <div className={ layout.overview }>
<div>Manage the available application views, using only the parts of the application that is applicable to you.</div> <div>Manage the available application views, using only the parts of the application that is applicable to you.</div>

View File

@ -20,7 +20,7 @@ import AvPlay from 'material-ui/svg-icons/av/play-arrow';
import AvReplay from 'material-ui/svg-icons/av/replay'; import AvReplay from 'material-ui/svg-icons/av/replay';
import ReorderIcon from 'material-ui/svg-icons/action/reorder'; import ReorderIcon from 'material-ui/svg-icons/action/reorder';
import { Container, ContainerTitle } from '../../../../ui'; import { Container } from '../../../../ui';
import styles from './Debug.css'; import styles from './Debug.css';
@ -42,9 +42,7 @@ export default class Debug extends Component {
const { devLogsLevels } = nodeStatus; const { devLogsLevels } = nodeStatus;
return ( return (
<Container> <Container title='Node Logs'>
<ContainerTitle
title='Node Logs' />
{ this.renderActions() } { this.renderActions() }
<h2 className={ styles.subheader }> <h2 className={ styles.subheader }>
{ devLogsLevels || '-' } { devLogsLevels || '-' }