From 00a6645a009ed4fb00e864b7d9a46bf98e9eb7cf Mon Sep 17 00:00:00 2001
From: Sanne de Vries <sannedv@protonmail.com>
Date: Wed, 9 Mar 2022 11:53:54 +0000
Subject: [PATCH] Added site brand color to signup button for new staff users

---
 ghost/admin/app/controllers/signup.js   |  8 +++++++-
 ghost/admin/app/styles/layouts/auth.css |  6 ++++--
 ghost/admin/app/styles/layouts/flow.css | 12 +-----------
 ghost/admin/app/templates/signin.hbs    |  2 +-
 ghost/admin/app/templates/signup.hbs    |  2 +-
 5 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/ghost/admin/app/controllers/signup.js b/ghost/admin/app/controllers/signup.js
index 5378bb6917..fa74e4e55d 100644
--- a/ghost/admin/app/controllers/signup.js
+++ b/ghost/admin/app/controllers/signup.js
@@ -1,5 +1,6 @@
 import Controller from '@ember/controller';
 import {alias} from '@ember/object/computed';
+import {computed} from '@ember/object';
 import {get} from '@ember/object';
 import {isArray as isEmberArray} from '@ember/array';
 import {
@@ -21,6 +22,11 @@ export default Controller.extend({
 
     signupDetails: alias('model'),
 
+    accentColor: computed('config.accent_color', function () {
+        let color = this.get('config.accent_color');
+        return color;
+    }),
+
     actions: {
         validate(property) {
             return this.signupDetails.validate({property});
@@ -56,7 +62,7 @@ export default Controller.extend({
         } catch (error) {
             // ValidationEngine throws undefined
             if (!error) {
-                this.set('flowErrors', 'Please fill out the form to complete your sign-up');
+                this.set('flowErrors', 'Please fill out the form to complete your signup');
                 return false;
             }
 
diff --git a/ghost/admin/app/styles/layouts/auth.css b/ghost/admin/app/styles/layouts/auth.css
index 9e76d4c2b0..4fb92f2e4d 100644
--- a/ghost/admin/app/styles/layouts/auth.css
+++ b/ghost/admin/app/styles/layouts/auth.css
@@ -74,7 +74,8 @@
     fill: #fff !important;
 }
 
-.gh-signin .gh-btn-login:hover {
+.gh-signin .gh-btn-login:hover,
+.gh-signup .gh-btn-signup:hover {
     opacity: 0.9;
 }
 
@@ -131,7 +132,8 @@
     font-size: 1.8rem;
 }
 
-.gh-signin .gh-input:focus:not(.gh-signin .gh-input.reset-password:focus) {
+.gh-signin .gh-input:focus:not(.gh-signin .gh-input.reset-password:focus),
+.gh-signup .gh-input:focus {
     border-color: var(--midgrey) !important;
     box-shadow: none !important;
 }
diff --git a/ghost/admin/app/styles/layouts/flow.css b/ghost/admin/app/styles/layouts/flow.css
index 2884eff6ed..c3b1e77587 100644
--- a/ghost/admin/app/styles/layouts/flow.css
+++ b/ghost/admin/app/styles/layouts/flow.css
@@ -19,14 +19,6 @@
     padding: 0 2.4rem;
 }
 
-.gh-flow-head {
-    flex-shrink: 0;
-    display: flex;
-    justify-content: space-between;
-    padding-top: 4vh;
-    padding-bottom: 20px;
-}
-
 .gh-flow-content-wrap {
     flex-grow: 1;
     flex-shrink: 0;
@@ -417,8 +409,6 @@
 }
 
 .gh-setup .gh-flow-form .gh-btn-red,
-.gh-setup .gh-flow-form .gh-btn-red:active,
-.gh-signup .gh-btn-red,
-.gh-signup .gh-btn-red:active {
+.gh-setup .gh-flow-form .gh-btn-red:active {
     background: var(--black) !important;
 }
diff --git a/ghost/admin/app/templates/signin.hbs b/ghost/admin/app/templates/signin.hbs
index 3c588d6065..67fc51e6cc 100644
--- a/ghost/admin/app/templates/signin.hbs
+++ b/ghost/admin/app/templates/signin.hbs
@@ -7,7 +7,7 @@
                         <div class="gh-site-icon" style={{site-icon-style}}></div>
                         <h1>Update your password.</h1>
                         <p>
-                            For security, you need to create a new password. An email has been sent to you with instructions!
+                            For security, you need to create a new password. An email has been sent to you with instructions.
                         </p>
                     </header>
                 </div>
diff --git a/ghost/admin/app/templates/signup.hbs b/ghost/admin/app/templates/signup.hbs
index bd9e92b06f..fcb5b7bfd2 100644
--- a/ghost/admin/app/templates/signup.hbs
+++ b/ghost/admin/app/templates/signup.hbs
@@ -69,7 +69,7 @@
                 </GhFormGroup>
 
                 <GhTaskButton @buttonText="Create Account &rarr;" @type="submit" @form="signup" @defaultClick={{true}} @runningText="Creating"
-                    @task={{this.signup}} @data-test-button="signup" @class="gh-btn gh-btn-black gh-btn-signup gh-btn-block gh-btn-icon" @tabindex="3" />
+                    @task={{this.signup}} @data-test-button="signup" @class="gh-btn gh-btn-signup gh-btn-block gh-btn-icon" @tabindex="3" style="background: {{this.accentColor}};" />
             </form>
             {{#if this.flowErrors}}
                 <p class="main-error">{{this.flowErrors}}&nbsp;</p>