libre.sh/keycloak-scim
3
0
Fork 0
Code Issues 15 Pull requests Releases Packages Activity Actions

KEYCLOAK-8093 Add IDs to HTML elements in new Account Console

Browse source
This commit is contained in:
vmuzikar 2018-08-21 18:46:38 +02:00 committed by Stan Silvert
parent 3dcc106c59
commit 653d3f4f5d
15 changed files with 88 additions and 88 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
themes/src/main/resources/theme/base/account/messages/messages_en.properties
View file

@ -260,7 +260,7 @@ authorizedProvider=Authorized Provider
authorizedProviderMessage=Authorized Providers linked with your account authorizedProviderMessage=Authorized Providers linked with your account
identityProvider=Identity Provider identityProvider=Identity Provider
identityProviderMessage=To link your account with identity providers you have configured identityProviderMessage=To link your account with identity providers you have configured
socialLogin=Socail Login socialLogin=Social Login
userDefined=User Defined userDefined=User Defined
removeAccess=Remove Access removeAccess=Remove Access
removeAccessMessage=You will need to grant access again, if you want to use this app account. removeAccessMessage=You will need to grant access again, if you want to use this app account.

32
themes/src/main/resources/theme/keycloak-preview/account/index.ftl
View file

@ -146,10 +146,10 @@
<li><button id="signInButton" style="visibility:hidden" onclick="keycloak.login();" class="btn btn-primary btn-lg btn-sign" type="button">${msg("doLogIn")}</button></li> <li><button id="signInButton" style="visibility:hidden" onclick="keycloak.login();" class="btn btn-primary btn-lg btn-sign" type="button">${msg("doLogIn")}</button></li>
<#if realm.internationalizationEnabled && supportedLocales?size gt 1> <#if realm.internationalizationEnabled && supportedLocales?size gt 1>
<li class="dropdown"> <li class="dropdown">
<a href="#0" class="dropdown-toggle nav-item-iconic" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <a href="#0" class="dropdown-toggle nav-item-iconic" id="localeDropdownBtn" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
${msg("locale_" + locale)} <span class="caret"></span> ${msg("locale_" + locale)} <span class="caret"></span>
</a> </a>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> <ul class="dropdown-menu" aria-labelledby="localeDropdownBtn" id="localeDropdownMenu">
<#list supportedLocales as locale, label> <#list supportedLocales as locale, label>
<li><a href="${baseUrl}/?kc_locale=${locale}">${label}</a></li> <li><a href="${baseUrl}/?kc_locale=${locale}">${label}</a></li>
</#list> </#list>
@ -165,12 +165,12 @@
<!-- Home Page --> <!-- Home Page -->
<div class="cards-pf" id="welcomeScreen"> <div class="cards-pf" id="welcomeScreen">
<div class="text-center"> <div class="text-center" id="welcomeMsg">
<h1>${msg("accountManagementWelcomeMessage")}</h1> <h1>${msg("accountManagementWelcomeMessage")}</h1>
</div> </div>
<div class="container-fluid container-cards-pf"> <div class="container-fluid container-cards-pf">
<div class="row row-cards-pf"> <div class="row row-cards-pf">
<div class="col-xs-12 col-sm-4 col-md-4 col-lg-3"> <div class="col-xs-12 col-sm-4 col-md-4 col-lg-3" id="personalInfoCard">
<div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select"> <div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select">
<div class="card-pf-body text-center row"> <div class="card-pf-body text-center row">
<div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12">
@ -179,12 +179,12 @@
<div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12">
<h2>${msg("personalInfoHtmlTitle")}</h2> <h2>${msg("personalInfoHtmlTitle")}</h2>
<p class="card-pf-content-intro">${msg("personalInfoIntroMessage")}</p> <p class="card-pf-content-intro">${msg("personalInfoIntroMessage")}</p>
<h3><a href="${baseUrl}/#/account">${msg("personalInfoHtmlTitle")}</a></h3> <h3 id="personalInfoLink"><a href="${baseUrl}/#/account">${msg("personalInfoHtmlTitle")}</a></h3>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="col-xs-12 col-sm-4 col-md-4 col-lg-3"> <div class="col-xs-12 col-sm-4 col-md-4 col-lg-3" id="accountSecurityCard">
<div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select"> <div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select">
<div class="card-pf-body text-center row"> <div class="card-pf-body text-center row">
<div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12">
@ -193,15 +193,15 @@
<div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12">
<h2>${msg("accountSecurityTitle")}</h2> <h2>${msg("accountSecurityTitle")}</h2>
<p class="card-pf-content-intro">${msg("accountSecurityIntroMessage")}</p> <p class="card-pf-content-intro">${msg("accountSecurityIntroMessage")}</p>
<h3><a href="${baseUrl}/#/password">${msg("changePasswordHtmlTitle")}</a></h3> <h3 id="changePasswordLink"><a href="${baseUrl}/#/password">${msg("changePasswordHtmlTitle")}</a></h3>
<h3><a href="${baseUrl}/#/authenticator">${msg("authenticatorTitle")}</a></h3> <h3 id="authenticatiorLink"><a href="${baseUrl}/#/authenticator">${msg("authenticatorTitle")}</a></h3>
<h3><a href="${baseUrl}/#/device-activity">${msg("deviceActivityHtmlTitle")}</a></h3> <h3 id="deviceActivityLink"><a href="${baseUrl}/#/device-activity">${msg("deviceActivityHtmlTitle")}</a></h3>
<h3 id="linkedAccounts"><a href="${baseUrl}/#/linked-accounts">${msg("linkedAccountsHtmlTitle")}</a></h3> <h3 id="linkedAccountsLink"><a href="${baseUrl}/#/linked-accounts">${msg("linkedAccountsHtmlTitle")}</a></h3>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="col-xs-12 col-sm-4 col-md-4 col-lg-3"> <div class="col-xs-12 col-sm-4 col-md-4 col-lg-3" id="applicationsCard">
<div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select"> <div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select">
<div class="card-pf-body text-center row"> <div class="card-pf-body text-center row">
<div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12">
@ -210,12 +210,12 @@
<div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12">
<h2>${msg("applicationsHtmlTitle")}</h2> <h2>${msg("applicationsHtmlTitle")}</h2>
<p class="card-pf-content-intro">${msg("applicationsIntroMessage")}</p> <p class="card-pf-content-intro">${msg("applicationsIntroMessage")}</p>
<h3><a href="${baseUrl}/#/applications">${msg("applicationsHtmlTitle")}</a></h3> <h3 id="applicationsLink"><a href="${baseUrl}/#/applications">${msg("applicationsHtmlTitle")}</a></h3>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div id="myResources" class="col-xs-12 col-sm-4 col-md-4 col-lg-3"> <div class="col-xs-12 col-sm-4 col-md-4 col-lg-3" id="myResourcesCard">
<div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select"> <div class="card-pf card-pf-view card-pf-view-select card-pf-view-single-select">
<div class="card-pf-body text-center row"> <div class="card-pf-body text-center row">
<div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-top-element col-xs-2 col-sm-12 col-md-12 col-lg-12">
@ -224,7 +224,7 @@
<div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12"> <div class="card-pf-content col-xs-10 col-sm-12 col-md-12 col-lg-12">
<h2>${msg("myResources")}</h2> <h2>${msg("myResources")}</h2>
<p class="card-pf-content-intro">${msg("resourceIntroMessage")}</p> <p class="card-pf-content-intro">${msg("resourceIntroMessage")}</p>
<h3><a href="${baseUrl}/#/my-resources">${msg("myResources")}</a></h3> <h3 id="myResourcesLink"><a href="${baseUrl}/#/my-resources">${msg("myResources")}</a></h3>
</div> </div>
</div> </div>
</div> </div>
@ -236,11 +236,11 @@
<script> <script>
if (!features.isLinkedAccountsEnabled) { if (!features.isLinkedAccountsEnabled) {
document.getElementById("linkedAccounts").style.display='none'; document.getElementById("linkedAccountsLink").style.display='none';
} }
if (!features.isMyResourcesEnabled) { if (!features.isMyResourcesEnabled) {
document.getElementById("myResources").style.display='none'; document.getElementById("myResourcesCard").style.display='none';
} }
var winHash = window.location.hash; var winHash = window.location.hash;

