feature: Add missing branding to sign in page

ORCID · Nov 22, 2023 · a0a1f32 · a0a1f32
1 parent 6032836
commit a0a1f32
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 4 deletions.
diff --git a/src/app/sign-in/pages/sign-in/sign-in.component.html b/src/app/sign-in/pages/sign-in/sign-in.component.html
@@ -18,10 +18,12 @@
             <mat-card-title
               role="heading"
               aria-level="1"
-              i18n="@@ngOrcid.signin.title"
               *ngIf="!isOauthError"
             >
-              Sign in
+              <div class="icon">
+                <img src="assets/vectors/orcid.logo.icon.svg" alt="">
+              </div>
+              <ng-container i18n="@@ngOrcid.signin.signInToOrcid">Sign in to ORCID</ng-container>
             </mat-card-title>
           </mat-card-header>
           <mat-card-content>

diff --git a/src/app/sign-in/pages/sign-in/sign-in.component.scss b/src/app/sign-in/pages/sign-in/sign-in.component.scss
@@ -9,9 +9,9 @@
 }
 
 .mat-card-title {
+  margin-top: 32px !important;
   text-align: center;
-  margin-top: 0;
-  margin-bottom: 40px;
+  margin-bottom: 8px !important;
 }
 
 .mat-subheading-2 {
@@ -35,3 +35,11 @@
 .mat-card .mat-divider-horizontal {
   position: relative;
 }
+
+.icon {
+  margin-bottom: 26px;
+
+  img {
+    width: 64px;
+  }
+}
diff --git a/src/locale/properties/signin/signin.en.properties b/src/locale/properties/signin/signin.en.properties
@@ -65,3 +65,4 @@ ngOrcid.signin.unclaimedExists2=resend the claim email?
 ngOrcid.signin.invalidUserType1=Invalid ORCID iD, please
 ngOrcid.signin.invalidUserType2=contact support
 ngOrcid.signin.contactSupport=contact support
+ngOrcid.signin.signInToOrcid=Sign in to ORCID