From 0f46313796912e41ade0fc680a99591ea5c9d971 Mon Sep 17 00:00:00 2001
From: Justin Field <fieldju@gmail.com>
Date: Wed, 14 Dec 2016 15:41:53 -0800
Subject: [PATCH] Add help page and links (#7)

* Add help page and links
---
 app/components/LandingView/LandingView.js     |  1 +
 app/components/LandingView/LandingView.scss   |  4 ++
 app/components/Login/Login.scss               | 21 ++++++++--
 app/components/LoginMfaForm/LoginMfaForm.js   |  3 ++
 app/components/LoginUserForm/LoginUserForm.js |  3 ++
 build/help/index.html                         | 17 +++++++++
 build/help/main.css                           | 38 +++++++++++++++++++
 7 files changed, 84 insertions(+), 3 deletions(-)
 create mode 100644 build/help/index.html
 create mode 100644 build/help/main.css

diff --git a/app/components/LandingView/LandingView.js b/app/components/LandingView/LandingView.js
index 91ff3dd..996259b 100644
--- a/app/components/LandingView/LandingView.js
+++ b/app/components/LandingView/LandingView.js
@@ -10,6 +10,7 @@ export default class LandingView extends Component {
                 <h2>Welcome to the Cerberus Management Dashboard</h2>
                 <h3>Environment: {EnvironmentService.getEnvironment()}</h3>
                 <h3>API Domain: {EnvironmentService.getDomain()}</h3>
+                <h4>For help please visit the <a target="_blank" href="/dashboard/help/index.html">help page</a></h4>
             </div>
         )
     }
diff --git a/app/components/LandingView/LandingView.scss b/app/components/LandingView/LandingView.scss
index 4e58ec0..245df7e 100644
--- a/app/components/LandingView/LandingView.scss
+++ b/app/components/LandingView/LandingView.scss
@@ -2,4 +2,8 @@
   li {
     font-size: 20px;
   }
+
+  a {
+    text-decoration: underline;
+  }
 }
\ No newline at end of file
diff --git a/app/components/Login/Login.scss b/app/components/Login/Login.scss
index fe517b1..482aae9 100644
--- a/app/components/Login/Login.scss
+++ b/app/components/Login/Login.scss
@@ -85,10 +85,25 @@
   #login-form-submit-container {
     padding-top: 25px;
     float: right;
-  }
+    display: flex;
+
+    #login-help {
+      padding-right: 15px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      a {
+        color: $snkrs_grey;
+        font-weight: bold;
+        &:hover {
+          color: $snkrs_off_white;
+        }
+      }
+    }
 
-  #login-btn {
-    min-width: 125px;
+    #login-btn {
+      min-width: 125px;
+    }
   }
 }
 
diff --git a/app/components/LoginMfaForm/LoginMfaForm.js b/app/components/LoginMfaForm/LoginMfaForm.js
index 31ca22f..5ee29be 100644
--- a/app/components/LoginMfaForm/LoginMfaForm.js
+++ b/app/components/LoginMfaForm/LoginMfaForm.js
@@ -88,6 +88,9 @@ export default class LoginMfaForm extends Component {
 
                     </div>
                     <div id='login-form-submit-container'>
+                        <div id="login-help">
+                            <a target="_blank" href="/dashboard/help/index.html">Need help?</a>
+                        </div>
                         <button id='login-mfa-btn'
                                 type='submit'
                                 className='ncss-btn-offwhite ncss-brand pt3-sm pr5-sm pb3-sm pl5-sm pt2-lg pb2-lg u-uppercase'
diff --git a/app/components/LoginUserForm/LoginUserForm.js b/app/components/LoginUserForm/LoginUserForm.js
index 1fb863d..46b0b1a 100644
--- a/app/components/LoginUserForm/LoginUserForm.js
+++ b/app/components/LoginUserForm/LoginUserForm.js
@@ -95,6 +95,9 @@ export default class LoginUserForm extends Component {
                         <div id='fountainG_7' className='fountainG'></div>
                         <div id='fountainG_8' className='fountainG'></div>
                     </div>
+                    <div id="login-help">
+                        <a target="_blank" href="/dashboard/help/index.html">Need help?</a>
+                    </div>
                     <button id='login-btn'
                             className='ncss-btn-offwhite ncss-brand pt3-sm pr5-sm pb3-sm pl5-sm pt2-lg pb2-lg u-uppercase'
                             disabled={isAuthenticating}>Login</button>
diff --git a/build/help/index.html b/build/help/index.html
new file mode 100644
index 0000000..cf9766d
--- /dev/null
+++ b/build/help/index.html
@@ -0,0 +1,17 @@
+<html>
+<head>
+    <title>Cerberus Management Dashboard Help</title>
+    <link rel="stylesheet" href="//web.nike.com/ncss/0.12/snkrs/desktop/css/ncss.en-us.min.css">
+    <link rel="stylesheet" href="./main.css">
+    <link rel="icon" href=../favicon.ico?v1" />
+</head>
+<body>
+    <div id="content-wrapper">
+        <div id="content">
+            <h2>Cerberus Management Dashboard Help</h2>
+            <h3>Documentation is located on the <a target="_blank" href="http://engineering.nike.com/cerberus/docs/">Nike Engineering Cerberus site</a></h3>
+            <p>This file is static and the publish-dashboard command allows you to override it with a new html file with help specific to your org</p>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/build/help/main.css b/build/help/main.css
new file mode 100644
index 0000000..ecd0cd5
--- /dev/null
+++ b/build/help/main.css
@@ -0,0 +1,38 @@
+#content-wrapper {
+    background-color: #222222;
+    width: 100%;
+    height: 100%;
+
+    padding: 20px;
+
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+#content {
+    background-color: #f2f2f2;
+    width: 1000px;
+    height: 100%;
+    color: #222222;
+    font-size: 40px;
+    font-weight: bold;
+
+    padding: 20px;
+}
+
+a {
+    text-decoration: underline;
+    color: grey;
+}
+
+h3 {
+    padding-top: 5px;
+    padding-left: 15px;
+}
+
+p {
+    font-size: 16px;
+    padding-top: 5px;
+    padding-left: 20px;
+}
\ No newline at end of file