libre.sh/keycloak-scim
2
0
Fork 0
Code Issues 14 Pull requests Releases Packages Activity Actions 6

Merge pull request #387 from cardosogabriel/POLISHING_UI

Browse source 
UI POLISHING: design styles and content
This commit is contained in:
Bill Burke 2014-05-16 06:34:09 -04:00
commit 610eaaaaff
41 changed files with 2021 additions and 1571 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
forms/common-themes/src/main/resources/theme/account/base/log.ftl
View file

@ -7,7 +7,7 @@
</div> </div>
</div> </div>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<td>Date</td> <td>Date</td>

124
forms/common-themes/src/main/resources/theme/account/patternfly/resources/css/account.css
View file

@ -28,9 +28,9 @@ header .navbar {
} }
.navbar-pf .navbar-utility { .navbar-pf .navbar-utility {
top: auto; right: 20px;
bottom: 0; top: -34px;
right: 15px; font-size: 12px;
} }
.navbar-pf .navbar-utility > li > a { .navbar-pf .navbar-utility > li > a {
@ -53,54 +53,66 @@ header .navbar {
padding: 0 30px; padding: 0 30px;
} }
/* Sidebar */
.bs-sidebar { .bs-sidebar {
padding-top: 4.3em; background-color: #f9f9f9;
padding-top: 44px;
padding-right: 0; padding-right: 0;
padding-left: 0; padding-left: 0;
z-index: 20;
} }
.bs-sidebar ul { .bs-sidebar ul {
list-style: none; list-style: none;
padding-left: 10px; padding-left: 12px;
} }
.bs-sidebar ul li { .bs-sidebar ul li {
margin-bottom: 0.5em; margin-bottom: 0.5em;
margin-left: -1em; margin-left: -1em;
} }
.bs-sidebar ul li.active a {
background-color: #c7e5f0;
border-color: #56bae0;
font-weight: bold;
background-repeat: no-repeat;
background-position: right center;
}
.bs-sidebar ul li a { .bs-sidebar ul li a {
font-size: 1.3em; font-size: 14px;
font-family: "Open Sans", sans-serif; padding-left: 25px;
padding-left: 1.92307692307692em;
color: #4d5258; color: #4d5258;
line-height: 2.07692307692308em; line-height: 28px;
display: block; display: block;
border-width: 1px 0 1px 1px; border-width: 1px 0 1px 1px;
border-style: solid; border-style: solid;
border-color: #f9f9f9; border-color: #f9f9f9;
} }
.bs-sidebar ul li a:hover,
.bs-sidebar ul li a:focus {
text-decoration: none;
color: #777777;
border-right: 2px solid #aaa;
}
.bs-sidebar ul li.active a {
background-color: #c7e5f0;
border-color: #56bae0;
font-weight: bold;
background-image: url(../img/icon-sidebar-active.svg);
background-repeat: no-repeat;
background-position: right center;
}
.bs-sidebar ul li.active a:hover {
border-right: none;
}
.content-area h2 { .content-area h2 {
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
font-weight: 100; font-weight: 100;
font-size: 2.4em; font-size: 24px;
margin-bottom: 1.04166666666667em; margin-bottom: 25px;
margin-top: 1em; margin-top: 25px;
} }
.subtitle { .subtitle {
text-align: right; text-align: right;
margin-top: 30px; margin-top: 30px;
color: #666; color: #909090;
} }
.required { .required {
@ -143,3 +155,69 @@ header .navbar {
background-color: #E4F3FA; background-color: #E4F3FA;
border-color: #5994B2; border-color: #5994B2;
} }
.form-horizontal {
border-top: 1px solid #E9E8E8;
padding-top: 23px;
}
.form-horizontal .control-label {
color: #909090;
line-height: 1.4em;
padding-top: 5px;
position: relative;
text-align: right;
width: 100%;
}
.form-group {
position: relative;
}
.control-label + .required {
position: absolute;
right: -2px;
top: 0;
}
#kc-form-buttons {
text-align: right;
margin-top: 10px;
}
#kc-form-buttons .btn-primary {
float: right;
margin-left: 8px;
}
/* Authenticator page */
ol {
padding-left: 40px;
}
ol li {
font-size: 13px;
margin-bottom: 10px;
position: relative;
}
ol li img {
margin-top: 15px;
width: 180px;
margin-bottom: 5px;
border: 1px solid #eee;
}
ol li span {
bottom: 80px;
left: 200px;
position: absolute;
font-family: courier, ​monospace;
font-size: 13px;
}
hr + .form-horizontal {
border: none;
padding-top: 0;
}

4
forms/common-themes/src/main/resources/theme/admin/base/resources/js/controllers/realm.js
View file

@ -600,7 +600,7 @@ module.controller('RealmSocialCtrl', function($scope, realm, Realm, serverInfo,
$scope.changed = false; $scope.changed = false;
Realm.update(realmCopy, function () { Realm.update(realmCopy, function () {
$location.url("/realms/" + realm.realm + "/social-settings"); $location.url("/realms/" + realm.realm + "/social-settings");
Notifications.success("Saved changes to realm"); Notifications.success("The changes have been saved to the realm.");
oldCopy = realmCopy; oldCopy = realmCopy;
}); });
}; };
@ -674,7 +674,7 @@ module.controller('RealmTokenDetailCtrl', function($scope, Realm, realm, $http,
$scope.changed = false; $scope.changed = false;
Realm.update(realmCopy, function () { Realm.update(realmCopy, function () {
$location.url("/realms/" + realm.realm + "/token-settings"); $location.url("/realms/" + realm.realm + "/token-settings");
Notifications.success("Your changes have been saved to the realm."); Notifications.success("The changes have been saved to the realm.");
}); });
}; };

51
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/application-detail.html
View file

