Commit 742d5d82 authored by Ian Sillitoe's avatar Ian Sillitoe
Browse files

update spacing

parent 4aa846c5
......@@ -112,18 +112,18 @@ FunfamMatchTableHead.propTypes = {
const toolbarStyles = theme => ({
root: {
paddingRight: theme.spacing.unit
paddingRight: theme.spacing(1)
},
highlight:
theme.palette.type === "light"
? {
color: theme.palette.secondary.main,
backgroundColor: lighten(theme.palette.secondary.light, 0.85)
}
color: theme.palette.secondary.main,
backgroundColor: lighten(theme.palette.secondary.light, 0.85)
}
: {
color: theme.palette.text.primary,
backgroundColor: theme.palette.secondary.dark
},
color: theme.palette.text.primary,
backgroundColor: theme.palette.secondary.dark
},
spacer: {
flex: "1 1 100%"
},
......@@ -150,10 +150,10 @@ let FunfamMatchTableToolbar = props => {
{numSelected} selected
</Typography>
) : (
<Typography variant="h6" id="tableTitle">
Domain Matches
<Typography variant="h6" id="tableTitle">
Domain Matches
</Typography>
)}
)}
</div>
<div className={classes.spacer} />
<div className={classes.actions}>
......@@ -164,12 +164,12 @@ let FunfamMatchTableToolbar = props => {
</IconButton>
</Tooltip>
) : (
<Tooltip title="Filter list">
<IconButton aria-label="Filter list">
<FilterListIcon />
</IconButton>
</Tooltip>
)}
<Tooltip title="Filter list">
<IconButton aria-label="Filter list">
<FilterListIcon />
</IconButton>
</Tooltip>
)}
</div>
</Toolbar>
);
......@@ -187,7 +187,7 @@ FunfamMatchTableToolbar = withStyles(toolbarStyles)(FunfamMatchTableToolbar);
const styles = theme => ({
root: {
width: "100%",
marginTop: theme.spacing.unit * 1
marginTop: theme.spacing(1)
},
table: {
minWidth: 1020
......
......@@ -3,29 +3,29 @@ import PropTypes from "prop-types";
import { withStyles } from '@material-ui/core/styles';
const styles = theme => ({
root: {
flexGrow: 1,
padding: theme.spacing.unit * 2,
},
root: {
flexGrow: 1,
padding: theme.spacing(2),
},
});
class ModelStructure extends Component {
static propTypes = {
apiBase: PropTypes.string.isRequired,
submitEndpoint: PropTypes.string.isRequired,
checkEndpoint: PropTypes.string.isRequired,
resultsEndpoint: PropTypes.string.isRequired,
checkTimeout: PropTypes.number.isRequired,
checkMaxAttempts: PropTypes.number.isRequired,
queryId: PropTypes.string.isRequired,
querySequence: PropTypes.string.isRequired,
};
render() {
const { data, loaded, placeholder } = this.state;
return loaded ? data : <p>{placeholder}</p>;
}
static propTypes = {
apiBase: PropTypes.string.isRequired,
submitEndpoint: PropTypes.string.isRequired,
checkEndpoint: PropTypes.string.isRequired,
resultsEndpoint: PropTypes.string.isRequired,
checkTimeout: PropTypes.number.isRequired,
checkMaxAttempts: PropTypes.number.isRequired,
queryId: PropTypes.string.isRequired,
querySequence: PropTypes.string.isRequired,
};
render() {
const { data, loaded, placeholder } = this.state;
return loaded ? data : <p>{placeholder}</p>;
}
}
ModelStructure.propTypes = {
......
......@@ -10,7 +10,7 @@ import SelectTemplateTable from './SelectTemplateTable.js';
const styles = theme => ({
root: {
flexGrow: 1,
padding: theme.spacing.unit * 2,
padding: theme.spacing(2),
},
});
......@@ -37,7 +37,7 @@ class SelectTemplateStep extends Component {
}
renderContent() {
const { data } = this.props.data;
return(
return (
<div className={classes.root}>
<SelectTemplateTable data={data} />
</div>
......@@ -52,7 +52,7 @@ class SelectTemplateStep extends Component {
} else {
return this.renderError();
}
}
}
}
SelectTemplateStep.propTypes = {
......
......@@ -115,7 +115,7 @@ SelectTemplateTableHead.propTypes = {
const toolbarStyles = theme => ({
root: {
paddingRight: theme.spacing.unit,
paddingRight: theme.spacing(1),
},
highlight:
theme.palette.type === 'light'
......@@ -188,7 +188,7 @@ SelectTemplateTableToolbar = withStyles(toolbarStyles)(SelectTemplateTableToolba
const styles = theme => ({
root: {
width: '100%',
marginTop: theme.spacing.unit * 1,
marginTop: theme.spacing(1),
},
table: {
minWidth: 1020,
......
......@@ -16,11 +16,11 @@ const styles = theme => ({
alignItems: 'center',
},
wrapper: {
margin: theme.spacing.unit,
margin: theme.spacing(1),
position: 'relative',
},
});
class StepProgress extends Component {
constructor(props) {
......@@ -32,7 +32,7 @@ class StepProgress extends Component {
message: 'No message',
};
}
render() {
const { loading, success, error, message } = this.state;
const { classes } = this.props;
......@@ -40,14 +40,14 @@ class StepProgress extends Component {
return (
<div className={classes.root}>
<div className={classes.wrapper}>
<Button
variant="fab"
color="primary"
onClick={this.handleButtonClick}
>
{success ? <CheckIcon /> : <SaveIcon />}
</Button>
{loading && <CircularProgress size={68} />}
<Button
variant="fab"
color="primary"
onClick={this.handleButtonClick}
>
{success ? <CheckIcon /> : <SaveIcon />}
</Button>
{loading && <CircularProgress size={68} />}
</div>
</div>
);
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment