Realm pages refactoring

This commit is contained in:
Viliam Rockai 2014-02-07 17:56:18 +01:00 committed by Stian Thorgersen
parent c382676bc3
commit 85bdc38ab8
16 changed files with 1408 additions and 713 deletions

View file

@ -2,6 +2,37 @@ html, body, body > .container, #view, #content-area{
height: 100%;
}
#content .glyphicon {
color: #555;
}
#content .glyphicon > span {
display: none;
}
.kc-button {
background-image: -moz-linear-gradient(center top , #FAFAFA 0%, #EDEDED 100%);
border: 1px solid #BBBBBB;
border-radius: 2px;
color: #555;
cursor: pointer;
font-size: 1em;
font-weight: bold;
line-height: 2.18182em;
border-radius: 2px;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15);
font-weight: bold;
letter-spacing: 0.04em;
padding: 0.307692em 1.07692em;
margin: 0.5em;
display: inline-block;
}
p.subtitle {
position: absolute;
right: 2.5em;
}
#content-area {
border-color: #CECECE;
border-style: solid;
@ -266,6 +297,8 @@ legend .kc-icon-collapse {
vertical-align: middle;
}
/* Relam selector from the top menu */
.header .navbar-primary li > .select-rcue {
@ -365,3 +398,60 @@ legend .kc-icon-collapse {
.select-rcue option:hover {
background-color: #D5ECF9;
}
/* Left-Rigth selector form */
.changing-selectors.application {
padding-left: 12em;
}
.changing-selectors .select-title {
display: inline-block;
}
.changing-selectors .select-title label {
font-size: 1.1em;
margin-left: 0.2em;
margin-bottom: 0.3em;
margin-top: 0.5em;
display: block;
font-weight: normal;
}
.changing-selectors select {
min-height: 150px;
font-size: 1.1em;
padding: 0.545454545454545em;
min-width: 18.1818181818182em;
border: 1px #b6b6b6 solid;
border-radius: 2px;
box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
color: #333;
max-width: 200px;
width: auto;
min-width: 150px;
display: inline-block;
}
.changing-selectors select:hover {
border-color: #62afdb;
}
.changing-selectors select option {
padding: 0.36363636363636em 0.45454545454545em;
display: block;
}
.changing-selectors select option[disabled="disabled"] {
color: #aaa;
}
.changing-selectors .middle-buttons {
display: inline-block;
width: 4.5em;
margin-left: 0.8em;
margin-right: 0.8em;
vertical-align: middle;
}
.changing-selectors .middle-buttons button:first-child {
margin-bottom: 0.5em;
}
.changing-selectors .middle-buttons button.disabled span {
opacity: 0.4;
filter: alpha(opacity=40);
}
.changing-selectors .middle-buttons button span {
margin-right: 0;
}

View file

@ -0,0 +1,189 @@
table {
width: 100%;
border: 1px #dcdcdc solid;
border-spacing: 0;
}
table caption {
text-align: left;
font-weight: bold;
padding: 11.5px;
}
table tbody tr:nth-child(even) {
background-color: #f6f6f6;
}
table tbody tr td,
table thead tr th {
font-weight: normal;
padding: 6px 15px;
font-size: 11.5px;
border-top: 1px #ebebeb;
border-right: 1px #dcdcdc solid;
text-align: left;
}
.rcue-table-actions {
padding: 1px;
border-top: none;
}
/*
.rcue-table-actions span:last-child {
float: right;
}
*/
.rcue-table-actions {
padding: 1px;
}
/*
.rcue-table-actions button {
padding: 3px 8px;
font-size: 11px;
box-shadow: 1px 2px 2px #e3e3e3;
margin: 4px;
}
*/
.rcue-table-number {
text-align: right;
width: 100px;
}
table thead tr th {
font-weight: bold;
border: none;
border-right: 1px #dcdcdc solid;
background-image: linear-gradient(top, #fafafa 0%, #eeeeee 100%);
background-image: -o-linear-gradient(top, #fafafa 0%, #eeeeee 100%);
background-image: -moz-linear-gradient(top, #fafafa 0%, #eeeeee 100%);
background-image: -webkit-linear-gradient(top, #fafafa 0%, #eeeeee 100%);
background-image: -ms-linear-gradient(top, #fafafa 0%, #eeeeee 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(1, 0, #eeeeee));
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 {
margin-left: 0.72727272727273em;
}
table tbody tr:first-child td {
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 */
.rcue-table-actions button + button,
.rcue-table-actions .button + button {
margin-left: 5px;
}
.rcue-table-actions div.actions {
float: right;
font-size: 0.90909090909091em;
}
table tbody tr {
border-top: 1px solid #ededed;
}
table tbody tr:hover {
cursor: default;
}
table tbody tr td {
vertical-align: middle;
}
table tbody tr td.token-cell {
padding: 0 0.7em;
line-height: 0;
}
table tbody tr td.token-cell .token {
padding-top: 0.18181818181818em;
padding-bottom: 0.18181818181818em;
margin-top: 6px;
margin-bottom: 5px;
}
table tbody tr td.token-cell button {
float: left;
margin-bottom: 7px;
margin-top: 8px;
}
table tbody.selectable-rows tr:hover {
cursor: pointer;
background-color: #ebebeb;
}
table tbody.selectable-rows tr:first-child td {
padding-top: 9px;
}
table tbody.selectable-rows tr.selected,
table tbody.selectable-rows tr.selected:hover {
background-color: #eaf5fb;
}
table tbody.selectable-rows tr.selected td:first-child,
table tbody.selectable-rows tr.selected:hover td:first-child {
background-image: url(img/icon-row-selected.svg);
background-position: 0.2em center;
background-repeat: no-repeat;
}
table tfoot tr {
border-top: 1px solid #cecece;
}
table tfoot tr .table-nav {
float: right;
}
table tfoot tr .table-nav a {
display: inline-block;
line-height: 2.4em;
border-left: 1px solid #d9d9d9;
width: 3.5em;
background-color: #f3f3f3;
background-image: linear-gradient(top, #fafafa 0%, #ededed 100%);
background-image: -o-linear-gradient(top, #fafafa 0%, #ededed 100%);
background-image: -moz-linear-gradient(top, #fafafa 0%, #ededed 100%);
background-image: -webkit-linear-gradient(top, #fafafa 0%, #ededed 100%);
background-image: -ms-linear-gradient(top, #fafafa 0%, #ededed 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(1, 0, #ededed));
text-indent: -99999em;
background-image: url(img/sprite-table-nav.png);
background-repeat: no-repeat;
background-position: left top;
vertical-align: top;
}
table tfoot tr .table-nav a.last {
background-position: top right;
}
table tfoot tr .table-nav a.prev {
background-position: bottom left;
}
table tfoot tr .table-nav a.next {
background-position: bottom right;
}
table tfoot tr .table-nav a:hover {
background-image: url(img/sprite-table-nav.png);
background-color: #eeeeee;
}
table tfoot tr .table-nav a:active {
box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.25) inset;
}
table tfoot tr .table-nav a.disabled {
opacity: 0.5;
filter: alpha(opacity=50);
cursor: default;
}
table tfoot tr .table-nav a.disabled:active {
box-shadow: none;
}
table tfoot tr .table-nav span {
font-size: 1.1em;
border-left: 1px solid #d9d9d9;
line-height: 2.18181818181818em;
display: inline-block;
padding: 0 1.36363636363636em;
}

View file

@ -13,6 +13,7 @@
<!-- Page styles -->
<link rel="stylesheet" href="/auth/admin-ui/css/admin-console.css">
<link rel="stylesheet" href="/auth/admin-ui/css/tables.css">
<link href="lib/select2-3.4.1/select2.css" rel="stylesheet">
<script src="lib/jquery/jquery-1.10.2.js" type="text/javascript"></script>
@ -28,9 +29,11 @@
<script src="lib/fileupload/angular-file-upload.min.js"></script> <!--
<script src="/auth/admin-ui/bootstrap-3.0.0-wip/js/dropdown.js"></script>
<script src="/auth/admin-ui/bootstrap-3.0.0-wip/js/tooltip.js"></script>
<script src="/auth/admin-ui/js/bootstrap-tokenfield.js"></script>
-->
<script src="/auth/admin-ui/js/bootstrap-tokenfield.js"></script>
<!--
<script src="/auth/admin-ui/bootstrap/js/bootstrap.js"></script>
-->
<script src="js/app.js"></script>
<script src="js/controllers/realm.js"></script>

View file

@ -0,0 +1,305 @@
<!doctype html>
<html lang="en">
<head>
<style>
.mock_view {
padding: 2em 2em;
}
</style>
<meta charset="utf-8">
<title>Keycloak Admin Console</title>
<link rel="icon" href="/auth/admin-ui/img/favicon.ico">
<!-- Frameworks -->
<!--link rel="stylesheet" href="/auth/admin-ui/bootstrap/css/bootstrap.css"-->
<link rel="stylesheet" href="/auth/admin-ui/patternfly/css/patternfly.css">
<!-- Page styles -->
<link rel="stylesheet" href="/auth/admin-ui/css/admin-console.css">
<link href="lib/select2-3.4.1/select2.css" rel="stylesheet">
<script src="lib/jquery/jquery-1.10.2.js" type="text/javascript"></script>
<script src="lib/select2-3.4.1/select2.js" type="text/javascript"></script>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-resource.js"></script>
<script src="lib/angular/ui-bootstrap-tpls-0.4.0.js"></script>
<script src="lib/jquery/jquery.idletimer.js" type="text/javascript"></script>
<script src="lib/jquery/jquery.idletimeout.js" type="text/javascript"></script>
<script src="lib/angular/select2.js" type="text/javascript"></script>
<script src="lib/fileupload/angular-file-upload.min.js"></script> <!--
<script src="/auth/admin-ui/bootstrap-3.0.0-wip/js/dropdown.js"></script>
<script src="/auth/admin-ui/bootstrap-3.0.0-wip/js/tooltip.js"></script>
-->
<script src="/auth/admin-ui/js/bootstrap-tokenfield.js"></script>
<script src="/auth/admin-ui/bootstrap/js/bootstrap.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers/realm.js"></script>
<script src="js/controllers/applications.js"></script>
<script src="js/controllers/oauth-clients.js"></script>
<script src="js/controllers/users.js"></script>
<script src="js/loaders.js"></script>
<script src="js/services.js"></script>
<style>
[ng\:cloak], [ng-cloak], .ng-cloak {
display: none !important;
}
</style>
</head>
<body class="admin-console" data-ng-controller="GlobalCtrl" ng-cloak>
<div id="idletimeout">
You will be logged off in <strong><span></span> seconds</strong> due to inactivity.
<a id="idletimeout-resume" href="#">Click here to continue using this web page</a>.
</div>
<div class="feedback-aligner" data-ng-show="notification" data-ng-click="notification = null">
<div class="alert alert-{{notification.type}}"><strong>{{notification.header}}</strong> {{notification.message}}</div>
</div>
<header class="navbar navbar-default navbar-pf navbar-main header">
<div class="container">
<nav id="kc-navigation" class="navbar" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<h1 class="navbar-title"><Strong>KeyCloak</Strong> Central Login</h1>
</div>
<div class="collapse navbar-collapse navbar-collapse-1">
<ul class="nav navbar-nav navbar-utility" data-ng-show="auth.loggedIn">
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
<span class="pficon pficon-user"></span>
{{auth.user.displayName}}<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="/auth/rest/realms/keycloak-admin/account?referrer=admin-console">Manage Account</a></li>
<li class="separator"><a href="/auth/rest/admin/logout">Sign Out</a></li>
</ul>
</li>
</ul>
<ul class="nav navbar-nav navbar-primary persistent-secondary" data-ng-controller="RealmDropdownCtrl">
<li class="dropdown context" data-ng-show="showNav()">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
Realm: {{current.realm.id}}
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li data-ng-repeat="realm in current.realms">
<a href="" ng-click="changeRealm(realm.id)" >{{realm.id}}</a>
</li>
</ul>
</li>
<!--------------------------------------->
<li class="active">
<a href="#">Another Link</a>
<ul class="nav navbar-nav navbar-persistent">
<li class="dropdown-submenu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Link</a>
<ul class="dropdown-menu">
<li>
<a href="#">Link</a>
</li>
<li>
<a href="#">Another link</a>
</li>
<li>
<a href="#">Something else here</a>
</li>
<li>
<a href="#">Remembering to keep</a>
</li>
<li>
<a href="#">It between five and seven</a>
</li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#">More options</a>
<ul class="dropdown-menu">
<li>
<a href="#">Link</a>
</li>
<li>
<a href="#">Another link</a>
</li>
<li>
<a href="#">Something else here</a>
</li>
<li class="divider"></li>
<li>
<a href="#">Separated link</a>
</li>
<li class="divider"></li>
<li>
<a href="#">One more separated link</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">Another Link</a>
</li>
<li class="dropdown-submenu active">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Something Else Here</a>
<ul class="dropdown-menu">
<li>
<a href="#">Link</a>
</li>
<li>
<a href="#">Another link</a>
</li>
<li>
<a href="#">Something else here</a>
</li>
<li>
<a href="#">Remembering to keep</a>
</li>
<li>
<a href="#">It between five and seven</a>
</li>
<li class="dropdown-submenu dropup active">
<a tabindex="-1" href="#">More options</a>
<ul class="dropdown-menu">
<li class="active">
<a href="#">Link</a>
</li>
<li>
<a href="#">Another link</a>
</li>
<li>
<a href="#">Something else here</a>
</li>
<li class="divider"></li>
<li>
<a href="#">Separated link</a>
</li>
<li class="divider"></li>
<li>
<a href="#">One more separated link</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">Remembering to Keep</a>
</li>
<li>
<a href="#">It Between Five and Seven</a>
</li>
<li class="dropdown-submenu">
<a tabindex="-1" href="#" class="dropdown-toggle" data-toggle="dropdown">More options</a>
<ul class="dropdown-menu">
<li>
<a href="#">Link</a>
</li>
<li>
<a href="#">Another link</a>
</li>
<li>
<a href="#">Something else here</a>
</li>
<li>
<a href="#">Remembering to keep</a>
</li>
<li>
<a href="#">It between five and seven</a>
</li>
<li class="dropdown-submenu pull-left">
<a tabindex="-1" href="#">More options</a>
<ul class="dropdown-menu">
<li>
<a href="#">Link</a>
</li>
<li>
<a href="#">Another link</a>
</li>
<li>
<a href="#">Something else here</a>
</li>
<li class="divider"></li>
<li>
<a href="#">Separated link</a>
</li>
<li class="divider"></li>
<li>
<a href="#">One more separated link</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">And Another</a>
</li>
<li>
<a href="#">As a General Rule</a>
</li>
<li>
<a href="#">Five to Seven Links</a>
</li>
<!--------------------------------------->
<li class="active pull-right" data-ng-show="auth.loggedIn">
<a class="button primary" href="#/create/realm" data-ng-class="path[0] == 'create' && path[1] == 'realm' && 'active'"
data-ng-show="auth.loggedIn">Add Realm</a>
</li>
</ul>
</div>
</nav>
</div>
</header>
<div class="container">
<div class="mock_view" data-ng-view id="view"></div>
<div id="loading" class="loading-backdrop">
<div class="loading">
<span>Loading...</span>
</div>
</div>
</div>
<script type="text/javascript">
$.idleTimeout('#idletimeout', '#idletimeout a', {
idleAfter: 300,
pollingInterval: 60,
keepAliveURL: '/auth/rest/admin/keepalive',
serverResponseEquals: '',
failedRequests: 1,
onTimeout: function(){
$(this).slideUp();
window.location = "/auth/rest/admin/logout";
},
onIdle: function(){
$(this).slideDown(); // show the warning bar
},
onCountdown: function( counter ){
$(this).find("span").html( counter ); // update the counter
},
onResume: function(){
$(this).slideUp(); // hide the warning bar
}
});
</script>
</body>
</html>

View file

@ -482,6 +482,18 @@ module.config([ '$routeProvider', function($routeProvider) {
templateUrl : 'partials/home.html',
controller : 'HomeCtrl'
})
.when('/mocks/:realm', {
templateUrl : 'partials/realm-detail_mock.html',
resolve : {
realm : function(RealmLoader) {
return RealmLoader();
},
serverInfo : function(ServerInfoLoader) {
return ServerInfoLoader();
}
},
controller : 'RealmDetailCtrl'
})
.otherwise({
templateUrl : 'partials/notfound.html'
});
@ -684,6 +696,8 @@ module.directive('kcSave', function ($compile, Notifications) {
return {
restrict: 'A',
link: function ($scope, elem, attr, ctrl) {
elem.addClass("btn btn-primary btn-lg");
elem.attr("type","submit");
elem.bind('click', function() {
$scope.$apply(function() {
var form = elem.closest('form');
@ -707,6 +721,8 @@ module.directive('kcReset', function ($compile, Notifications) {
return {
restrict: 'A',
link: function ($scope, elem, attr, ctrl) {
elem.addClass("btn btn-default btn-lg");
elem.attr("type","submit");
elem.bind('click', function() {
$scope.$apply(function() {
var form = elem.closest('form');
@ -721,6 +737,45 @@ module.directive('kcReset', function ($compile, Notifications) {
}
});
module.directive('kcCancel', function ($compile, Notifications) {
return {
restrict: 'A',
link: function ($scope, elem, attr, ctrl) {
elem.addClass("btn btn-default btn-lg");
elem.attr("type","submit");
}
}
});
module.directive('kcDelete', function ($compile, Notifications) {
return {
restrict: 'A',
link: function ($scope, elem, attr, ctrl) {
elem.addClass("btn btn-danger btn-lg");
elem.attr("type","submit");
}
}
});
module.directive('kcSelect', function ($compile, Notifications) {
return {
scope: {
kcOptions: '=',
kcModel: '=',
id: "="
},
restrict: 'E',
replace: true,
templateUrl: 'templates/kc-select.html',
link: function(scope, element, attr) {
scope.updateModel = function(item) {
scope.kcModel = item;
};
}
}
});
/*
* Used to select the element (invoke $(elem).select()) on specified action list.
* Usages kc-select-action="click mouseover"

View file

@ -1,15 +1,13 @@
<div id="wrapper" class="container">
<div class="row">
<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 class="top-nav">
<ul class="rcue-tabs">
<div class="row">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}">Settings</a></li>
<li class="active"><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}/credentials">Credentials</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}/scope-mappings">Scope</a></li>
<li><a href="#/realms/{{realm.realm}}/oauth-clients/{{oauth.id}}/installation">Installation</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb" data-ng-hide="create">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -22,16 +20,16 @@
<fieldset data-ng-show="passwordRequired">
<legend uncollapsed><span class="text">Change Password</span></legend>
<div class="form-group">
<label for="password">New Password</label>
<div class="controls">
<input type="password" id="password" name="password" data-ng-model="password" autofocus
<label class="col-sm-2 control-label" for="password">New Password</label>
<div class="col-sm-4">
<input class="form-control" type="password" id="password" name="password" data-ng-model="password" autofocus
required>
</div>
</div>
<div class="form-group">
<label class="two-lines" for="password">New Password Confirmation</label>
<div class="controls">
<input type="password" id="confirmPassword" name="confirmPassword" data-ng-model="confirmPassword"
<label class="col-sm-2 control-label two-lines" for="password">New Password Confirmation</label>
<div class="col-sm-4">
<input class="form-control" type="password" id="confirmPassword" name="confirmPassword" data-ng-model="confirmPassword"
required>
</div>
</div>
@ -43,15 +41,15 @@
<fieldset data-ng-show="totpRequired">
<legend uncollapsed><span class="text">Change TOTP Key</span></legend>
<div class="form-group">
<label for="totp">New Key</label>
<div class="controls">
<input type="text" id="totp" name="totp" data-ng-model="totp" autofocus
<label class="col-sm-2 control-label" for="totp">New Key</label>
<div class="col-sm-4">
<input class="form-control" type="text" id="totp" name="totp" data-ng-model="totp" autofocus
required>
<button type="submit" data-ng-click="generateTotp()">Generate
</button>
</div>
</div>
<div class="form-actions">
<div class="pull-right form-actions">
<label></label>
<button type="submit" data-ng-click="changeTotp()" class="primary" ng-show="totp != null">Save
</button>
@ -60,6 +58,4 @@
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>

View file

@ -1,9 +1,6 @@
<div id="wrapper" class="container realm-policy">
<div class="row">
<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 class="top-nav" data-ng-hide="createRealm">
<ul class="rcue-tabs">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<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><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -13,7 +10,7 @@
<li><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
<li><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -21,27 +18,27 @@
<li class="active">Required Credentials</li>
</ol>
<h2><span>{{realm.realm}}</span> Credentials</h2>
<form name="realmForm" novalidate>
<form class="form-horizontal" name="realmForm" novalidate>
<fieldset class="border-top">
<legend uncollapsed><span class="text">Realm Credentials Settings</span></legend>
<div class="form-group clearfix">
<label for="user" class="control-label two-lines">Required User Credentials</label>
<label class="col-sm-2 control-label" for="user" class="control-label two-lines">Required User Credentials</label>
<div class="controls">
<div class="col-sm-4">
<input id="user" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredCredentials" placeholder="Type a role and enter">
</div>
</div>
<div class="form-group clearfix">
<label for="application" class="control-label two-lines">Required Application Credentials</label>
<label class="col-sm-2 control-label" for="application" class="control-label two-lines">Required Application Credentials</label>
<div class="controls">
<div class="col-sm-4">
<input id="application" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredApplicationCredentials" placeholder="Type a role and enter">
</div>
</div>
<div class="form-group clearfix">
<label for="oauth" class="control-label two-lines">Required OAuth Credentials</label>
<label class="col-sm-2 control-label" for="oauth" class="control-label two-lines">Required OAuth Credentials</label>
<div class="controls">
<div class="col-sm-4">
<input id="oauth" type="text" ui-select2="userCredentialOptions" ng-model="realm.requiredOAuthClientCredentials" placeholder="Type a role and enter">
</div>
</div>
@ -49,7 +46,7 @@
<fieldset class="border-top">
<legend uncollapsed><span class="text">Realm Password Policy</span></legend>
<div class="form-group clearfix">
<table>
<table class="table">
<caption class="hidden">Table of Password Policies</caption>
<thead>
<tr ng-show="(allPolicies|remove:policy:'name').length > 0">
@ -91,19 +88,15 @@
</table>
</div>
</fieldset>
<div class="form-actions">
<button type="submit" kc-save class="primary" data-ng-show="changed">Save
</button>
<button type="submit" kc-reset data-ng-show="changed">Clear changes
</button>
<div class="pull-right form-actions">
<button kc-reset data-ng-show="changed">Clear changes</button>
<button kc-save data-ng-show="changed">Save</button>
</div>
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>
<!-- TODO remove once this page is properly styled -->
<style type="text/css">
.realm-policy .actions > div {

View file

@ -1,9 +1,6 @@
<div id="wrapper" class="container">
<div class="row">
<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 class="top-nav" data-ng-hide="createRealm">
<ul class="rcue-tabs">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<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><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -13,7 +10,6 @@
<li><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
<li><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -35,8 +31,12 @@
</select>
</div>
<div class="middle-buttons">
<button type="submit" ng-click="addRealmDefaultRole()" tooltip="Move right" tooltip-placement="right"><span class="icon-arrow-right">Move right</span></button>
<button type="submit" ng-click="deleteRealmDefaultRole()" tooltip="Move left" tooltip-placement="right"><span class="icon-arrow-left">Move left</span></button>
<button class="kc-button" type="submit" ng-click="addRealmDefaultRole()" tooltip="Move right" tooltip-placement="right">
<span class="glyphicon glyphicon-chevron-right"><span>Move right</span></span>
</button>
<button class="kc-button" type="submit" ng-click="deleteRealmDefaultRole()" tooltip="Move left" tooltip-placement="right">
<span class="glyphicon glyphicon-chevron-left"><span>Move left</span></span>
</button>
</div>
<div class="select-title">
<label for="assigned">Realm Default Roles</label>
@ -73,8 +73,12 @@
</select>
</div>
<div class="middle-buttons">
<button type="submit" ng-click="addAppDefaultRole()" tooltip="Move right" tooltip-placement="right"><span class="icon-arrow-right">Move right</span></button>
<button type="submit" ng-click="rmAppDefaultRole()" tooltip="Move left" tooltip-placement="right"><span class="icon-arrow-left">Move left</span></button>
<button class="kc-button" type="submit" ng-click="addAppDefaultRole()" tooltip="Move right" tooltip-placement="right">
<span class="glyphicon glyphicon-chevron-right"><span>Move right</span></span>
</button>
<button class="kc-button" type="submit" ng-click="rmAppDefaultRole()" tooltip="Move left" tooltip-placement="right">
<span class="glyphicon glyphicon-chevron-left"><span>Move left</span></span>
</button>
</div>
<div class="select-title">
<label for="assigned-app">Assigned Default Roles</label>
@ -90,7 +94,4 @@
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>

View file

@ -1,5 +1,5 @@
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<li class="active"><a href="#/realms/{{realm.realm}}">General</a></li>
<li data-ng-show="social"><a href="#/realms/{{realm.realm}}/social-settings">Social</a></li>
@ -77,53 +77,29 @@
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">Optional Settings</span></legend>
<div class="form-group">
<div class="form-group row">
<label class="col-sm-2 control-label" for="loginTheme">Login Theme</label>
<div class="col-sm-4">
<!--<select id="loginTheme" name="loginTheme" ng-model="realm.loginTheme" ng-options="t for t in serverInfo.themes.login"></select>-->
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
{{realm.loginTheme}}
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation" data-ng-repeat="t in serverInfo.themes.login">
<a role="menuitem" tabindex="-1" href="" data-ng-click="realm.loginTheme = t">{{t}}</a>
</li>
</ul>
</div>
<kc-select id="loginTheme" data-kc-model="realm.accountTheme" ng-model="realm.loginTheme" data-kc-options="serverInfo.themes.login"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="accountTheme">Account Theme</label>
<div class="col-sm-4">
<!--<select id="accountTheme" name="accountTheme" ng-model="realm.accountTheme" ng-options="t for t in serverInfo.themes.account"></select>-->
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
{{realm.accountTheme}}
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation" data-ng-repeat="t in serverInfo.themes.account">
<a role="menuitem" tabindex="-1" href="" data-ng-click="realm.accountTheme = t">{{t}}</a>
</li>
</ul>
</div>
<kc-select id="accountTheme" data-kc-model="realm.accountTheme" ng-model="realm.accountTheme" data-kc-options="serverInfo.themes.account"/>
</div>
</div>
</fieldset>
<div class="pull-right form-actions" data-ng-show="createRealm">
<button class="btn btn-default btn-lg" type="submit" data-ng-click="cancel()">Cancel</button>
<button class="btn btn-primary btn-lg" type="submit" kc-save data-ng-show="changed">Save</button>
<button kc-cancel data-ng-click="cancel()">Cancel</button>
<button kc-save data-ng-show="changed">Save</button>
</div>
<div class="pull-right form-actions" data-ng-show="!createRealm">
<button class="btn btn-default btn-lg" type="submit" kc-reset data-ng-show="changed">Clear changes</button>
<button class="btn btn-primary btn-lg" type="submit" kc-save data-ng-show="changed">Save</button>
<button class="btn btn-danger btn-lg" type="submit" data-ng-click="remove()" data-ng-hide="changed">Delete</button>
<button kc-reset data-ng-show="changed">Clear changes</button>
<button kc-save data-ng-show="changed">Save</button>
<button kc-delete data-ng-click="remove()" data-ng-hide="changed">Delete</button>
</div>
</form>
</div>
</div>
</div>

View file

@ -0,0 +1,116 @@
<h2 class="pull-left" data-ng-show="createRealm">Add Realm</h2>
<h2 data-ng-hide="createRealm"><span>{{realm.realm}}</span> General Settings</h2>
<p class="subtitle" data-ng-show="createRealm"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="realmForm" novalidate>
<fieldset>
<legend uncollapsed class="aj-collapse open"><span class="text">Required Settings</span></legend>
<div class="form-group">
<label class="col-sm-2 control-label" for="name">Name <span class="required" data-ng-show="createRealm">*</span></label>
<div class="col-sm-4">
<input class="form-control" type="text" id="name" name="name" data-ng-model="realm.realm" autofocus required>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label control-label" for="enabled">Enabled</label>
<div class="col-sm-4">
<input ng-model="realm.enabled" name="enabled" id="enabled" onoffswitch />
</div>
</div>
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">Login Options</span></legend>
<div class="form-group clearfix block">
<label for="social" class="col-sm-2 control-label">Social login</label>
<div class="col-sm-4">
<input ng-model="realm.social" name="social" id="social" onoffswitch />
</div>
</div>
<div class="form-group clearfix block" data-ng-show="realm.social">
<label for="updateProfileOnInitialSocialLogin" class="col-sm-2 control-label">Update profile on first social login</label>
<div class="col-sm-4">
<input ng-model="realm.updateProfileOnInitialSocialLogin" name="updateProfileOnInitialSocialLogin" id="updateProfileOnInitialSocialLogin" onoffswitch />
</div>
</div>
<div class="form-group clearfix block">
<label for="registrationAllowed" class="col-sm-2 control-label">User registration</label>
<div class="col-sm-4">
<input ng-model="realm.registrationAllowed" name="registrationAllowed" id="registrationAllowed" onoffswitch />
</div>
</div>
<div class="form-group clearfix block">
<label for="resetPasswordAllowed" class="col-sm-2 control-label">Reset password</label>
<div class="col-sm-4">
<input ng-model="realm.resetPasswordAllowed" name="resetPasswordAllowed" id="resetPasswordAllowed" onoffswitch />
</div>
</div>
<div class="form-group clearfix block">
<label for="verifyEmail" class="col-sm-2 control-label">Verify email</label>
<div class="col-sm-4">
<input ng-model="realm.verifyEmail" name="verifyEmail" id="verifyEmail" onoffswitch />
</div>
</div>
<div class="form-group clearfix block">
<label for="requireSsl" class="col-sm-2 control-label">Require SSL</label>
<div class="col-sm-4">
<input ng-model="realm.requireSsl" name="requireSsl" id="requireSsl" onoffswitch />
</div>
</div>
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">Optional Settings</span></legend>
<div class="form-group row">
<label class="col-sm-2 control-label" for="loginTheme">Login Theme</label>
<!--<select id="loginTheme" name="loginTheme" ng-model="realm.loginTheme" ng-options="t for t in serverInfo.themes.login"></select>-->
<div class="col-sm-4">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
{{realm.loginTheme}}
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation" data-ng-repeat="t in serverInfo.themes.login">
<a role="menuitem" tabindex="-1" href="" data-ng-click="realm.loginTheme = t">{{t}}</a>
</li>
</ul>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="accountTheme">Account Theme</label>
<!--<select id="accountTheme" name="accountTheme" ng-model="realm.accountTheme" ng-options="t for t in serverInfo.themes.account"></select>-->
<div class="col-sm-4">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
{{realm.accountTheme}}
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation" data-ng-repeat="t in serverInfo.themes.account">
<a role="menuitem" tabindex="-1" href="" data-ng-click="realm.accountTheme = t">{{t}}</a>
</li>
</ul>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="accountTheme2">Account Theme2</label>
<!--<select id="accountTheme" name="accountTheme" ng-model="realm.accountTheme" ng-options="t for t in serverInfo.themes.account"></select>-->
<div class="col-sm-4">
<kc-select data-kc-model="realm.accountTheme" data-kc-options="serverInfo.themes.account"/>
</div>
</div>
</fieldset>
<div class="pull-right form-actions" data-ng-show="createRealm">
<button kc-cancel data-ng-click="cancel()">Cancel</button>
<button kc-save data-ng-show="changed">Save</button>
</div>
<div class="pull-right form-actions" data-ng-show="!createRealm">
<button kc-reset data-ng-show="changed">Clear changes</button>
<button kc-save data-ng-show="changed">Save</button>
<button kc-delete data-ng-click="remove()" data-ng-hide="changed">Delete</button>
</div>
</form>
</div>

View file

@ -1,9 +1,6 @@
<div id="wrapper" class="container" xmlns="http://www.w3.org/1999/html">
<div class="row">
<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 class="top-nav" data-ng-hide="createRealm">
<ul class="rcue-tabs">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<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><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -13,7 +10,6 @@
<li class="active"><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
<li><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -32,13 +28,9 @@
</div>
</div>
</fieldset>
<div class="form-actions">
<button type="submit" data-ng-click="generate()">Generate new keys</button>
<div class="pull-right form-actions">
<button class="btn btn-primary btn-lg" type="submit" data-ng-click="generate()">Generate new keys</button>
</div>
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>

View file

@ -1,9 +1,6 @@
<div id="wrapper" class="container">
<div class="row">
<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 class="top-nav" data-ng-hide="createRealm">
<ul class="rcue-tabs">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<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><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -13,98 +10,75 @@
<li><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
<li class="active"><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.realm}}">Settings</a></li>
<li class="active">SMTP Configuration</li>
</ol>
<h2 class="pull-left"><span>{{realm.realm}}</span> Email Server Settings</h2>
<p class="subtitle"><span class="required">*</span> Required fields</p>
<form name="realmForm" novalidate>
<h2><span>{{realm.realm}}</span> Email Server Settings</h2>
<p class="subtitle pull-right"><span class="required">*</span> Required fields</p>
<form class="form-horizontal" name="realmForm" novalidate>
<fieldset>
<legend uncollapsed><span class="text">Required Settings</span></legend>
<div class="form-group clearfix">
<label for="smtpHost" class="control-label">Host <span class="required">*</span></label>
<div class="controls">
<input id="smtpHost" type="text" ng-model="realm.smtpServer.host" placeholder="SMTP Host" required>
<label class="col-sm-2 control-label" for="smtpHost">Host <span class="required">*</span></label>
<div class="col-sm-4">
<input class="form-control" id="smtpHost" type="text" ng-model="realm.smtpServer.host" placeholder="SMTP Host" required>
</div>
</div>
<div class="form-group clearfix">
<label for="smtpPort" class="control-label">Port <span class="required">*</span></label>
<div class="controls">
<input id="smtpPort" type="number" ng-model="realm.smtpServer.port" placeholder="SMTP Port (defaults to 25)" required>
<label class="col-sm-2 control-label" for="smtpPort">Port <span class="required">*</span></label>
<div class="col-sm-4">
<input class="form-control" id="smtpPort" type="number" ng-model="realm.smtpServer.port" placeholder="SMTP Port (defaults to 25)" required>
</div>
</div>
<div class="form-group clearfix">
<label for="smtpFrom" class="control-label">From <span class="required">*</span></label>
<div class="controls">
<input id="smtpFrom" type="email" ng-model="realm.smtpServer.from" placeholder="Sender Email Address" required>
<label class="col-sm-2 control-label" for="smtpFrom">From <span class="required">*</span></label>
<div class="col-sm-4">
<input class="form-control" id="smtpFrom" type="email" ng-model="realm.smtpServer.from" placeholder="Sender Email Address" required>
</div>
</div>
<div class="form-group clearfix">
<label for="smtpSSL" class="control-label">Enable SSL</label>
<label class="col-sm-2 control-label" for="smtpSSL">Enable SSL</label>
<div class="col-sm-4">
<input ng-model="realm.smtpServer.ssl" name="smtpSSL" id="smtpSSL" onoffswitch />
</div>
</div>
<div class="form-group clearfix">
<label for="smtpStartTLS" class="control-label">Enable StartTLS</label>
<label class="col-sm-2 control-label" for="smtpStartTLS">Enable StartTLS</label>
<div class="col-sm-4">
<input ng-model="realm.smtpServer.starttls" name="smtpStartTLS" id="smtpStartTLS" onoffswitch />
</div>
</div>
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">Authentication</span></legend>
<div class="form-group clearfix">
<label for="smtpAuth" class="control-label">Enable Authentication</label>
<label class="col-sm-2 control-label" for="smtpAuth">Enable Authentication</label>
<div class="col-sm-4">
<input ng-model="realm.smtpServer.auth" name="smtpAuth" id="smtpAuth" onoffswitch />
</div>
</div>
<div class="form-group clearfix" data-ng-show="realm.smtpServer.auth">
<label for="smtpUsername" class="control-label">Username <span class="required" ng-show="realm.smtpServer.auth">*</span></label>
<div class="controls">
<input id="smtpUsername" type="text" ng-model="realm.smtpServer.user" placeholder="Login Username" ng-disabled="!realm.smtpServer.auth" ng-required="realm.smtpServer.auth">
<label class="col-sm-2 control-label" for="smtpUsername">Username <span class="required" ng-show="realm.smtpServer.auth">*</span></label>
<div class="col-sm-4">
<input class="form-control" id="smtpUsername" type="text" ng-model="realm.smtpServer.user" placeholder="Login Username" ng-disabled="!realm.smtpServer.auth" ng-required="realm.smtpServer.auth">
</div>
</div>
<div class="form-group clearfix" data-ng-show="realm.smtpServer.auth">
<label for="smtpPassword" class="control-label">Password <span class="required" ng-show="realm.smtpServer.auth">*</span></label>
<div class="controls">
<input id="smtpPassword" type="password" ng-model="realm.smtpServer.password" placeholder="Login Password" ng-disabled="!realm.smtpServer.auth" ng-required="realm.smtpServer.auth">
<label class="col-sm-2 control-label" for="smtpPassword">Password <span class="required" ng-show="realm.smtpServer.auth">*</span></label>
<div class="col-sm-4">
<input class="form-control" id="smtpPassword" type="password" ng-model="realm.smtpServer.password" placeholder="Login Password" ng-disabled="!realm.smtpServer.auth" ng-required="realm.smtpServer.auth">
</div>
</div>
</fieldset>
<!--
<fieldset class="border-top">
<div class="form-group clearfix" ng-repeat="(name, setting) in smtpSettings | orderBy: setting.required">
<label for="{{name}}" class="control-label">{{name.replace('mail.smtp.','')}} <span class="required" data-ng-show="setting.required">*</span></label>
<div ng-show="setting.type == 'boolean'" class="onoffswitch">
<input type="checkbox" data-ng-model="realm.smtp[name]" class="onoffswitch-checkbox" name="{{name}}" id="{{name}}">
<label for="{{name}}" class="onoffswitch-label">
<span class="onoffswitch-inner">
<span class="onoffswitch-active">ON</span>
<span class="onoffswitch-inactive">OFF</span>
</span>
<span class="onoffswitch-switch"></span>
</label>
</div>
<div ng-show="setting.type == 'String'" class="controls">
<input id="{{name}}" type="text" ng-model="realm.smtp[name]" placeholder="SMTP {{name}} / {{ setting.required }}">
</div>
<div ng-show="setting.type == 'int'" class="controls">
<input id="{{name}}" type="number" ng-model="realm.smtp[name]" placeholder="SMTP {{name}} / {{ setting.required }}">
</div>
</div>
</fieldset>
-->
<div class="form-actions">
<button type="submit" data-kc-save class="primary" data-ng-show="changed">Save
</button>
<button type="submit" data-kc-reset data-ng-show="changed">Clear changes
</button>
<div class="pull-right form-actions">
<button data-kc-reset data-ng-show="changed">Clear changes</button>
<button data-kc-save data-ng-show="changed">Save</button>
</div>
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>

View file

@ -1,9 +1,6 @@
<div id="wrapper" class="container social-provider">
<div class="row">
<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 class="top-nav" data-ng-hide="createRealm">
<ul class="rcue-tabs">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<li><a href="#/realms/{{realm.realm}}">General</a></li>
<li class="active" data-ng-show="realm.social"><a href="#/realms/{{realm.realm}}/social-settings">Social</a></li>
<li><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -13,7 +10,6 @@
<li><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
<li><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -86,9 +82,7 @@
</div>
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>
</div>
<!-- TODO remove once this page is properly styled -->

View file

@ -1,9 +1,6 @@
<div id="wrapper" class="container">
<div class="row">
<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 class="top-nav" data-ng-hide="createRealm">
<ul class="rcue-tabs">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<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><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -13,7 +10,6 @@
<li><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
<li><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -21,13 +17,18 @@
<li class="active">Token</li>
</ol>
<h2><span>{{realm.realm}}</span> Token Settings</h2>
<form name="realmForm" novalidate>
<form class="form-horizontal" name="realmForm" novalidate>
<fieldset class="border-top">
<div class="form-group input-select">
<label for="tokenLifespan">Token lifespan</label>
<div class="input-group">
<input type="number" required min="1" max="31536000" data-ng-model="realm.tokenLifespan" id="tokenLifespan" name="tokenLifespan" class="tiny">
<div class="select-rcue">
<label class="col-sm-2 control-label" for="tokenLifespan">Token lifespan</label>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-2">
<input class="form-control" type="number" required min="1"
max="31536000" data-ng-model="realm.tokenLifespan"
id="tokenLifespan" name="tokenLifespan"/>
</div>
<div class="col-sm-2 select-rcue">
<select name="tokenLifespanUnit" data-ng-model="realm.tokenLifespanUnit" >
<option data-ng-selected="!realm.tokenLifespanUnit">Seconds</option>
<option>Minutes</option>
@ -37,11 +38,15 @@
</div>
</div>
</div>
<div class="form-group input-select">
<label for="accessCodeLifespan">Access code lifespan</label>
<div class="input-group">
<input type="number" required min="1" max="31536000" data-ng-model="realm.accessCodeLifespan" id="accessCodeLifespan" name="accessCodeLifespan" class="tiny">
<div class="select-rcue">
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="accessCodeLifespan">Access code lifespan</label>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-2">
<input class="form-control" type="number" required min="1" max="31536000" data-ng-model="realm.accessCodeLifespan" id="accessCodeLifespan" name="accessCodeLifespan">
</div>
<div class="col-sm-2 select-rcue">
<select name="accessCodeLifespanUnit" data-ng-model="realm.accessCodeLifespanUnit">
<option data-ng-selected="!realm.accessCodeLifespanUnit">Seconds</option>
<option>Minutes</option>
@ -51,11 +56,15 @@
</div>
</div>
</div>
</div>
<div class="form-group input-select">
<label for="accessCodeLifespanUserAction" class="two-lines">Access code user action lifespan</label>
<div class="input-group">
<input type="number" required min="1" max="31536000" data-ng-model="realm.accessCodeLifespanUserAction" id="accessCodeLifespanUserAction" name="accessCodeLifespanUserAction" class="tiny">
<div class="select-rcue">
<label class="col-sm-2 control-label" for="accessCodeLifespanUserAction" class="two-lines">Access code user action lifespan</label>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-2">
<input class="form-control" type="number" required min="1" max="31536000" data-ng-model="realm.accessCodeLifespanUserAction" id="accessCodeLifespanUserAction" name="accessCodeLifespanUserAction">
</div>
<div class="col-sm-2 select-rcue">
<select name="accessCodeLifespanUserActionUnit" data-ng-model="realm.accessCodeLifespanUserActionUnit">
<option data-ng-selected="!realm.accessCodeLifespanUserActionUnit">Seconds</option>
<option>Minutes</option>
@ -65,16 +74,12 @@
</div>
</div>
</div>
</div>
</fieldset>
<div class="form-actions">
<button type="submit" kc-save class="primary" data-ng-show="changed">Save
</button>
<button type="submit" kc-reset data-ng-show="changed">Clear changes
</button>
<div class="pull-right form-actions">
<button kc-reset data-ng-show="changed">Clear changes</button>
<button kc-save data-ng-show="changed">Save</button>
</div>
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>

View file

@ -1,9 +1,6 @@
<div id="wrapper" class="container">
<div class="row">
<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 class="top-nav">
<ul class="rcue-tabs">
<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-sm-9" role="main">
<ul class="nav nav-tabs nav-tabs-pf">
<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 class="active"><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
@ -13,7 +10,6 @@
<li><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
<li><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
@ -22,14 +18,15 @@
</ol>
<h2><span>{{realm.realm}}</span> Roles</h2>
<div class="feedback info inline" data-ng-show="!roles || roles.length == 0">
<p><strong>You have not configured realm roles.</strong> <a class="button" href="#/create/role/{{realm.realm}}">Add Role</a></p>
<p><strong>You have not configured realm roles.</strong> <a class="kc-button" href="#/create/role/{{realm.realm}}">Add Role</a></p>
</div>
<div class="panel">
<table data-ng-hide="!roles || roles.length == 0">
<thead>
<tr>
<th class="rcue-table-actions" colspan="3">
<div class="actions">
<a class="button" href="#/create/role/{{realm.realm}}">Add Role</a>
<a class="kc-button" href="#/create/role/{{realm.realm}}">Add Role</a>
<!-- <button class="remove disabled">Remove</button> -->
</div>
</th>
@ -73,6 +70,4 @@
</table>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>

View file

@ -0,0 +1,11 @@
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="{{id}}" data-toggle="dropdown">
{{kcModel}}
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li role="presentation" ng-repeat="option in kcOptions">
<a href="" role="menuitem" tabindex="-1" ng-click="updateModel(option)">{{option}}</a>
</li>
</ul>
</div>