@ -11,13 +11,6 @@
<li data-ng-show="!application.bearerOnly"><a href="#/realms/{{realm.realm}}/applications/{{application.name}}/sessions">Sessions</a></li> <li data-ng-show="!application.bearerOnly"><a href="#/realms/{{realm.realm}}/applications/{{application.name}}/sessions">Sessions</a></li>
</ul> </ul>
<div id="content"> <div id="content">
<ol class="breadcrumb" data-ng-show="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}/applications">Applications</a></li>
<li class="active">Add Application</li>
</ol>
<h2 data-ng-show="create"><span>{{realm.realm}}</span> Add Application</h2>
<p class="subtitle" data-ng-show="create"><span class="required">*</span> Required fields</p>
<ol class="breadcrumb" data-ng-hide="create"> <ol class="breadcrumb" data-ng-hide="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li> <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}/applications">Applications</a></li> <li><a href="#/realms/{{realm.realm}}/applications">Applications</a></li>
@ -25,6 +18,15 @@
<li class="active">Settings</li> <li class="active">Settings</li>
</ol> </ol>
<h2 data-ng-hide="create"><span>{{application.name}}</span> Settings</h2> <h2 data-ng-hide="create"><span>{{application.name}}</span> Settings</h2>
<ol class="breadcrumb" data-ng-show="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}/applications">Applications</a></li>
<li class="active">Add Application</li>
</ol>
<h2 data-ng-show="create" class="pull-left"><span>{{realm.realm}}</span> Add Application</h2>
<p class="subtitle" data-ng-show="create"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="applicationForm" novalidate kc-read-only="!access.manageApplications"> <form class="form-horizontal" name="applicationForm" novalidate kc-read-only="!access.manageApplications">
<fieldset class="border-top"> <fieldset class="border-top">
<div class="form-group"> <div class="form-group">
@ -53,27 +55,24 @@
</div> </div>
<div class="form-group" data-ng-show="!application.bearerOnly"> <div class="form-group" data-ng-show="!application.bearerOnly">
<label class="col-sm-2 control-label" for="newRedirectUri">Redirect URI <span class="required" data-ng-show="create">*</span></label> <label class="col-sm-2 control-label" for="newRedirectUri">Redirect URI <span class="required" data-ng-show="create">*</span></label>
<div class="col-sm-6"> <div class="col-sm-4 multiple" ng-repeat="redirectUri in application.redirectUris">
<div ng-repeat="redirectUri in application.redirectUris" class="row kc-item-deletable"> <div class="input-group kc-item-deletable">
<div class="col-sm-8"> <input class="form-control" type="text" data-ng-class="{'input-below':!$first}"
<input class="form-control" type="text" data-ng-class="{'input-below':!$first}" name="redirectUri" id="redirectUri" data-ng-model="redirectUri" readonly />
name="redirectUri" id="redirectUri" data-ng-model="redirectUri" readonly /> <span class="input-group-btn">
</div> <button class="btn btn-default" type="button" data-ng-click="deleteRedirectUri($index)">
<div class="col-sm-2">
<button class="btn btn-danger" type="button" data-ng-click="deleteRedirectUri($index)">
Delete</button> Delete</button>
</div> </span>
</div> </div>
</div>
<div class="row"> <div class="col-sm-4 multiple">
<div class="col-sm-8"> <div class="input-group">
<input class="form-control" type="text" name="newRedirectUri" id="newRedirectUri" <input class="form-control" type="text" name="newRedirectUri" id="newRedirectUri"
placeholder="New Redirect URI..." data-ng-model="newRedirectUri" placeholder="New Redirect URI..." data-ng-model="newRedirectUri"
data-ng-class="{'input-below':application.redirectUris.length}" /> data-ng-class="{'input-below':application.redirectUris.length}" />
</div> <span class="input-group-btn">
<div class="col-sm-2"> <button class="btn btn-default" data-ng-click="addRedirectUri()" ng-show="newRedirectUri.length > 0">Add</button>
<button class="btn btn-primary" data-ng-click="addRedirectUri()" ng-show="newRedirectUri.length > 0">Add</button> </span>
</div>
</div> </div>
</div> </div>
</div> </div>

4
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/application-installation.html
View file

@ -19,9 +19,9 @@
<li><a href="#/realms/{{realm.realm}}/applications/{{application.name}}">{{application.name}}</a></li> <li><a href="#/realms/{{realm.realm}}/applications/{{application.name}}">{{application.name}}</a></li>
<li class="active">Installation</li> <li class="active">Installation</li>
</ol> </ol>
<h2>Application Installation</h2> <h2><span>{{application.name}}</span> Installation</h2>
<form class="form-horizontal" name="realmForm" novalidate> <form class="form-horizontal" name="realmForm" novalidate>
<fieldset> <fieldset class="border-top">
<div class="form-group input-select"> <div class="form-group input-select">
<label class="col-sm-2 control-label" for="configFormats">Format Option</label> <label class="col-sm-2 control-label" for="configFormats">Format Option</label>
<div class="col-sm-4"> <div class="col-sm-4">

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/application-list.html
View file

@ -9,7 +9,7 @@
<li class="active">Applications</li> <li class="active">Applications</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Applications</h2> <h2><span>{{realm.realm}}</span> Applications</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="3"> <th class="kc-table-actions" colspan="3">

14
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/application-role-detail.html
View file

@ -28,11 +28,11 @@
<li class="active">{{role.name}}</li> <li class="active">{{role.name}}</li>
</ol> </ol>
<h2 data-ng-hide="create"><span>{{application.name}}</span> {{role.name}}</h2> <h2 data-ng-hide="create" class="pull-left"><span>{{application.name}}</span> {{role.name}}</h2>
<h2 data-ng-show="create"><span>{{application.name}}</span> Add Role</h2> <h2 data-ng-show="create" class="pull-left"><span>{{application.name}}</span> Add Role</h2>
<p class="subtitle"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageApplications"> <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageApplications">
<span class="fieldset-notice"><span class="required">*</span> Required fields</span>
<fieldset class="border-top"> <fieldset class="border-top">
<div class="form-group"> <div class="form-group">
@ -73,10 +73,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>
@ -117,10 +117,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/application-role-list.html
View file

@ -20,7 +20,7 @@
<li class="active">Roles</li> <li class="active">Roles</li>
</ol> </ol>
<h2><span>{{application.name}}</span> Roles</h2> <h2><span>{{application.name}}</span> Roles</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="3" data-ng-show="access.manageApplications"> <th class="kc-table-actions" colspan="3" data-ng-show="access.manageApplications">

8
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/application-scope-mappings.html
View file

@ -35,10 +35,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>
@ -90,10 +90,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/application-sessions.html
View file

@ -32,7 +32,7 @@
</div> </div>
</fieldset> </fieldset>
</form> </form>
<table class="table" data-ng-show="stats.activeSessions > 0"> <table class="table table-striped table-bordered" data-ng-show="stats.activeSessions > 0">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="3"> <th class="kc-table-actions" colspan="3">

6
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/oauth-client-claims.html
View file

@ -9,6 +9,12 @@
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}/revocation">Revocation</a></li> <li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}/revocation">Revocation</a></li>
</ul> </ul>
<div id="content"> <div id="content">
<ol class="breadcrumb" data-ng-hide="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients">OAuth Clients</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}">{{oauth.name}}</a></li>
<li class="active">Claims</li>
</ol>
<h2 data-ng-hide="create"><span>{{oauth.name}}</span> Allowed Claims</h2> <h2 data-ng-hide="create"><span>{{oauth.name}}</span> Allowed Claims</h2>
<form class="form-horizontal" name="claimForm"> <form class="form-horizontal" name="claimForm">
<div data-ng-include data-src="'partials/claims.html'"></div> <div data-ng-include data-src="'partials/claims.html'"></div>

