3 files changed, 11 insertions, 1 deletions
diff --git a/src/client/react/components/presentational/Loading.js b/src/client/react/components/presentational/Loading.js
index a149de2..1a34a71 100644
--- a/src/client/react/components/presentational/Loading.js
+++ b/src/client/react/components/presentational/Loading.js
@@ -4,7 +4,9 @@ import { LinearProgress } from 'rmwc/LinearProgress';
 class Loading extends React.Component {
   render() {
     return (
-      <LinearProgress determinate={false} />
+      <div className="loading">
+        <LinearProgress determinate={false} />
+      </div>
     );
   }
 }
diff --git a/src/client/style/_component-loading.scss b/src/client/style/_component-loading.scss
new file mode 100644
index 0000000..d79c521
--- /dev/null
+++ b/src/client/style/_component-loading.scss
@@ -0,0 +1,5 @@
+.loading {
+  .mdc-linear-progress .mdc-linear-progress__bar-inner {
+    background-color: #9C27B0;
+  }
+}
diff --git a/src/client/style/index.scss b/src/client/style/index.scss
index e6ca14d..876183a 100644
--- a/src/client/style/index.scss
+++ b/src/client/style/index.scss
@@ -1,3 +1,5 @@
+@import "../../../node_modules/material-components-web/dist/material-components-web.min.css";
+
 * {
   box-sizing: border-box;
 }
@@ -13,3 +15,4 @@ body {
 @import "component-search";
 @import "component-help-box";
 @import "component-week-selector";
+@import "component-loading";