Introduction
Various pages of the CoreOne Authentication Service can be changed or adapted by overriding the appropriate file. This document aims to give you an overview of those files.
Welcome Page
...
Branding
Most of the look and feel of the CoreOne Authentication Service Welcome page, you can do so by specifying the appropriate content herecan be branded according to your CI/CD. This is mostly done by overriding the default files in the following directory:
Code Block |
---|
C:\ProgramData\itsense\Templates\CoreLogin\general\Views\Home\HomePageExtension.cshtml |
Portal Layout Files : Logo & Footer
You can override logo and footer by adding content to the following files:
Code Block |
---|
C:\ProgramData\itsense\Templates\SelfService\Features\Shared\Layout\_Logo.cshtml
C:\ProgramData\itsense\Templates\SelfService\Features\Shared\Layout\_Footer.cshtml |
Portal color theme
You can override specific colors for application ( like primary color that is used for navigation and primary buttons) by overriding following file
Code Block |
---|
C:\ProgramData\itsense\Templates\SelfService\uicontrols\app-config.js |
Content of the file should be in the following structure:
Code Block |
---|
var appConfig = {
themes: {
light: {
|
In there you will find a file, containing all the resources that were requested so far:
Code Block |
---|
RequestedFilesLog.txt |
The content of that file looks similar to this:
Code Block |
---|
/general/css/customerspecificstyles.css
/general/css/customerspecificstyles.en.css
/general/css/pages/LoginPage.min.css
/general/css/pages/LoginPage.min.en.css
/general/favicon.en.ico
/general/favicon.ico |
As you can see, there is a file where you can place your specific overall changes (Line 1). Those files are also localized, so if you want to do culture specific changes, you can use those files (Line 2). There are also page specific changes that you can make (Line 3) or file specific changes (Line 5).
General vs Client specific changes
Generally there are also two root folders. One called general
, where the general changes can be made. Those changes will apply to all applications and clients. But you might wanna change the look and feel only for a given client. You can achieve this by overriding the files in the clientspecific
folder. Just select the folder of your client there and follow the same logic as you would for general changes.
For a quick example of such changes you can read the How-to change the logo of the CoreOne Authentication Service How-To change the logo of the CoreOne Authentication Service.
Default layout
The layout of the CoreOne Authentication Service looks like displayed below. This should give you a broad idea on where to start with your design changes.
Code Block | ||
---|---|---|
| ||
<div class="layoutBackground"> <div class="layoutContainer"> <div class="layoutOuterBox animated fadeInDown"> <div class="layoutInnerBox"> primary: '#0069b4', @Html.Partial("_InnerHeader") secondary: '#424242', @Html.Partial("_ValidationSummary") accent: '#82B1FF', <div class="page@(viewName)"> error: '#FF5252', @RenderBody() info: '#2196F3', </div> </div> success: '#4CAF50', @Html.Partial("_InnerFooter") </div> </div> warning: '#FFC107', @Html.Partial("_OuterFooter") </div> |
Translation
If you want to change any of the texts, you can do so by changing the appropriate translation files located in the following directory:
Code Block |
---|
C:\ProgramData\itsense\LanguageData |
All the default translations are store in the following file. So just search for the text to find the appropriate key:
Code Block |
---|
itsense.moving.generated.xml |
If you then want to change it, just add the appropriate value to the appropriate override file. So for example if you want to change the default text of the “Login” button in german, add the following entry to the following file:
Code Block |
---|
itsense.moving.de.overrides.xml |
Code Block |
---|
"Global.Application.Button.Login": "Your new login } } } |
Above you can see that there is theme light which is used by default. In future it should be possible to switch application theme to dark mode which will use different set of colors.
Portal custom styling
...
button text" |
Error Messages
Whenever something unexpected is happening, a general error page is rendered with some information about the error. For example if the user has an SMS OTP configured, but the SMS gateway is currently unavailable, an appropriate message is rendered. On this generic error page, there is also a contacts section that you can fill with the appropriate contact details. In order to display this contact details, set the appropriate translation key:
Code Block |
---|
Module.DM.AuthenticationService.Error.ContactDetails |
Note that this will be rendered as HTML Raw. So you can place HTML content into the translation.
Welcome Page
If you would like to add customer specific content to the CoreOne Authentication Service Welcome page, you can do so by specifying the appropriate content here:
Code Block |
---|
C:\ProgramData\itsense\Templates\CoreLogin\general\SelfServiceViews\cssHome\customHomePageExtension.csscshtml |