36
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/oauth-client-detail.html
View file

@ -14,7 +14,7 @@
<li><a href="#/realms/{{realm.realm}}/oauth-clients">OAuth Clients</a></li> <li><a href="#/realms/{{realm.realm}}/oauth-clients">OAuth Clients</a></li>
<li class="active">Add OAuth Client</li> <li class="active">Add OAuth Client</li>
</ol> </ol>
<h2 data-ng-show="create"><span>{{realm.realm}}</span> Add OAuth Client</h2> <h2 data-ng-show="create" class="pull-left"><span>{{realm.realm}}</span> Add OAuth Client</h2>
<p class="subtitle" data-ng-show="create"><span class="required">*</span> Required fields</p> <p class="subtitle" data-ng-show="create"><span class="required">*</span> Required fields</p>
<ol class="breadcrumb" data-ng-hide="create"> <ol class="breadcrumb" data-ng-hide="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li> <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -54,26 +54,24 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="col-sm-2 control-label" for="newRedirectUri">Redirect URI <span class="required" data-ng-show="create">*</span></label> <label class="col-sm-2 control-label" for="newRedirectUri">Redirect URI <span class="required" data-ng-show="create">*</span></label>
<div class="col-sm-6"> <div class="col-sm-4 multiple" ng-repeat="redirectUri in oauth.redirectUris">
<div ng-repeat="redirectUri in oauth.redirectUris" class="kc-item-deletable row"> <div class="input-group kc-item-deletable">
<div class="col-sm-8"> <input class="form-control" type="text" data-ng-class="{'input-below':!$first}"
<input class="form-control" type="text" data-ng-class="{'input-below':!$first}" name="redirectUri" id="redirectUri" data-ng-model="redirectUri" readonly />
name="redirectUri" id="redirectUri" data-ng-model="redirectUri" readonly /> <span class="input-group-btn">
</div> <button class="btn btn-default" type="button" data-ng-click="deleteRedirectUri($index)">
<div class="col-sm-2">
<button class="btn btn-danger" type="button" data-ng-click="deleteRedirectUri($index)">
Delete</button> Delete</button>
</div> </span>
</div> </div>
<div class="row"> </div>
<div class="col-sm-8"> <div class="col-sm-4 multiple">
<input class="form-control" type="text" name="newRedirectUri" id="newRedirectUri" <div class="input-group">
placeholder="New Redirect URI..." data-ng-model="newRedirectUri" <input class="form-control" type="text" name="newRedirectUri" id="newRedirectUri"
data-ng-class="{'input-below':oauth.redirectUris.length}" /> placeholder="New Redirect URI..." data-ng-model="newRedirectUri"
</div> data-ng-class="{'input-below':oauth.redirectUris.length}" />
<div class="col-sm-2"> <span class="input-group-btn">
<button class="btn btn-primary" data-ng-click="addRedirectUri()" ng-show="newRedirectUri.length > 0">Add</button> <button class="btn btn-default" data-ng-click="addRedirectUri()" ng-show="newRedirectUri.length > 0">Add</button>
</div> </span>
</div> </div>
</div> </div>
</div> </div>

6
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/oauth-client-installation.html
View file

@ -9,6 +9,12 @@
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}/revocation">Revocation</a></li> <li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}/revocation">Revocation</a></li>
</ul> </ul>
<div id="content"> <div id="content">
<ol class="breadcrumb" data-ng-hide="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients">OAuth Clients</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}">{{oauth.name}}</a></li>
<li class="active">Installation</li>
</ol>
<h2>OAuth Client Installation</h2> <h2>OAuth Client Installation</h2>
<form class="form-horizontal" name="realmForm" novalidate> <form class="form-horizontal" name="realmForm" novalidate>
<fieldset> <fieldset>

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/oauth-client-list.html
View file

@ -9,7 +9,7 @@
<li class="active">OAuth Clients</li> <li class="active">OAuth Clients</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> OAuth Clients</h2> <h2><span>{{realm.realm}}</span> OAuth Clients</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="3"> <th class="kc-table-actions" colspan="3">

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/oauth-client-revocation.html
View file

@ -10,6 +10,8 @@
</ul> </ul>
<div id="content"> <div id="content">
<ol class="breadcrumb"> <ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients">OAuth Clients</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}">{{oauth.name}}</a></li> <li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}">{{oauth.name}}</a></li>
<li class="active">Revocation</li> <li class="active">Revocation</li>
</ol> </ol>

8
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/oauth-client-scope-mappings.html
View file

@ -33,10 +33,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>
@ -77,10 +77,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>

4
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-audit-config.html
View file

@ -15,15 +15,13 @@
<h2><span>{{realm.realm}}</span> Audit Config</h2> <h2><span>{{realm.realm}}</span> Audit Config</h2>
<form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageAudit"> <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageAudit">
<fieldset> <fieldset class="border-top">
<div class="form-group" data-ng-show="access.manageAudit"> <div class="form-group" data-ng-show="access.manageAudit">
<label class="col-sm-2 control-label" for="password">Clear Audit</label> <label class="col-sm-2 control-label" for="password">Clear Audit</label>
<div class="col-sm-4"> <div class="col-sm-4">
<button class="btn btn-danger" type="submit" data-ng-click="clearAudit()" >Clear Audit</button> <button class="btn btn-danger" type="submit" data-ng-click="clearAudit()" >Clear Audit</button>
</div> </div>
</div> </div>
</fieldset>
<fieldset>
<div class="form-group"> <div class="form-group">
<label class="col-sm-2 control-label" for="enabled">Enabled</label> <label class="col-sm-2 control-label" for="enabled">Enabled</label>
<div class="col-sm-4"> <div class="col-sm-4">

4
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-audit.html
View file

@ -9,11 +9,11 @@
<div id="content"> <div id="content">
<ol class="breadcrumb"> <ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li> <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li class="active">Audit</li> <li class="active">View Audit</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Audit Log</h2> <h2><span>{{realm.realm}}</span> Audit Log</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="4"> <th class="kc-table-actions" colspan="4">

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-auth-detail.html
View file

@ -9,7 +9,7 @@
<li><a href="#/realms/{{realm.realm}}/auth-settings">Authentication</a></li> <li><a href="#/realms/{{realm.realm}}/auth-settings">Authentication</a></li>
<li class="active">Add</li> <li class="active">Add</li>
</ol> </ol>
<h2 data-ng-show="create">Add Authentication provider</h2> <h2 data-ng-show="create"><span>{{realm.realm}}</span> Add Authentication provider</h2>
<ol class="breadcrumb" data-ng-hide="create"> <ol class="breadcrumb" data-ng-hide="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li> <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}">Settings</a></li> <li><a href="#/realms/{{realm.realm}}">Settings</a></li>

54
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-auth-list.html
View file

