From 7f74c429e3e814b7efc8dc7f480e333fffc20489 Mon Sep 17 00:00:00 2001
From: Chris Beer <cabeer@stanford.edu>
Date: Wed, 13 Mar 2019 11:38:47 -0700
Subject: [PATCH] Style the manifest form
---
src/components/ManifestForm.js | 10 +++++++++-
src/containers/ManifestForm.js | 11 +++++++++++
2 files changed, 20 insertions(+), 1 deletion(-)
diff --git a/src/components/ManifestForm.js b/src/components/ManifestForm.js
index 7955b73bb..1d8757afc 100644
--- a/src/components/ManifestForm.js
+++ b/src/components/ManifestForm.js
@@ -66,7 +66,7 @@ export class ManifestForm extends Component {
*/
render() {
const { formValue } = this.state;
- const { t, onCancel } = this.props;
+ const { classes, t, onCancel } = this.props;
return (
<form onSubmit={this.formSubmit}>
<Grid container spacing={24}>
@@ -80,6 +80,12 @@ export class ManifestForm extends Component {
variant="filled"
label={t('addManifestUrl')}
helperText={t('addManifestUrlHelp')}
+ InputLabelProps={{
+ shrink: true,
+ }}
+ InputProps={{
+ className: classes.input,
+ }}
/>
</Grid>
<Grid item sm={3}>
@@ -99,6 +105,7 @@ export class ManifestForm extends Component {
}
ManifestForm.propTypes = {
+ classes: PropTypes.object, // eslint-disable-line react/forbid-prop-types
fetchManifest: PropTypes.func.isRequired,
onCancel: PropTypes.func,
onSubmit: PropTypes.func,
@@ -106,6 +113,7 @@ ManifestForm.propTypes = {
};
ManifestForm.defaultProps = {
+ classes: {},
t: key => key,
onCancel: null,
onSubmit: () => {},
diff --git a/src/containers/ManifestForm.js b/src/containers/ManifestForm.js
index cc9774d7e..1a4a3d9ce 100644
--- a/src/containers/ManifestForm.js
+++ b/src/containers/ManifestForm.js
@@ -1,6 +1,7 @@
import { connect } from 'react-redux';
import { compose } from 'redux';
import { withTranslation } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import * as actions from '../state/actions';
import { ManifestForm } from '../components/ManifestForm';
@@ -10,8 +11,18 @@ import { ManifestForm } from '../components/ManifestForm';
* @private
*/
const mapDispatchToProps = { fetchManifest: actions.fetchManifest };
+/**
+ *
+ * @param theme
+ */
+const styles = theme => ({
+ input: {
+ ...theme.typography.body1,
+ },
+});
const enhance = compose(
+ withStyles(styles),
withTranslation(),
connect(null, mapDispatchToProps),
);
--
GitLab