Merge pull request #959 from pixelated/backup-email-page

Adds css and mocha

3 files changed, 39 insertions, 1 deletions

diff --git a/web-ui/app/images/forgot my password.svg b/web-ui/app/images/forgot-my-password.svg
index 6dc329e7..6dc329e7 100644
--- a/web-ui/app/images/forgot my password.svg
+++ b/web-ui/app/images/forgot-my-password.svg
diff --git a/web-ui/app/js/account_recovery/page.js b/web-ui/app/js/account_recovery/page.js
index e400dfae..a6be0c6e 100644
--- a/web-ui/app/js/account_recovery/page.js
+++ b/web-ui/app/js/account_recovery/page.js
@@ -1,5 +1,12 @@
 import React from 'react'
 
-const Page = () => <h1>Hello world</h1>;
+import 'scss/account_recovery/page.scss'
+
+const Page = () => (
+  <div className="container">
+    <img src="assets/images/forgot-my-password.svg" />
+    <h1>E se você esquecer sua senha?</h1>
+  </div>
+);
 
 export default Page
diff --git a/web-ui/app/scss/account_recovery/page.scss b/web-ui/app/scss/account_recovery/page.scss
new file mode 100644
index 00000000..b6a4c024
--- /dev/null
+++ b/web-ui/app/scss/account_recovery/page.scss
@@ -0,0 +1,31 @@
+@import "../vendor/reset";
+@import "../base/colors";
+@import "../base/fonts";
+@import "../base/scaffolding";
+
+body {
+  font-family: "Open Sans", "Microsoft YaHei", "Hiragino Sans GB", "Hiragino Sans GB W3", "微软雅黑", "Helvetica Neue", Arial, sans-serif;
+  background: $dark_blue; /* For browsers that do not support gradients */
+  background: -webkit-linear-gradient(left top, $dark_blue, $middle_blue); /* For Safari 5.1 to 6.0 */
+  background: -o-linear-gradient(bottom right, $dark_blue, $middle_blue); /* For Opera 11.1 to 12.0 */
+  background: -moz-linear-gradient(bottom right, $dark_blue, $middle_blue); /* For Firefox 3.6 to 15 */
+  background: linear-gradient(to bottom right, $dark_blue, $middle_blue); /* Standard syntax */
+}
+
+h1 {
+  font-size: 4em;
+  color: $dark_slate_gray;
+}
+
+.container {
+  background: $white;
+  width: 90%;
+  margin: 2% auto;
+  padding: 3%;
+
+  img {
+    display: block;
+    width: 50%;
+    margin: 0 auto;
+  }
+}