@ -9,33 +9,31 @@
</ol> </ol>
<h2><span>{{realm.realm}}</span> Authentication Providers</h2> <h2><span>{{realm.realm}}</span> Authentication Providers</h2>
<div class="panel"> <table class="table table-striped table-bordered">
<table class="table"> <thead>
<thead> <tr>
<tr> <th class="kc-table-actions" colspan="3">
<th class="kc-table-actions" colspan="3"> <div class="pull-right" data-ng-show="access.manageRealm">
<div class="pull-right" data-ng-show="access.manageRealm"> <a class="btn btn-primary" href="#/realms/{{realm.realm}}/auth-settings/create">Add Provider</a>
<a class="btn btn-primary" href="#/realms/{{realm.realm}}/auth-settings/create">Add Provider</a> </div>
</div> </th>
</th> </tr>
</tr> <tr data-ng-show="authenticationProviders && authenticationProviders.length > 0">
<tr data-ng-show="authenticationProviders && authenticationProviders.length > 0"> <th>Provider Name</th>
<th>Provider Name</th> <th>Password Update Supported</th>
<th>Password Update Supported</th> <th>Configuration</th>
<th>Configuration</th> </tr>
</tr> </thead>
</thead> <tbody>
<tbody> <tr ng-repeat="authProvider in authenticationProviders">
<tr ng-repeat="authProvider in authenticationProviders"> <td><a href="#/realms/{{realm.realm}}/auth-settings/{{$index}}">{{authProvider.providerName|capitalize}}</a></td>
<td><a href="#/realms/{{realm.realm}}/auth-settings/{{$index}}">{{authProvider.providerName|capitalize}}</a></td> <td>{{authProvider.passwordUpdateSupported}}</td>
<td>{{authProvider.passwordUpdateSupported}}</td> <td>{{authProvider.config}}</td>
<td>{{authProvider.config}}</td> </tr>
</tr> <tr data-ng-show="!authenticationProviders || authenticationProviders.length == 0">
<tr data-ng-show="!authenticationProviders || authenticationProviders.length == 0"> <td>No authentication providers available</td>
<td>No authentication providers available</td> </tr>
</tr> </tbody>
</tbody> </table>
</table>
</div>
</div> </div>
</div> </div>

6
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-create.html
View file

@ -1,17 +1,17 @@
<div class="bs-sidebar col-sm-3 "></div> <div class="bs-sidebar col-sm-3 "></div>
<div id="content-area" class="col-sm-9" role="main"> <div id="content-area" class="col-sm-9" role="main">
<div id="content"> <div id="content">
<h2 class="margin-top">Add Realm</h2> <h2 class="margin-top pull-left">Add Realm</h2>
<p class="subtitle margin-top"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="realmForm" novalidate> <form class="form-horizontal" name="realmForm" novalidate>
<span class="fieldset-notice"><span class="required">*</span> Required fields</span>
<fieldset> <fieldset>
<legend><span class="text">Import Realm</span></legend> <legend><span class="text">Import Realm</span></legend>
<div class="form-group"> <div class="form-group">
<label for="name" class="col-sm-2 control-label">Upload JSON File </label> <label for="name" class="col-sm-2 control-label">Upload JSON File </label>
<div class="col-sm-4"> <div class="col-sm-4">
<div class="controls kc-button-input-file" data-ng-show="!files || files.length == 0"> <div class="controls kc-button-input-file" data-ng-show="!files || files.length == 0">
<a href="#" class="kc-button"><span class="kc-icon-upload">Icon: Upload</span>Choose a JSON File...</a> <a href="#" class="btn btn-default"><span class="kc-icon-upload">Icon: Upload</span>Choose a JSON File...</a>
<input id="import-file" type="file" class="transparent" ng-file-select="onFileSelect($files)"> <input id="import-file" type="file" class="transparent" ng-file-select="onFileSelect($files)">
</div> </div>
<span class="kc-uploaded-file" data-ng-show="files.length > 0"> <span class="kc-uploaded-file" data-ng-show="files.length > 0">

37
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-credentials.html
View file

@ -22,7 +22,7 @@
</fieldset> </fieldset>
<fieldset class="border-top"> <fieldset class="border-top">
<legend><span class="text">Realm Password Policy</span></legend> <legend><span class="text">Realm Password Policy</span></legend>
<table class="table"> <table class="table table-striped table-bordered">
<caption class="hidden">Table of Password Policies</caption> <caption class="hidden">Table of Password Policies</caption>
<thead> <thead>
<tr ng-show="(allPolicies|remove:policy:'name').length > 0"> <tr ng-show="(allPolicies|remove:policy:'name').length > 0">
@ -41,23 +41,19 @@
<tr> <tr>
<th>Policy Type</th> <th>Policy Type</th>
<th>Policy Value</th> <th>Policy Value</th>
<th>Actions</th> <th class="actions">Actions</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr ng-repeat="p in policy"> <tr ng-repeat="p in policy">
<td> <td>
<div class="form-group col-sm-12"> <input class="form-control disabled" type="text" value="{{p.name|capitalize}}" readonly>
<input class="form-control disabled" type="text" value="{{p.name|capitalize}}" readonly>
</div>
</td> </td>
<td> <td>
<div class="form-group col-sm-12">
<input class="form-control" ng-model="p.value" type="number" placeholder="No value assigned" min="1" max="50"> <input class="form-control" ng-model="p.value" type="number" placeholder="No value assigned" min="1" max="50">
</div>
</td> </td>
<td> <td class="actions">
<div class="action-div"><i class="pficon pficon-delete" ng-click="removePolicy($index)"></i></div> <div class="action-div"><i class="pficon pficon-delete" ng-click="removePolicy($index)" tooltip-placement="right" tooltip="Remove Policy"></i></div>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@ -70,26 +66,3 @@
</form> </form>
</div> </div>
</div> </div>
<!-- TODO remove once this page is properly styled -->
<style type="text/css">
.realm-policy .actions > div {
display: inline-block;
overflow: hidden;
}
.realm-policy td {
font-size: 10px;
}
.realm-policy .action-div {
display: inline-block;
margin: 5px;
}
.realm-policy .icon-remove, .realm-policy .icon-question {
cursor: pointer;
}
</style>

10
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-default-roles.html
View file

