Merge pull request #273 from cardosogabriel/master
Improvements in the console header, content area background, favicon and logos
This commit is contained in:
Bill Burke
commit
8c3225914c
14 changed files with 113 additions and 124 deletions
|
|
@ -6,6 +6,9 @@ body {
|
||||||
background-image: url('../img/logo.png');
|
background-image: url('../img/logo.png');
|
||||||
height: 25px;
|
height: 25px;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
|
width: 103px;
|
||||||
|
margin: 3px 20px 5px;
|
||||||
|
text-indent: -99999px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-pf {
|
.navbar-pf {
|
||||||
|
|
@ -29,21 +32,21 @@ body {
|
||||||
.navbar-pf .navbar-primary > .active > a,
|
.navbar-pf .navbar-primary > .active > a,
|
||||||
.navbar-pf .navbar-primary > .active > a:hover{
|
.navbar-pf .navbar-primary > .active > a:hover{
|
||||||
background-color: rgba(0,0,0,0.1);
|
background-color: rgba(0,0,0,0.1);
|
||||||
border-bottom-color: rgba(0,0,0,0.3);
|
|
||||||
border-right: rgba(0,0,0,0.3);
|
|
||||||
border-top-color: rgba(0,0,0,0.1);
|
|
||||||
font-weight: 600;
|
|
||||||
background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.1) 100%);
|
background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.1) 100%);
|
||||||
background-image: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.1) 100%);
|
background-image: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.1) 100%);
|
||||||
background-repeat: repeat-x;
|
border-bottom: none;
|
||||||
font-size: 12px;
|
border-right-color: rgba(255,255,255,0.15);
|
||||||
margin-top: 0;
|
border-top-color: rgba(255,255,255,0.05);
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-pf .navbar-primary li.dropdown.context > a {
|
.navbar-pf .navbar-primary li.dropdown.context > a {
|
||||||
padding-right: 12px;
|
padding-right: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.navbar-pf .navbar-primary > li > a {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
|
|
||||||
.navbar-pf .navbar-primary li.dropdown.context > a:hover,
|
.navbar-pf .navbar-primary li.dropdown.context > a:hover,
|
||||||
.navbar-pf .navbar-primary li.dropdown.context.open > a,
|
.navbar-pf .navbar-primary li.dropdown.context.open > a,
|
||||||
.navbar-pf .navbar-primary > .active > a:hover {
|
.navbar-pf .navbar-primary > .active > a:hover {
|
||||||
|
|
@ -61,15 +64,15 @@ body {
|
||||||
background-repeat: repeat-x;
|
background-repeat: repeat-x;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-pf .navbar-nav > li > a {
|
.navbar-pf .navbar-utility li.dropdown > .dropdown-toggle {
|
||||||
border-left: none;
|
border-left: none;
|
||||||
padding-top: 12px;
|
padding-top: 11px;
|
||||||
padding-bottom: 11px;
|
padding-bottom: 11px;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-pf .navbar-utility li.dropdown > .dropdown-toggle .pficon-user {
|
.navbar-pf .navbar-utility li.dropdown > .dropdown-toggle .pficon-user {
|
||||||
top: 11px;
|
top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-pf .navbar-utility > li > a:hover,
|
.navbar-pf .navbar-utility > li > a:hover,
|
||||||
|
|
@ -78,12 +81,12 @@ body {
|
||||||
background-color: rgba(0,0,0,0.2);
|
background-color: rgba(0,0,0,0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
#content, #content-area {
|
html, body, body > .container, #view {
|
||||||
background-color: #FFFFFF;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
html, body, body > .container, #view, #content-area{
|
body > .container {
|
||||||
height: 100%;
|
height: calc(100% - 80px);
|
||||||
}
|
}
|
||||||
|
|
||||||
#content .glyphicon {
|
#content .glyphicon {
|
||||||
|
|
@ -141,7 +144,9 @@ th.kc-table-actions {
|
||||||
border-color: #CECECE;
|
border-color: #CECECE;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-width: 0 1px;
|
border-width: 0 1px;
|
||||||
padding: 0;
|
padding: 0 0 40px;
|
||||||
|
background-color: #fff;
|
||||||
|
min-height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#content-area > * {
|
#content-area > * {
|
||||||
|
|
@ -171,15 +176,6 @@ header .navbar {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-pf .navbar-title {
|
|
||||||
color: #ddd;
|
|
||||||
margin: .3em .4em;
|
|
||||||
padding: 0;
|
|
||||||
font-size: inherit;
|
|
||||||
font-size: 1.3em;
|
|
||||||
text-transform: uppercase;
|
|
||||||
}
|
|
||||||
|
|
||||||
#idletimeout {
|
#idletimeout {
|
||||||
background: #CC5100;
|
background: #CC5100;
|
||||||
color: #FFFFFF;
|
color: #FFFFFF;
|
||||||
|
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.5 KiB |
|
|
@ -67,9 +67,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<header class="navbar navbar-default navbar-pf navbar-main header">
|
<header class="navbar navbar-default navbar-pf navbar-main header">
|
||||||
<div class="container">
|
<div data-ng-include data-src="'partials/menu.html'"></div>
|
||||||
<div data-ng-include data-src="'partials/menu.html'"></div>
|
|
||||||
</div>
|
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
|
||||||
|
|
@ -67,92 +67,89 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<header class="navbar navbar-default navbar-pf navbar-main header">
|
<header class="navbar navbar-default navbar-pf navbar-main header">
|
||||||
<div class="container">
|
<nav id="kc-navigation" class="navbar" role="navigation">
|
||||||
<nav id="kc-navigation" class="navbar" role="navigation">
|
<div class="navbar-header">
|
||||||
<div class="navbar-header">
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse-1">
|
||||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse-1">
|
<span class="sr-only">Toggle navigation</span>
|
||||||
<span class="sr-only">Toggle navigation</span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
</button>
|
||||||
</button>
|
<h1 class="navbar-title"><Strong>KeyCloak</Strong> Central Login</h1>
|
||||||
<h1 class="navbar-title"><Strong>KeyCloak</Strong> Central Login</h1>
|
</div>
|
||||||
</div>
|
<div class="collapse navbar-collapse navbar-collapse-1">
|
||||||
<div class="collapse navbar-collapse navbar-collapse-1">
|
<ul class="nav navbar-nav navbar-utility" data-ng-show="auth.loggedIn">
|
||||||
<ul class="nav navbar-nav navbar-utility" data-ng-show="auth.loggedIn">
|
<li class="dropdown">
|
||||||
<li class="dropdown">
|
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
|
||||||
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
|
<span class="pficon pficon-user"></span>
|
||||||
<span class="pficon pficon-user"></span>
|
{{auth.user.displayName}}<b class="caret"></b>
|
||||||
{{auth.user.displayName}}<b class="caret"></b>
|
</a>
|
||||||
</a>
|
<ul class="dropdown-menu">
|
||||||
<ul class="dropdown-menu">
|
<li><a href="/auth/rest/realms/keycloak-admin/account?referrer=admin-console">Manage Account</a></li>
|
||||||
<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>
|
||||||
<li class="separator"><a href="/auth/rest/admin/logout">Sign Out</a></li>
|
</ul>
|
||||||
</ul>
|
</li>
|
||||||
</li>
|
</ul>
|
||||||
</ul>
|
<ul class="nav navbar-nav navbar-primary persistent-secondary" data-ng-controller="RealmDropdownCtrl">
|
||||||
<ul class="nav navbar-nav navbar-primary persistent-secondary" data-ng-controller="RealmDropdownCtrl">
|
<li class="dropdown context" data-ng-show="showNav()">
|
||||||
<li class="dropdown context" data-ng-show="showNav()">
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
Realm: {{current.realm.id}}
|
||||||
Realm: {{current.realm.id}}
|
<b class="caret"></b>
|
||||||
<b class="caret"></b>
|
</a>
|
||||||
</a>
|
<ul class="dropdown-menu">
|
||||||
<ul class="dropdown-menu">
|
<li data-ng-repeat="realm in current.realms">
|
||||||
<li data-ng-repeat="realm in current.realms">
|
<a href="" ng-click="changeRealm(realm.id)" >{{realm.id}}</a>
|
||||||
<a href="" ng-click="changeRealm(realm.id)" >{{realm.id}}</a>
|
</li>
|
||||||
</li>
|
</ul>
|
||||||
</ul>
|
</li>
|
||||||
</li>
|
|
||||||
|
|
||||||
|
|
||||||
<!--------------------------------------->
|
<!--------------------------------------->
|
||||||
<li class="active">
|
<li class="active">
|
||||||
<a href="#">Settings</a>
|
<a href="#">Settings</a>
|
||||||
<ul class="nav navbar-nav navbar-persistent">
|
<ul class="nav navbar-nav navbar-persistent">
|
||||||
<li class="active">
|
<li class="active">
|
||||||
<a href="#">General</a>
|
<a href="#">General</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Roles</a>
|
<a href="#">Roles</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Default Roles</a>
|
<a href="#">Default Roles</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Credentials</a>
|
<a href="#">Credentials</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Token</a>
|
<a href="#">Token</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Keys</a>
|
<a href="#">Keys</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Email</a>
|
<a href="#">Email</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">User</a>
|
<a href="#">User</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">Applications</a>
|
<a href="#">Applications</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">OAuth Clients</a>
|
<a href="#">OAuth Clients</a>
|
||||||
</li>
|
</li>
|
||||||
<!--------------------------------------->
|
<!--------------------------------------->
|
||||||
|
|
||||||
|
|
||||||
<li class="active pull-right" data-ng-show="auth.loggedIn">
|
<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'"
|
<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>
|
data-ng-show="auth.loggedIn">Add Realm</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
</div>
|
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
</button>
|
</button>
|
||||||
<h1 class="navbar-title"></h1>
|
<h1 class="navbar-title">Keycloak</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="collapse navbar-collapse navbar-collapse-1">
|
<div class="collapse navbar-collapse navbar-collapse-1">
|
||||||
<ul class="nav navbar-nav navbar-utility" data-ng-show="auth.loggedIn">
|
<ul class="nav navbar-nav navbar-utility" data-ng-show="auth.loggedIn">
|
||||||
|
|
|
||||||
|
|
@ -19,22 +19,20 @@
|
||||||
<body class="admin-console user ${bodyClass}">
|
<body class="admin-console user ${bodyClass}">
|
||||||
|
|
||||||
<header class="navbar navbar-default navbar-pf navbar-main header">
|
<header class="navbar navbar-default navbar-pf navbar-main header">
|
||||||
<div class="container">
|
<div>
|
||||||
<div>
|
<nav class="navbar" role="navigation">
|
||||||
<nav class="navbar" role="navigation">
|
<div class="navbar-header">
|
||||||
<div class="navbar-header">
|
<div class="navbar-title">
|
||||||
<div class="navbar-title">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="navbar-collapse">
|
<div class="navbar-collapse">
|
||||||
<ul class="nav navbar-nav navbar-utility">
|
<ul class="nav navbar-nav navbar-utility">
|
||||||
<#if referrer?has_content><li><a href="${referrer.baseUrl}">Back to ${referrer.name}</a></li></#if>
|
<#if referrer?has_content><li><a href="${referrer.baseUrl}">Back to ${referrer.name}</a></li></#if>
|
||||||
<li><a href="${url.logoutUrl}">Sign Out</a></li>
|
<li><a href="${url.logoutUrl}">Sign Out</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
BIN
misc/logo/keycloak-logo.png
Normal file
BIN
misc/logo/keycloak-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
misc/logo/logo.png
Normal file
BIN
misc/logo/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
0
untitled file
Normal file
0
untitled file
Normal file
Loading…
Reference in a new issue