10
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/account-page/account-page.component.html
View file

@ -1,17 +1,17 @@
<div class="page-header"> <div class="page-header">
<h1>{{'personalInfoHtmlTitle' | translate}}</h1> <h1 id="pageTitle">{{'personalInfoHtmlTitle' | translate}}</h1>
</div> </div>
<div class="col-sm-12 card-pf"> <div class="col-sm-12 card-pf">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-sm-4 col-md-4"> <div class="col-sm-4 col-md-4">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="personalSubTitle">
{{'personalSubTitle' | translate}} {{'personalSubTitle' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="personalSubMessage">
<p>{{'personalSubMessage' | translate}}</p> <p>{{'personalSubMessage' | translate}}</p>
</div> </div>
<div class="subtitle"><span class="required">*</span> {{'requiredFields' | translate}}</div> <div class="subtitle" id="requiredFieldMessage"><span class="required">*</span> {{'requiredFields' | translate}}</div>
</div> </div>
<div class="col-sm-6 col-md-6"> <div class="col-sm-6 col-md-6">
@ -20,7 +20,7 @@
<div *ngIf="!isRegistrationEmailAsUsername" class="form-group "> <div *ngIf="!isRegistrationEmailAsUsername" class="form-group ">
<label for="username" class="control-label">{{'username' | translate}}</label><span *ngIf="isEditUserNameAllowed" class="required">*</span> <label for="username" class="control-label">{{'username' | translate}}</label><span *ngIf="isEditUserNameAllowed" class="required">*</span>
<input *ngIf="isEditUserNameAllowed" type="text" class="form-control" required ngModel id="username" name="username" value="{{username}}" > <input *ngIf="isEditUserNameAllowed" type="text" class="form-control" required ngModel id="username" name="username" value="{{username}}" >
<div class="non-edit" *ngIf="!isEditUserNameAllowed">{{ username }}</div> <div class="non-edit" *ngIf="!isEditUserNameAllowed" id="username">{{ username }}</div>
</div> </div>
<div class="form-group "> <div class="form-group ">

20
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/applications-page/applications-page.component.html
View file

@ -1,5 +1,5 @@
<div class="page-header"> <div class="page-header">
<h1>{{'applicationsHtmlTitle' | translate}}</h1> <h1 id="pageTitle">{{'applicationsHtmlTitle' | translate}}</h1>
</div> </div>
<!--The new application HTML code--> <!--The new application HTML code-->
@ -10,7 +10,7 @@
<div id="toolbar-application-mobile"> <div id="toolbar-application-mobile">
<h2> <h2>
<span class="fa fa-angle-right"></span> <span class="fa fa-angle-right"></span>
<a href="javascript:void(0)">Filter</a> <a href="javascript:void(0)" id="showFilterBtn">Filter</a>
</h2> </h2>
</div> </div>
<div id="toolbar-application"> <div id="toolbar-application">
@ -19,8 +19,8 @@
<label class="sr-only" for="filter">{{'applicaitonName' | translate}}</label> <label class="sr-only" for="filter">{{'applicaitonName' | translate}}</label>
<div class="input-group"> <div class="input-group">
<div class="input-group-btn"> <div class="input-group-btn">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Name <span class="caret"></span></button> <button type="button" id="filterDropdownBtn" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Name <span class="caret"></span></button>
<ul class="dropdown-menu"> <ul class="dropdown-menu" id="filterDropdownMenu">
<li class="selected"><a href="#">{{'applicaitonName' | translate}}</a></li> <li class="selected"><a href="#">{{'applicaitonName' | translate}}</a></li>
<li><a href="#">{{'applicaitonType' | translate}}</a></li> <li><a href="#">{{'applicaitonType' | translate}}</a></li>
</ul> </ul>
@ -30,8 +30,8 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<div class="dropdown btn-group"> <div class="dropdown btn-group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{'applicaitonType' | translate}} <span class="caret"></span></button> <button type="button" id="appTypeDropdownBtn" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{'applicaitonType' | translate}} <span class="caret"></span></button>
<ul class="dropdown-menu"> <ul class="dropdown-menu" id="appTypeDropdownMenu">
<li class="selected"><a href="#">{{'allApps' | translate}}</a></li> <li class="selected"><a href="#">{{'allApps' | translate}}</a></li>
<li><a href="#">{{'internalApps' | translate}}</a></li> <li><a href="#">{{'internalApps' | translate}}</a></li>
<li><a href="#">{{'thirdpartyApps' | translate}}</a></li> <li><a href="#">{{'thirdpartyApps' | translate}}</a></li>
@ -44,9 +44,9 @@
</form> </form>
<div class="row toolbar-pf-results"> <div class="row toolbar-pf-results">
<div class="col-sm-12"> <div class="col-sm-12">
<h5>40 {{'appResults' | translate}}</h5> <h5><span id="appResults">40</span> {{'appResults' | translate}}</h5>
<p>{{'activeFilters' | translate}}</p> <p>{{'activeFilters' | translate}}</p>
<ul class="list-inline"> <ul class="list-inline" id="activeFiltersList">
<li> <li>
<span class="label label-info"> <span class="label label-info">
{{'applicaitonName' | translate}}: nameofthething {{'applicaitonName' | translate}}: nameofthething
@ -66,7 +66,7 @@
</span> </span>
</li> </li>
</ul> </ul>
<p><a href="#">{{'clearAllFilter' | translate}}</a></p> <p><a href="#" id="clearAllFilters">{{'clearAllFilter' | translate}}</a></p>
</div> </div>
</div> </div>
</div> </div>
@ -74,7 +74,7 @@
</div> </div>
<div class="list-group list-view-pf list-view-pf-view"> <div class="list-group list-view-pf list-view-pf-view" id="appResultList">
<div class="list-group-item"> <div class="list-group-item">
<div class="list-group-item-header"> <div class="list-group-item-header">
<div class="list-view-pf-expand"> <div class="list-view-pf-expand">

16
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/authenticator-page/authenticator-page.component.html
View file

@ -1,10 +1,10 @@
<div class="page-header"> <div class="page-header">
<h1>{{'authenticatorTitle' | translate}}</h1> <h1 id="pageTitle">{{'authenticatorTitle' | translate}}</h1>
</div> </div>
<div class="col-sm-12 card-pf"> <div class="col-sm-12 card-pf">
<div class="card-pf-body p-b"> <div class="card-pf-body p-b">
<span class="label label-default m-r">OFF</span> <span class="label label-default m-r" id="authenticatorStatus">OFF</span>
<!-- <span class="label label-primary m-r">ON</span> --> <!-- <span class="label label-primary m-r">ON</span> -->
{{'authenticatorStatusMessage' | translate}} off {{'authenticatorStatusMessage' | translate}} off
</div> </div>
@ -13,15 +13,15 @@
<div class="col-sm-12 card-pf"> <div class="col-sm-12 card-pf">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-sm-4 col-md-4"> <div class="col-sm-4 col-md-4">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="authenticatorFinishSetUpTitle">
{{'authenticatorFinishSetUpTitle' | translate}} {{'authenticatorFinishSetUpTitle' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="authenticatorFinishSetUpMessage">
<p>{{'authenticatorFinishSetUpMessage' | translate}}</p> <p>{{'authenticatorFinishSetUpMessage' | translate}}</p>
</div> </div>
</div> </div>
<div class="col-sm-8 col-md-8"> <div class="col-sm-8 col-md-8">
<div class="list-pf list-pf-stacked list-authenticator"> <div class="list-pf list-pf-stacked list-authenticator" id="authenticatorFinishList">
<div class="list-authenticator-item"> <div class="list-authenticator-item">
<div class="list-pf-container"> <div class="list-pf-container">
<div class="list-pf-content list-pf-content-flex "> <div class="list-pf-content list-pf-content-flex ">
@ -63,15 +63,15 @@
<div class="col-sm-12 card-pf"> <div class="col-sm-12 card-pf">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-sm-4 col-md-4"> <div class="col-sm-4 col-md-4">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="authenticatorSubTitle">
{{'authenticatorSubTitle' | translate}} {{'authenticatorSubTitle' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="authenticatorSubMessage">
<p>{{'authenticatorSubMessage' | translate}}</p> <p>{{'authenticatorSubMessage' | translate}}</p>
</div> </div>
</div> </div>
<div class="col-sm-8 col-md-8"> <div class="col-sm-8 col-md-8">
<div class="list-pf list-pf-stacked list-authenticator"> <div class="list-pf list-pf-stacked list-authenticator" id="authenticatorList">
<div class="list-authenticator-item"> <div class="list-authenticator-item">
<div class="list-pf-container"> <div class="list-pf-container">
<div class="list-pf-content list-pf-content-flex"> <div class="list-pf-content list-pf-content-flex">

20
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/authenticator-page/backup-code-setup-page.component.html
View file

@ -1,4 +1,4 @@
<ol class="breadcrumb"> <ol class="breadcrumb" id="breadcrumbs">
<li>{{'accountSecurityTitle' | translate}}</li> <li>{{'accountSecurityTitle' | translate}}</li>
<li> <li>
<a href="#">{{'authenticatorTitle' | translate}}</a> <a href="#">{{'authenticatorTitle' | translate}}</a>
@ -9,10 +9,10 @@
<div class="col-sm-12 card-pf "> <div class="col-sm-12 card-pf ">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-sm-12 col-md-4"> <div class="col-sm-12 col-md-4">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="authenticatorBackupCodesSetupTitle">
{{'authenticatorBackupCodesSetupTitle' | translate}} {{'authenticatorBackupCodesSetupTitle' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="backupcodesIntroMessage">
<p>{{'backupcodesIntroMessage' | translate}}</p> <p>{{'backupcodesIntroMessage' | translate}}</p>
</div> </div>
</div> </div>
@ -20,12 +20,12 @@
<div class="backup-codes-box"> <div class="backup-codes-box">
<div class="backup-codes-box-header"> <div class="backup-codes-box-header">
<div class="header-text"> <div class="header-text">
<b>{{'realmName' | translate}}:</b> Admin <b>{{'realmName' | translate}}:</b> <span id="realmName">Admin</span>
</div> </div>
</div> </div>
<!--Backup Codes Box Header--> <!--Backup Codes Box Header-->
<div class="backup-codes-box-body"> <div class="backup-codes-box-body">
<ol class="backup-codes-list"> <ol class="backup-codes-list" id="backupCodesList">
<li>7890 7327</li> <li>7890 7327</li>
<li>0000 7347</li> <li>0000 7347</li>
<li>7890 1227</li> <li>7890 1227</li>
@ -43,9 +43,9 @@
</div> </div>
<!--Backup Codes Box Body--> <!--Backup Codes Box Body-->
<div class="top-margin-m"> <div class="top-margin-m">
<button type="button" class="btn btn-default">{{'doDownload' | translate}}</button> <button type="button" class="btn btn-default" id="backupCodesDownloadBtn">{{'doDownload' | translate}}</button>
<button type="button" class="btn btn-default">{{'doPrint' | translate}}</button> <button type="button" class="btn btn-default" id="backupCodesPrintBtn">{{'doPrint' | translate}}</button>
<button type="button" class="btn btn-default">{{'doCopy' | translate}}</button> <button type="button" class="btn btn-default" id="backupCodesCopyBtn">{{'doCopy' | translate}}</button>
</div> </div>
<!--Buttons Group--> <!--Buttons Group-->
<div class="top-margin-m"> <div class="top-margin-m">
@ -56,11 +56,11 @@
</div> </div>
<!--Annotations--> <!--Annotations-->
<hr> <hr>
<button type="button" class="btn btn-default">{{'generateNewBackupCodes' | translate}}</button> <button type="button" class="btn btn-default" id="generateNewBackupCodesBtn">{{'generateNewBackupCodes' | translate}}</button>
<div class="generate-annotation"> <div class="generate-annotation">
{{'backupCodesTips-3' | translate}} {{'backupCodesTips-3' | translate}}
</div> </div>
<div class="top-margin-m"> <div class="top-margin-m">
<a href="">&lt; {{'backtoAuthenticatorPage' | translate}}</a> <a href="" id="backtoAuthenticatorPage">&lt; {{'backtoAuthenticatorPage' | translate}}</a>
</div> </div>
</div> </div>

18
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/authenticator-page/mobile-authenticator-setup-page.component.html
View file

@ -1,4 +1,4 @@
<ol class="breadcrumb"> <ol class="breadcrumb" id="breadcrumbs">
<li>{{'accountSecurityTitle' | translate}}</li> <li>{{'accountSecurityTitle' | translate}}</li>
<li> <li>
<a href="#">{{'authenticatorTitle' | translate}}</a> <a href="#">{{'authenticatorTitle' | translate}}</a>
@ -9,12 +9,12 @@
<div class="col-sm-12 card-pf "> <div class="col-sm-12 card-pf ">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-sm-12 col-md-6"> <div class="col-sm-12 col-md-6">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="authenticatorMobileSetupTitle">
{{'authenticatorMobileSetupTitle' | translate}} {{'authenticatorMobileSetupTitle' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage">
<ol class="setup-message"> <ol class="setup-message">
<li>{{'mobileSetupStep1' | translate}} <li id="authenticatorAppsList">{{'mobileSetupStep1' | translate}}
<ul> <ul>
<li><a href="javascript:void(0)">FreeOTP</a></li> <li><a href="javascript:void(0)">FreeOTP</a></li>
<li><a href="javascript:void(0)">Google Authenticator</a></li> <li><a href="javascript:void(0)">Google Authenticator</a></li>
@ -31,17 +31,17 @@
<div class="row"> <div class="row">
<div class="col-sm-12 col-md-4"> <div class="col-sm-12 col-md-4">
<div class="qrcode-img"> <div class="qrcode-img">
<img src="${resourceUrl}/app/assets/img/QRCode.png"> <img src="${resourceUrl}/app/assets/img/QRCode.png" id="authenticatorQrCode">
</div> </div>
<div class="qrcode-code"> <div class="qrcode-code">
<div class="input-group"> <div class="input-group">
<input class="form-control" type="text" value="2AEB 293G OQ3D 1O23 09UW WOIE WO30 FAL2" disabled> <input class="form-control" type="text" value="2AEB 293G OQ3D 1O23 09UW WOIE WO30 FAL2" disabled id="authenticatorKey">
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn btn-default" type="button">{{'doCopy' | translate}}</button> <button class="btn btn-default" type="button" id="authenticatorCopyBtn">{{'doCopy' | translate}}</button>
</span> </span>
</div> </div>
<div class="link-right"> <div class="link-right">
<a href="#">{{'scanBarCode' | translate}}</a> <a href="#" id="scanBarCode">{{'scanBarCode' | translate}}</a>
</div> </div>
</div> </div>
@ -53,8 +53,8 @@
<input class="form-control" type="text" id="input11"> <input class="form-control" type="text" id="input11">
</div> </div>
<div class="form-group"> <div class="form-group">
<button type="submit" class="btn btn-default" disabled="">{{'doFinish' | translate}}</button> <button type="submit" class="btn btn-default" disabled="" id="authenticatorFinishBtn">{{'doFinish' | translate}}</button>
<button type="submit" class="btn btn-default">{{'doCancel' | translate}}</button> <button type="submit" class="btn btn-default" id="authenticatorCancelBtn">{{'doCancel' | translate}}</button>
</div> </div>
</form> </form>
</div> </div>

12
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/authenticator-page/sms-code-setup-page.component.html
View file

@ -1,4 +1,4 @@
<ol class="breadcrumb"> <ol class="breadcrumb" id="breadcrumbs">
<li>{{'accountSecurityTitle' | translate}}</li> <li>{{'accountSecurityTitle' | translate}}</li>
<li> <li>
<a href="#">{{'authenticatorTitle' | translate}}</a> <a href="#">{{'authenticatorTitle' | translate}}</a>
@ -9,10 +9,10 @@
<div class="col-sm-12 card-pf "> <div class="col-sm-12 card-pf ">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-sm-12 col-md-4"> <div class="col-sm-12 col-md-4">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="authenticatorSMSCodeSetupTitle">
{{'authenticatorSMSCodeSetupTitle' | translate}} {{'authenticatorSMSCodeSetupTitle' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="smscodeIntroMessage">
<p>{{'smscodeIntroMessage' | translate}}</p> <p>{{'smscodeIntroMessage' | translate}}</p>
</div> </div>
</div> </div>
@ -24,7 +24,7 @@
China +86 China +86
<span class="caret dropdown-caret"></span> <span class="caret dropdown-caret"></span>
</button> </button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu-lan"> <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu-lan" id="dropdownMenu">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Argentina +54</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Argentina +54</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Brazil +55</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Brazil +55</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Canada +1</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Canada +1</a></li>
@ -43,6 +43,6 @@
<label for="EnterVerificationCode">{{'enterYourVerficationCode' | translate}}</label> <label for="EnterVerificationCode">{{'enterYourVerficationCode' | translate}}</label>
<input class="form-control" id="EnterVerificationCode"> <input class="form-control" id="EnterVerificationCode">
</div> </div>
<button class="btn btn-primary">Finish</button> <button class="btn btn-primary" id="authenticatorFinishBtn">Finish</button>
<button class="btn btn-default">Cancel</button> <button class="btn btn-default" id="authenticatorCancelBtn">Cancel</button>
</div> </div>

16
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/device-activity-page/device-activity-page.component.html
View file

@ -1,5 +1,5 @@
<div class="page-header"> <div class="page-header">
<h1>{{'deviceActivityHtmlTitle' | translate}}</h1> <h1 id="pageTitle">{{'deviceActivityHtmlTitle' | translate}}</h1>
</div> </div>
@ -7,18 +7,18 @@
<div class="card-pf-body"> <div class="card-pf-body">
<div class="row"> <div class="row">
<div class="col-sm-12 col-md-8"> <div class="col-sm-12 col-md-8">
<h2 class="card-pf-title"> <h2 class="card-pf-title" id="signedInDevicesTitle">
Signed In Devices Signed In Devices
</h2> </h2>
<p class="detail-description">You can find devices that have logged into your account from the list. Log out any of them if the device is unfamiliar or logged in wrong place and time.</p> <p class="detail-description" id="signedInDevicesDesc">You can find devices that have logged into your account from the list. Log out any of them if the device is unfamiliar or logged in wrong place and time.</p>
</div> </div>
<div class="col-sm-12 col-md-4"> <div class="col-sm-12 col-md-4">
<button class="btn btn-default pull-right pull-right-sm" type="button" data-toggle="modal" data-target="#myModal">Log Out All Devices</button> <button class="btn btn-default pull-right pull-right-sm" type="button" data-toggle="modal" data-target="#myModal" id="logoutAllDevicesBtn">Log Out All Devices</button>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="container-fluid"> <div class="container-fluid">
<div class="list-group list-view-pf list-view-pf-view"> <div class="list-group list-view-pf list-view-pf-view" id="signedInDevicesList">
<div class="list-group-item"> <div class="list-group-item">
<div class="list-group-item-header"> <div class="list-group-item-header">
<div class="list-view-pf-expand"> <div class="list-view-pf-expand">
@ -116,14 +116,14 @@
</div> </div>
<div class="card-pf"> <div class="card-pf">
<div class="card-pf-body"> <div class="card-pf-body">
<h2 class="card-pf-title"> <h2 class="card-pf-title" id="recentlyUsedDevicesTitle">
Recently Used Devices Recently Used Devices
</h2> </h2>
<p class="detail-description">You can find devices that you used in the last month, but they have not logged into your account anymore.</p> <p class="detail-description" id="recentlyUsedDevicesDesc">You can find devices that you used in the last month, but they have not logged into your account anymore.</p>
<div class="row"> <div class="row">
<div class="container-fluid"> <div class="container-fluid">
<div class="list-group list-view-pf list-view-pf-view"> <div class="list-group list-view-pf list-view-pf-view" id="recentlyUsedDevicesList">
<div class="list-group-item"> <div class="list-group-item">
<div class="list-group-item-header"> <div class="list-group-item-header">
<div class="list-view-pf-expand"> <div class="list-view-pf-expand">

14
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/linked-accounts-page/linked-accounts-page.component.html
View file

@ -1,18 +1,18 @@
<div class="page-header"> <div class="page-header">
<h1>{{'linkedAccountsHtmlTitle' | translate}}</h1> <h1 id="pageTitle">{{'linkedAccountsHtmlTitle' | translate}}</h1>
</div> </div>
<div class="col-sm-12 card-pf card-linked-account"> <div class="col-sm-12 card-pf card-linked-account">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-md-3"> <div class="col-md-3">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="authorizedProvidersSubTitle">
{{'authorizedProvider' | translate}} {{'authorizedProvider' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="authorizedProvidersSubMessage">
<p>{{'authorizedProviderMessage' | translate}}</p> <p>{{'authorizedProviderMessage' | translate}}</p>
</div> </div>
</div> </div>
<div class="col-md-9"> <div class="col-md-9">
<div class="list-group list-view-pf list-view-pf-view"> <div class="list-group list-view-pf list-view-pf-view" id="authorizedProvidersList">
<div class="list-group-item"> <div class="list-group-item">
<div class="list-view-pf-actions"> <div class="list-view-pf-actions">
<a href="#" data-toggle="modal" data-target="#myModal">{{'doRemove' | translate}}</a> <a href="#" data-toggle="modal" data-target="#myModal">{{'doRemove' | translate}}</a>
@ -43,15 +43,15 @@
<div class="col-sm-12 card-pf card-linked-account"> <div class="col-sm-12 card-pf card-linked-account">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-md-3"> <div class="col-md-3">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="identityProviderSubTitle">
{{'identityProvider' | translate}} {{'identityProvider' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="identityProviderSubMessage">
<p>{{'identityProviderMessage' | translate}}</p> <p>{{'identityProviderMessage' | translate}}</p>
</div> </div>
</div> </div>
<div class="col-md-9"> <div class="col-md-9">
<div class="list-group list-view-pf list-view-pf-view "> <div class="list-group list-view-pf list-view-pf-view " id="identityProviderList">
<div class="list-group-item"> <div class="list-group-item">
<div class="list-view-pf-actions"> <div class="list-view-pf-actions">
<a href="#">{{'doLink' | translate}}</a> <a href="#">{{'doLink' | translate}}</a>

2
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/my-resources-page/my-resources-detail-page.component.html
View file

@ -1,4 +1,4 @@
<ol class="breadcrumb"> <ol class="breadcrumb" id="breadcrumbs">
<li><a href="#"> {{'resources' | translate}}</a> <li><a href="#"> {{'resources' | translate}}</a>
</li> </li>
<li class="active"> <strong>Alice Family</strong> <li class="active"> <strong>Alice Family</strong>

2
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/my-resources-page/my-resources-page.component.html
View file

@ -1,5 +1,5 @@
<div class="page-header"> <div class="page-header">
<h1>{{'resources' | translate}}</h1> <h1 id="pageTitle">{{'resources' | translate}}</h1>
</div> </div>
<div class="col-sm-12 card-pf resources-list"> <div class="col-sm-12 card-pf resources-list">
<div class="card-pf-body row"> <div class="card-pf-body row">

2
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/my-resources-page/shared-with-me-detail-page.component.html
View file

@ -1,4 +1,4 @@
<ol class="breadcrumb"> <ol class="breadcrumb" id="breadcrumbs">
<li><a href="#">{{'resources' | translate}}</a> <li><a href="#">{{'resources' | translate}}</a>
</li> </li>
<li class="active"> <strong>Alice Family</strong> <li class="active"> <strong>Alice Family</strong>

2
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/my-resources-page/shared-with-me-page.component.html
View file

@ -1,5 +1,5 @@
<div class="page-header"> <div class="page-header">
<h1>{{'resources' | translate}}</h1> <h1 id="pageTitle">{{'resources' | translate}}</h1>
</div> </div>
<div class="col-sm-12 card-pf resources-list"> <div class="col-sm-12 card-pf resources-list">
<div class="card-pf-body row"> <div class="card-pf-body row">

8
themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/password-page/password-page.component.html
View file

@ -1,9 +1,9 @@
<div class="page-header"> <div class="page-header">
<h1>{{'changePasswordHtmlTitle' | translate}}</h1> <h1 id="pageTitle">{{'changePasswordHtmlTitle' | translate}}</h1>
</div> </div>
<div class="col-sm-12 card-pf"> <div class="col-sm-12 card-pf">
<div class="card-pf-body p-b"> <div class="card-pf-body p-b" id="passwordLastUpdate">
<span class="i pficon pficon-info"></span> <span class="i pficon pficon-info"></span>
{{'passwordLastUpdateMessage' | translate}} <strong>{{lastPasswordUpdate | date:'medium'}}</strong> {{'passwordLastUpdateMessage' | translate}} <strong>{{lastPasswordUpdate | date:'medium'}}</strong>
</div> </div>
@ -12,10 +12,10 @@
<div class="col-sm-12 card-pf"> <div class="col-sm-12 card-pf">
<div class="card-pf-body row"> <div class="card-pf-body row">
<div class="col-sm-4 col-md-4"> <div class="col-sm-4 col-md-4">
<div class="card-pf-subtitle"> <div class="card-pf-subtitle" id="updatePasswordSubTitle">
{{'updatePasswordTitle' | translate}} {{'updatePasswordTitle' | translate}}
</div> </div>
<div class="introMessage"> <div class="introMessage" id="updatePasswordSubMessage">
<strong>{{'updatePasswordMessageTitle' | translate}}</strong> <strong>{{'updatePasswordMessageTitle' | translate}}</strong>
<p>{{'updatePasswordMessage' | translate}}</p> <p>{{'updatePasswordMessage' | translate}}</p>
</div> </div>