@ -5,7 +5,7 @@
<ol class="breadcrumb"> <ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li> <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}">Settings</a></li> <li><a href="#/realms/{{realm.realm}}">Settings</a></li>
<li class="active">Registration</li> <li class="active">Default Roles</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Default Roles</h2> <h2><span>{{realm.realm}}</span> Default Roles</h2>
<form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm"> <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm">
@ -22,10 +22,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons"> <div class="middle-buttons">
<button class="kc-button kc-vertical" type="submit" ng-click="addRealmDefaultRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addRealmDefaultRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right"><span>Move right</span></span> <span class="kc-icon-arrow-right"><span>Move right</span></span>
</button> </button>
<button class="kc-button kc-vertical" type="submit" ng-click="deleteRealmDefaultRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteRealmDefaultRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left"><span>Move left</span></span> <span class="kc-icon-arrow-left"><span>Move left</span></span>
</button> </button>
</div> </div>
@ -66,10 +66,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons"> <div class="middle-buttons">
<button class="kc-button kc-vertical" type="submit" ng-click="addAppDefaultRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addAppDefaultRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right"><span>Move right</span></span> <span class="kc-icon-arrow-right"><span>Move right</span></span>
</button> </button>
<button class="kc-button kc-vertical" type="submit" ng-click="rmAppDefaultRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="rmAppDefaultRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left"><span>Move left</span></span> <span class="kc-icon-arrow-left"><span>Move left</span></span>
</button> </button>
</div> </div>

5
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-ldap.html
View file

@ -7,9 +7,10 @@
<li><a href="#/realms/{{realm.realm}}">Settings</a></li> <li><a href="#/realms/{{realm.realm}}">Settings</a></li>
<li class="active">Ldap Configuration</li> <li class="active">Ldap Configuration</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Ldap Server Settings</h2> <h2 class="pull-left"><span>{{realm.realm}}</span> Ldap Server Settings</h2>
<p class="subtitle"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm"> <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm">
<span class="fieldset-notice"><span class="required">*</span> Required fields</span>
<fieldset> <fieldset>
<legend><span class="text">Required Settings</span></legend> <legend><span class="text">Required Settings</span></legend>
<div class="form-group clearfix"> <div class="form-group clearfix">

4
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-list.html
View file

@ -8,8 +8,8 @@
<li class="active"><a href="">Realm List</a></li> <li class="active"><a href="">Realm List</a></li>
</ul> </ul>
<div id="content"> <div id="content">
<h2><span>Realms</span></h2> <h2 class="margin-top">Realms</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th>Realm</th> <th>Realm</th>

4
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-smtp.html
View file

@ -7,9 +7,9 @@
<li><a href="#/realms/{{realm.realm}}">Settings</a></li> <li><a href="#/realms/{{realm.realm}}">Settings</a></li>
<li class="active">SMTP Configuration</li> <li class="active">SMTP Configuration</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Email Server Settings</h2> <h2 class="pull-left"><span>{{realm.realm}}</span> Email Server Settings</h2>
<p class="subtitle"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm"> <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm">
<span class="fieldset-notice"><span class="required">*</span> Required fields</span>
<fieldset> <fieldset>
<legend><span class="text">Required Settings</span></legend> <legend><span class="text">Required Settings</span></legend>
<div class="form-group clearfix"> <div class="form-group clearfix">

9
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-social.html
View file

@ -7,7 +7,8 @@
<li><a href="#/realms/{{realm.realm}}">Settings</a></li> <li><a href="#/realms/{{realm.realm}}">Settings</a></li>
<li class="active">Social</li> <li class="active">Social</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Social Providers Settings</h2> <h2 class="pull-left"><span>{{realm.realm}}</span> Social Providers Settings</h2>
<p class="subtitle"><span class="required">*</span> Required fields</p>
<div class="alert alert-info alert-dismissable"> <div class="alert alert-info alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true"> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
@ -20,7 +21,7 @@
<form name="realmForm" novalidate> <form name="realmForm" novalidate>
<fieldset> <fieldset>
<div> <div>
<table class="table"> <table class="table table-striped table-bordered">
<caption class="hidden">Table of social providers</caption> <caption class="hidden">Table of social providers</caption>
<thead> <thead>
<tr> <tr>
@ -58,8 +59,8 @@
<input class="form-control" type="text" placeholder="Secret" ng-model="realm.socialProviders[pId+'.secret']" <input class="form-control" type="text" placeholder="Secret" ng-model="realm.socialProviders[pId+'.secret']"
ng-class="{'dirty': postSaveProviders.indexOf(pId) > -1}" required> ng-class="{'dirty': postSaveProviders.indexOf(pId) > -1}" required>
</td> </td>
<td> <td class="actions">
<div class="action-div"><i class="pficon pficon-delete" ng-click="removeProvider(pId)"></i></div> <div class="action-div"><i class="pficon pficon-delete" ng-click="removeProvider(pId)" tooltip-placement="right" tooltip="Remove Provider"></i></div>
</td> </td>
</tr> </tr>
</tbody> </tbody>

19
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/role-detail.html
View file

@ -1,7 +1,7 @@
<div class="bs-sidebar col-md-3 clearfix" data-ng-include data-src="'partials/realm-menu.html'"></div> <div class="bs-sidebar col-md-3 clearfix" data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-md-9" role="main"> <div id="content-area" class="col-md-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf" data-ng-show="!create"> <ul class="nav nav-tabs nav-tabs-pf">
<li><a href="#/realms/{{realm.realm}}">General</a></li> <li><a href="#/realms/{{realm.realm}}">General</a></li>
<li data-ng-show="realm.social"><a href="#/realms/{{realm.realm}}/social-settings">Social</a></li> <li data-ng-show="realm.social"><a href="#/realms/{{realm.realm}}/social-settings">Social</a></li>
<li class="active"><a href="#/realms/{{realm.realm}}/roles">Roles</a></li> <li class="active"><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -26,10 +26,11 @@
<li><a href="#/realms/{{realm.realm}}/roles">Roles</a></li> <li><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
<li class="active">Add Role</li> <li class="active">Add Role</li>
</ol> </ol>
<h2 data-ng-show="create"><span>{{realm.realm}}</span> Add Role</h2> <h2 data-ng-show="create" class="pull-left"><span>{{realm.realm}}</span> Add Role</h2>
<p class="subtitle" data-ng-show="create"><span class="required">*</span> Required fields</p> <p class="subtitle" data-ng-show="create"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm"> <form class="form-horizontal clearfix" name="realmForm" novalidate kc-read-only="!access.manageRealm">
<fieldset> <fieldset>
<legend><span class="text">Role</span></legend>
<div class="form-group"> <div class="form-group">
<label class="col-sm-2 control-label" for="name">Role name <span class="required" data-ng-show="create">*</span></label> <label class="col-sm-2 control-label" for="name">Role name <span class="required" data-ng-show="create">*</span></label>
@ -58,7 +59,7 @@
</div> </div>
<fieldset data-ng-show="!create && (compositeSwitch || role.composite)"> <fieldset data-ng-show="!create && (compositeSwitch || role.composite)">
<legend uncollapsed><span class="text">Composite Realm Roles</span> </legend> <legend uncollapsed class="collapsible"><span class="text">Composite Realm Roles</span> </legend>
<div class="form-group"> <div class="form-group">
<div class="controls changing-selectors col-sm-10"> <div class="controls changing-selectors col-sm-10">
<div class="select-title"> <div class="select-title">
@ -70,10 +71,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>
@ -90,7 +91,7 @@
</fieldset> </fieldset>
<fieldset ng-show="applications.length > 0 && !create && (compositeSwitch || role.composite)"> <fieldset ng-show="applications.length > 0 && !create && (compositeSwitch || role.composite)">
<legend uncollapsed><span class="text">Composite Application Roles</span> </legend> <legend uncollapsed class="collapsible"><span class="text">Composite Application Roles</span> </legend>
<div class="form-group input-select"> <div class="form-group input-select">
<label class="col-sm-2 control-label" for="applications">Application</label> <label class="col-sm-2 control-label" for="applications">Application</label>
<div class="col-sm-4"> <div class="col-sm-4">
@ -114,10 +115,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons kc-vertical"> <div class="middle-buttons kc-vertical">
<button class="kc-button" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>

