added error pages and further styling

public/index.html

@@ -11,6 +11,7 @@
   <!-- Compiled and minified CSS -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
   <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 
   <title>React App</title>
 </head>

src/components/Migrations/Error.js

@@ -2,7 +2,15 @@ import React from 'react'
 
 const Error = () => (
     <div>
-        <h1>There was an error fetching news</h1>
+
+
+        <div class="card-panel blue-grey darken-1">
+            <div class="card-content white-text">
+                <center>
+                    <span class="card-title"><i className="large material-icons">do_not_disturb</i></span>
+                </center>
+            </div>
+        </div>
     </div>
 )
 

src/components/Migrations/MigrationSingle.js

@@ -3,7 +3,7 @@ import React from 'react';
 const MigrationSingle = ({ item }) => (
 
     <div className="col s4 m4">
-        <div className="card">
+        <div className="card-panel">
             <div className="card-content black-text">
                 <ul className="collection with-header">
                     <li className="collection-header"><p>{item.migration_status}</p></li>