Add Breadcrumbs

1 files changed, 24 insertions, 0 deletions

diff --git a/mascara/src/app/first-time/breadcrumbs.js b/mascara/src/app/first-time/breadcrumbs.js
new file mode 100644
index 000000000..cbd0da1a1
--- /dev/null
+++ b/mascara/src/app/first-time/breadcrumbs.js
@@ -0,0 +1,24 @@
+import React, {Component, PropTypes} from 'react'
+
+export default class Breadcrumbs extends Component {
+
+  static propTypes = {
+    total: PropTypes.number,
+    currentIndex: PropTypes.number
+  };
+
+  render() {
+    const {total, currentIndex} = this.props
+    return (
+      <div className="breadcrumbs">
+        {Array(total).fill().map((_, i) => (
+          <div
+            className="breadcrumb"
+            style={{backgroundColor: i === currentIndex ? '#D8D8D8' : '#FFFFFF'}}
+          />
+        ))}
+      </div>
+    );
+  }
+
+}