6
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/role-list.html
View file

@ -9,15 +9,14 @@
</ol> </ol>
<h2><span>{{realm.realm}}</span> Roles</h2> <h2><span>{{realm.realm}}</span> Roles</h2>
<div class="panel"> <table class="table table-striped table-bordered">
<table class="table">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="3"> <th class="kc-table-actions" colspan="3">
<div class="search-comp clearfix"> <div class="search-comp clearfix">
<input type="text" placeholder="Search..." data-ng-model="searchQuery" class="form-control search"> <input type="text" placeholder="Search..." data-ng-model="searchQuery" class="form-control search">
<button class="kc-icon-search" tooltip-placement="right" <button class="kc-icon-search" tooltip-placement="right"
tooltip="Search by name."> tooltip="Search by name">
Icon: search Icon: search
</button> </button>
</div> </div>
@ -57,6 +56,5 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
</div> </div>
</div> </div>

8
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/role-mappings.html
View file

@ -30,10 +30,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons"> <div class="middle-buttons">
<button class="kc-button kc-vertical" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addRealmRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button kc-vertical" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteRealmRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>
@ -85,10 +85,10 @@
</select> </select>
</div> </div>
<div class="middle-buttons"> <div class="middle-buttons">
<button class="kc-button kc-vertical" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="addApplicationRole()" tooltip="Move right" tooltip-placement="right">
<span class="kc-icon-arrow-right">Move right</span> <span class="kc-icon-arrow-right">Move right</span>
</button> </button>
<button class="kc-button kc-vertical" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="right"> <button class="btn btn-default" type="submit" ng-click="deleteApplicationRole()" tooltip="Move left" tooltip-placement="left">
<span class="kc-icon-arrow-left">Move left</span> <span class="kc-icon-arrow-left">Move left</span>
</button> </button>
</div> </div>

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/session-realm.html
View file

@ -12,7 +12,7 @@
<li class="active">Realm Sessions</li> <li class="active">Realm Sessions</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Sessions</h2> <h2><span>{{realm.realm}}</span> Sessions</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="3"> <th class="kc-table-actions" colspan="3">

4
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/user-credentials.html
View file

@ -12,7 +12,9 @@
<div id="content"> <div id="content">
<ol class="breadcrumb"> <ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li> <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li class="active">Users</li> <li><a href="#/realms/{{realm.realm}}/users">Users</a></li>
<li><a href="#/realms/{{realm.realm}}/users/{{user.username}}">{{user.username}}</a></li>
<li class="active">Credentials</li>
</ol> </ol>
<h2><span>{{user.username}}'s</span> Credentials</h2> <h2><span>{{user.username}}'s</span> Credentials</h2>

7
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/user-detail.html
View file

@ -15,17 +15,18 @@
<li><a href="#/realms/{{realm.realm}}/users">Users</a></li> <li><a href="#/realms/{{realm.realm}}/users">Users</a></li>
<li class="active">Add</li> <li class="active">Add</li>
</ol> </ol>
<h2 data-ng-show="create">Add User</h2> <h2 data-ng-show="create" class="pull-left">Add User</h2>
<ol class="breadcrumb" data-ng-hide="create"> <ol class="breadcrumb" data-ng-hide="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li> <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}/users">Users</a></li> <li><a href="#/realms/{{realm.realm}}/users">Users</a></li>
<li><a href="#/realms/{{realm.realm}}/users/{{user.username}}">{{user.username}}</a></li> <li><a href="#/realms/{{realm.realm}}/users/{{user.username}}">{{user.username}}</a></li>
<li class="active">Attributes</li> <li class="active">Attributes</li>
</ol> </ol>
<h2 data-ng-hide="create"><span>{{user.username}}'s</span> Attributes</h2> <h2 data-ng-hide="create" class="pull-left"><span>{{user.username}}'s</span> Attributes</h2>
<p class="subtitle"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="userForm" novalidate kc-read-only="!access.manageUsers"> <form class="form-horizontal" name="userForm" novalidate kc-read-only="!access.manageUsers">
<span class="fieldset-notice"><span class="required">*</span> Required fields</span>
<fieldset class="border-top"> <fieldset class="border-top">
<div class="form-group"> <div class="form-group">
<label class="col-sm-2 control-label"for="id">ID</label> <label class="col-sm-2 control-label"for="id">ID</label>

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/user-list.html
View file

@ -9,7 +9,7 @@
<li class="active">Users</li> <li class="active">Users</li>
</ol> </ol>
<h2><span>{{realm.realm}}</span> Users</h2> <h2><span>{{realm.realm}}</span> Users</h2>
<table class="table"> <table class="table table-striped table-bordered">
<caption data-ng-show="users" class="hidden">Table of realm users</caption> <caption data-ng-show="users" class="hidden">Table of realm users</caption>
<thead> <thead>
<tr> <tr>

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/user-sessions.html
View file

@ -15,7 +15,7 @@
<li class="active">User Sessions</li> <li class="active">User Sessions</li>
</ol> </ol>
<h2><span>{{user.username}}</span> Sessions</h2> <h2><span>{{user.username}}</span> Sessions</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th class="kc-table-actions" colspan="3"> <th class="kc-table-actions" colspan="3">

2
forms/common-themes/src/main/resources/theme/admin/base/resources/partials/user-social-links.html
View file

@ -15,7 +15,7 @@
<li class="active">Social Links</li> <li class="active">Social Links</li>
</ol> </ol>
<h2><span>{{user.username}}</span> Social Links</h2> <h2><span>{{user.username}}</span> Social Links</h2>
<table class="table"> <table class="table table-striped table-bordered">
<thead> <thead>
<tr> <tr>
<th>Provider Name</th> <th>Provider Name</th>

122
forms/common-themes/src/main/resources/theme/admin/keycloak/resources/css/admin-console.css
View file

