emotionalize dv page (#952)

veteransaffairscanada · Aug 17, 2018 · 5705231 · 5705231
1 parent 1bdb6d5
commit 5705231
Showing 1 changed file with 13 additions and 21 deletions.
diff --git a/pages/data-validation.js b/pages/data-validation.js
@@ -6,24 +6,20 @@ import TableCell from "@material-ui/core/TableCell";
 import TableHead from "@material-ui/core/TableHead";
 import TableRow from "@material-ui/core/TableRow";
 import Paper from "@material-ui/core/Paper";
-import { withStyles } from "@material-ui/core/styles";
 import ReactMoment from "react-moment";
 import { withI18next } from "../lib/withI18next";
 import Layout from "../components/layout";
 import { connect } from "react-redux";
+import { css } from "react-emotion";
+import { globalTheme } from "../theme";
 
-const styles = theme => ({
-  root: {
-    maxWidth: "1200px",
-    marginBottom: theme.spacing.unit * 3,
-    marginTop: theme.spacing.unit * 3,
-    overflowX: "auto",
-    margin: "0 auto"
-  },
-  table: {
-    width: "100%"
-  }
-});
+const root = css`
+  max-width: ${globalTheme.maxWidth};
+  overflow-x: auto;
+  margin-bottom: 25px !important;
+  margin-top: 25px !important;
+  margin: 0 auto;
+`;
 
 export class DataValidation extends Component {
   createData = (name, value, status) => {
@@ -82,7 +78,6 @@ export class DataValidation extends Component {
     const {
       i18n,
       t,
-      classes,
       benefits,
       eligibilityPaths,
       needs,
@@ -161,15 +156,15 @@ export class DataValidation extends Component {
         hideNoscript={true}
         showRefreshCache={true}
       >
-        <Paper className={classes.root}>
+        <Paper className={root}>
           <p style={{ padding: "10px" }}>
             {t("dv.last_cache_update")}
             :&nbsp;
             <ReactMoment format="llll">{this.props.timestamp}</ReactMoment>
           </p>
         </Paper>
-        <Paper className={classes.root}>
-          <Table className={classes.table}>
+        <Paper className={root}>
+          <Table>
             <TableHead>
               <TableRow>
                 <TableCell>{t("dv.status")}</TableCell>
@@ -222,11 +217,8 @@ DataValidation.propTypes = {
   i18n: PropTypes.object.isRequired,
   t: PropTypes.func.isRequired,
   timestamp: PropTypes.number.isRequired,
-  classes: PropTypes.object.isRequired,
   translations: PropTypes.array.isRequired,
   areaOffices: PropTypes.array.isRequired
 };
 
-export default withStyles(styles)(
-  connect(mapStateToProps)(withI18next()(DataValidation))
-);
+export default connect(mapStateToProps)(withI18next()(DataValidation));