replace fade with alpha

src/components/Alert.js

@@ -1,34 +1,29 @@
-import React, { Component } from 'react';
+import React, { Component } from "react";
 
-import { withStyles } from '@material-ui/core/styles';
-import { fade } from '@material-ui/core/styles/colorManipulator';
+import { withStyles } from "@material-ui/core/styles";
+import { alpha } from "@material-ui/core/styles";
 
-import Typography from '@material-ui/core/Typography';
+import Typography from "@material-ui/core/Typography";
 
 const styles = (theme) => ({
   alert: {
-    marginBottom: '20px',
+    marginBottom: "20px",
     border: `1px solid ${theme.palette.primary.main}`,
-    padding: '10px 20px',
-    borderRadius: '4px',
-    background: fade(theme.palette.primary.main, 0.3),
-    color: 'rgb(70,70,70)'
-  }
+    padding: "10px 20px",
+    borderRadius: "4px",
+    background: alpha(theme.palette.primary.main, 0.3),
+    color: "rgb(70,70,70)",
+  },
 });
 
-
 export class Alert extends Component {
-
-  render(){
-    return(
+  render() {
+    return (
       <div className={this.props.classes.alert}>
-        <Typography>
-          {this.props.children}
-        </Typography>
+        <Typography>{this.props.children}</Typography>
       </div>
     );
   }
 }
 
-
 export default withStyles(styles, { withTheme: true })(Alert);