@ -16,7 +16,7 @@ body {
} }
.navbar-nav > li > .dropdown-menu { .navbar-nav > li > .dropdown-menu {
left: 15px; left: 20px;
margin-top: 1px; margin-top: 1px;
} }
@ -46,14 +46,15 @@ body {
} }
.navbar-pf .navbar-utility { .navbar-pf .navbar-utility {
right: 15px; right: 20px;
top: -34px; top: -34px;
font-size: 12px;
} }
.navbar-pf .navbar-utility li.dropdown > .dropdown-toggle { .navbar-pf .navbar-utility li.dropdown > .dropdown-toggle {
border-left: none; border-left: none;
padding-top: 11px; padding-top: 11px;
padding-bottom: 12px; padding-bottom: 10px;
color: #fff !important; color: #fff !important;
} }
@ -175,8 +176,23 @@ header .navbar {
font-weight: bold; font-weight: bold;
} }
#content {
padding-top: 10px;
}
/* Forms */ /* Forms */
p.subtitle {
float: right;
color: #909090;
margin-top: 4px;
}
.form-horizontal,
.subtitle + div {
clear: both;
}
.kc-link { .kc-link {
border: none; border: none;
background-color: transparent; background-color: transparent;
@ -200,6 +216,7 @@ header .navbar {
} }
.search-comp input[type="text"] { .search-comp input[type="text"] {
padding-right: 2.45454545454545em; padding-right: 2.45454545454545em;
font-weight: normal;
} }
.search-comp .kc-icon-search { .search-comp .kc-icon-search {
position: absolute; position: absolute;
@ -240,6 +257,15 @@ form .btn + .btn {
margin-left: 3px; margin-left: 3px;
} }
.input-group {
width: 100%;
}
.multiple + .multiple {
clear: both;
margin-left: 16.666666666666664%;
}
/* Top menu */ /* Top menu */
#kc-navigation li.active { #kc-navigation li.active {
@ -250,14 +276,14 @@ form .btn + .btn {
.bs-sidebar { .bs-sidebar {
background-color: #f9f9f9; background-color: #f9f9f9;
padding-top: 43px; padding-top: 44px;
padding-right: 0; padding-right: 0;
padding-left: 0; padding-left: 0;
z-index: 20; z-index: 20;
} }
.bs-sidebar ul { .bs-sidebar ul {
list-style: none; list-style: none;
padding-left: 10px; padding-left: 12px;
} }
.bs-sidebar ul li { .bs-sidebar ul li {
@ -265,10 +291,10 @@ form .btn + .btn {
margin-left: -1em; margin-left: -1em;
} }
.bs-sidebar ul li a { .bs-sidebar ul li a {
font-size: 13px; font-size: 14px;
padding-left: 25px; padding-left: 25px;
color: #4d5258; color: #4d5258;
line-height: 26px; line-height: 28px;
display: block; display: block;
border-width: 1px 0 1px 1px; border-width: 1px 0 1px 1px;
border-style: solid; border-style: solid;
@ -383,6 +409,12 @@ form .btn + .btn {
color: #909090; color: #909090;
line-height: 1.4em; line-height: 1.4em;
padding-top: 5px; padding-top: 5px;
position: relative;
}
.control-label .required {
position: absolute;
right: -2px;
} }
/* Details stuff */ /* Details stuff */
@ -399,6 +431,10 @@ form .btn + .btn {
margin-top: 25px; margin-top: 25px;
} }
#content .subtitle.margin-top {
margin-top: 30px;
}
#content-area #content h2 span { #content-area #content h2 span {
color: #a1a1a1; color: #a1a1a1;
} }
@ -409,10 +445,7 @@ fieldset {
fieldset.border-top { fieldset.border-top {
border-top: 1px solid #E9E8E8; border-top: 1px solid #E9E8E8;
} padding-top: 25px;
fieldset.border-top .form-group:first-child {
padding-top: 25px;
} }
/* Legend stuff */ /* Legend stuff */
@ -420,7 +453,6 @@ legend {
border-color: #E9E8E8; border-color: #E9E8E8;
border-style: solid; border-style: solid;
border-width: 1px 0 0; border-width: 1px 0 0;
cursor: pointer;
display: block; display: block;
font-size: 13px; font-size: 13px;
margin-bottom: 0; margin-bottom: 0;
@ -428,6 +460,10 @@ legend {
padding-top: 18px; padding-top: 18px;
} }
legend.collapsible {
cursor: pointer;
}
legend .text { legend .text {
font-size: 13px; font-size: 13px;
font-weight: bold; font-weight: bold;
@ -542,7 +578,7 @@ legend .kc-icon-collapse {
color: #333333; color: #333333;
display: inline-block; display: inline-block;
font-family: "Open Sans",sans-serif; font-family: "Open Sans",sans-serif;
height: 2.4em; height: 26px;
min-width: 75px; min-width: 75px;
overflow: hidden; overflow: hidden;
padding: 0 0.9em 0 0; padding: 0 0.9em 0 0;
@ -566,7 +602,6 @@ legend .kc-icon-collapse {
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);
border: medium none; border: medium none;
font-family: "Open Sans",sans-serif; font-family: "Open Sans",sans-serif;
font-size: 11px;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
margin-left: -2px; margin-left: -2px;
@ -582,6 +617,12 @@ legend .kc-icon-collapse {
background-color: #D5ECF9; background-color: #D5ECF9;
} }
/* Select2 */
.select2-container-multi .select2-choices .select2-search-field {
height: 26px;
}
/* If input has a button attached to it*/ /* If input has a button attached to it*/
.kc-button-control { .kc-button-control {
@ -600,23 +641,19 @@ legend .kc-icon-collapse {
} }
/* Left-Rigth selector form */ /* Left-Rigth selector form */
.changing-selectors.application {
--padding-left: 12em;
}
.changing-selectors .select-title { .changing-selectors .select-title {
display: inline-block; display: inline-block;
} }
.changing-selectors .select-title label { .changing-selectors .select-title label {
font-size: 11px;
margin-left: 0.2em; margin-left: 0.2em;
margin-bottom: 0.3em; margin-bottom: 0.3em;
margin-top: 0.5em; margin-top: 0.5em;
display: block; display: block;
font-weight: normal;
} }
.changing-selectors select { .changing-selectors select {
min-height: 150px; min-height: 150px;
font-size: 11px; font-size: 12px;
padding: 0.545454545454545em; padding: 0.545454545454545em;
min-width: 18.1818181818182em; min-width: 18.1818181818182em;
border: 1px #b6b6b6 solid; border: 1px #b6b6b6 solid;
@ -631,10 +668,6 @@ legend .kc-icon-collapse {
.changing-selectors select:hover { .changing-selectors select:hover {
border-color: #62afdb; border-color: #62afdb;
} }
.changing-selectors select option {
padding: 0.36363636363636em 0.45454545454545em;
display: block;
}
.changing-selectors select option[disabled="disabled"] { .changing-selectors select option[disabled="disabled"] {
color: #aaa; color: #aaa;
} }
@ -642,7 +675,15 @@ legend .kc-icon-collapse {
display: inline-block; display: inline-block;
margin-left: 0.8em; margin-left: 0.8em;
margin-right: 0.8em; margin-right: 0.8em;
vertical-align: middle; vertical-align: top;
margin-top: 75px;
}
.changing-selectors .middle-buttons .btn {
display: block;
}
.changing-selectors .middle-buttons .btn + .btn {
margin-left: 0;
} }
.changing-selectors .middle-buttons button:first-child { .changing-selectors .middle-buttons button:first-child {
margin-bottom: 0.5em; margin-bottom: 0.5em;
@ -653,6 +694,8 @@ legend .kc-icon-collapse {
} }
.changing-selectors .middle-buttons button span { .changing-selectors .middle-buttons button span {
margin-right: 0; margin-right: 0;
vertical-align: bottom;
margin-bottom: 3px;
} }
.changing-selectors .middle-buttons.kc-vertical .kc-button{ .changing-selectors .middle-buttons.kc-vertical .kc-button{
@ -757,11 +800,32 @@ legend .kc-icon-collapse {
background-color: #E4F3FA; background-color: #E4F3FA;
border-color: #5994B2; border-color: #5994B2;
} }
.modal-header h3 { .modal-header h3 {
margin-top: 9.5px; margin: 5px 0;
} }
.modal-footer { .modal-footer {
margin-top: 0; margin-top: 0;
} }
/* Tables */
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
padding-top: 5px;
padding-bottom: 5px;
}
.actions {
width: 70px;
text-align: center;
}
/* Realm Credentials */
.action-div > i {
cursor: pointer;
}

40
forms/common-themes/src/main/resources/theme/admin/keycloak/resources/css/tables.css
View file

@ -1,3 +1,4 @@
/*
table { table {
width: 100%; width: 100%;
border: 1px #dcdcdc solid; border: 1px #dcdcdc solid;
@ -27,22 +28,9 @@ table thead tr th {
padding: 1px; padding: 1px;
border-top: none; border-top: none;
} }
/*
.kc-table-actions span:last-child {
float: right;
}
*/
.kc-table-actions { .kc-table-actions {
padding: 1px; padding: 1px;
} }
/*
.kc-table-actions button {
padding: 3px 8px;
font-size: 11px;
box-shadow: 1px 2px 2px #e3e3e3;
margin: 4px;
}
*/
.kc-table-number { .kc-table-number {
text-align: right; text-align: right;
width: 100px; width: 100px;
@ -59,33 +47,18 @@ table thead tr th {
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(1, 0, #eeeeee)); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(1, 0, #eeeeee));
border-bottom: 1px #cedede solid; border-bottom: 1px #cedede solid;
} }
/*
table tbody tr td:first-child {
color: #0099d3;
}
*/
table thead tr th:last-child {
/*border-right: none;*/
}
table thead tr th button, table thead tr th button,
table thead tr th .button { table thead tr th .button {
margin-left: 0.72727272727273em; margin-left: 0.72727272727273em;
} }
table tbody tr:first-child td { table tbody tr:first-child td {
border-top: 1px solid #f2f2f2; border-top: 1px solid #f2f2f2;
/* padding-top: 9px; */ }
}
table tbody tr td:last-child {
/* border-right: none;*/
}
/*
table tbody tr:hover {
cursor: pointer;
background-color: #ebebeb;
}
*/
/* Styles from Gabriel */
.kc-table-actions button + button, .kc-table-actions button + button,
.kc-table-actions .button + button { .kc-table-actions .button + button {
margin-left: 5px; margin-left: 5px;
@ -226,3 +199,4 @@ td.audit-error {
.kc-table-actions select { .kc-table-actions select {
height: 26px; height: 26px;
} }
*/

2919
forms/common-themes/src/main/resources/theme/common/keycloak/resources/lib/patternfly/css/patternfly.css
View file

File diff suppressed because it is too large Load diff

4
forms/common-themes/src/main/resources/theme/login/keycloak/resources/css/login.css
View file

@ -10,3 +10,7 @@
.login-pf .container .details { .login-pf .container .details {
border-left: 1px solid rgba(255, 255, 255, 0.1); border-left: 1px solid rgba(255, 255, 255, 0.1);
} }
.login-pf .form-control {
font-size: 12px;
}

37
forms/common-themes/src/main/resources/theme/login/patternfly/resources/css/login.css
View file

@ -2,6 +2,10 @@
padding-top: 40px; padding-top: 40px;
} }
.login-pf a:hover {
color: #0099d3;
}
#kc-logo { #kc-logo {
width: 100%; width: 100%;
} }
@ -25,9 +29,8 @@
#kc-header-wrapper { #kc-header-wrapper {
font-size: 26px; font-size: 26px;
text-transform: uppercase; text-transform: uppercase;
/* display: block; line-height: 1.2em;
position: relative; margin-bottom: 15px;
top: -80px;*/
} }
#kc-container-wrapper { #kc-container-wrapper {
@ -40,6 +43,19 @@
position: relative; position: relative;
} }
#kc-content-wrapper {
overflow-y: hidden;
}
#kc-info {
padding-bottom: 200px;
margin-bottom: -200px;
}
#kc-info-wrapper {
font-size: 13px;
}
#kc-form-options span { #kc-form-options span {
display: block; display: block;
} }
@ -52,11 +68,9 @@
#kc-feedback-wrapper { #kc-feedback-wrapper {
display: inline-block; display: inline-block;
width: auto; width: auto;
background-position: left bottom; background-position: left bottom;
background-repeat: no-repeat; background-repeat: no-repeat;
padding-bottom: 10px; padding-bottom: 10px;
} }
#kc-feedback span { #kc-feedback span {
@ -66,8 +80,7 @@
border-width: 1px 1px 0px 1px; border-width: 1px 1px 0px 1px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 1.27272727272727em center; background-position: 1.27272727272727em center;
font-size: 1.1em; font-weight: normal;
font-weight: bold;
line-height: 1.4em; line-height: 1.4em;
border-radius: 2px; border-radius: 2px;
color: #4d5258; color: #4d5258;
@ -203,19 +216,13 @@ ol#kc-totp-settings li:first-of-type {
@media (max-width: 767px) { @media (max-width: 767px) {
#kc-logo-wrapper { #kc-logo-wrapper {
background-image: url("../img/keycloak-logo.png"); margin-top: 30px;
background-repeat: no-repeat; margin-right: 15px;
background-position: top center;
height: 37px;
margin: 15px;
} }
#kc-header { #kc-header {
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
white-space: normal;
float: none; float: none;
} }