Add setting.json about skinnable #3241

src/ui_ng/src/app/account/sign-in/sign-in.component.html

@@ -1,6 +1,6 @@
 <div class="login-wrapper login-wrapper-override" [ngStyle]="{'background-image': 'url(' + customLoginBgImg + ')'}">
     <form #signInForm="ngForm" class="login">
-        <label class="title">{{appTitle | translate}}<span class="trademark tm-font">&#8482;</span>
+        <label class="title"> {{customAppTitle? customAppTitle:(appTitle | translate)}}<span class="trademark tm-font">&#8482;</span>
     </label>
         <div class="login-group">
             <label for="username" aria-haspopup="true" role="tooltip" class="tooltip tooltip-validation tooltip-md tooltip-top-left">

src/ui_ng/src/app/account/sign-in/sign-in.component.ts

@@ -51,6 +51,7 @@ export class SignInComponent implements AfterViewChecked, OnInit {
     rememberedName: string = "";
 
     customLoginBgImg: string;
+    customAppTitle: string;
     //Form reference
     signInForm: NgForm;
     @ViewChild('signInForm') currentForm: NgForm;
@@ -77,8 +78,13 @@ export class SignInComponent implements AfterViewChecked, OnInit {
     ngOnInit(): void {
         // custom skin
         let customSkinObj = this.skinableConfig.getSkinConfig();
-        if (customSkinObj && customSkinObj.loginBgImg) {
-            this.customLoginBgImg = customSkinObj.loginBgImg;
+        if (customSkinObj) {
+            if (customSkinObj.loginBgImg) {
+                this.customLoginBgImg = customSkinObj.loginBgImg;
+            }
+           if (customSkinObj.appTitle) {
+               this.customAppTitle = customSkinObj.appTitle;
+           }
         }
 
         //Make sure the updated configuration can be loaded

src/ui_ng/src/setting.json

@@ -0,0 +1,15 @@
+{
+  "headerBgColor": "#004a70",
+  "headerLogo": "",
+  "loginBgImg": "",
+  "appTitle": "VMware Harbor",
+  "projects": {
+    "companyName": "vmware",
+    "projectName": "Harbor",
+    "introduction": {
+      "zh-cn": "",
+      "es-es": "",
+      "en-us": ""
+    }
+  }
+}