From 12f080e80366aefeab0d9a1d9c52b6c4eb198e00 Mon Sep 17 00:00:00 2001
From: Gabriel Cardoso <gabrielc.cardoso@gmail.com>
Date: Fri, 7 Mar 2014 14:49:55 -0300
Subject: [PATCH] Full width header

---
 .../resources/admin-ui/css/admin-console.css  |  32 ++--
 .../META-INF/resources/admin/index.html       |   4 +-
 .../META-INF/resources/admin/index_mock.html  | 161 +++++++++---------
 .../resources/admin/partials/menu.html        |   2 +-
 .../resources/theme/account/base/template.ftl |  26 ++-
 5 files changed, 106 insertions(+), 119 deletions(-)

diff --git a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
index e005bd965b..590f840990 100644
--- a/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
+++ b/admin-ui-styles/src/main/resources/META-INF/resources/admin-ui/css/admin-console.css
@@ -6,6 +6,9 @@ body {
     background-image: url('../img/logo.png');
     height: 25px;
     background-repeat: no-repeat;
+    width: 102px;
+    margin: 3px 20px 5px;
+    text-indent: -99999px;
 }
 
 .navbar-pf {
@@ -29,21 +32,21 @@ body {
 .navbar-pf .navbar-primary > .active > a,
 .navbar-pf .navbar-primary > .active > a:hover{
     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: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.1) 100%);
-    background-repeat: repeat-x;
-    font-size: 12px;
-    margin-top: 0;
+    border-bottom: none;
+    border-right-color: rgba(255,255,255,0.15);
+    border-top-color: rgba(255,255,255,0.05);
 }
 
 .navbar-pf .navbar-primary li.dropdown.context > a {
 	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.open > a,
 .navbar-pf .navbar-primary > .active > a:hover {
@@ -61,15 +64,15 @@ body {
     background-repeat: repeat-x;
 }
 
-.navbar-pf .navbar-nav > li > a {
+.navbar-pf .navbar-utility li.dropdown > .dropdown-toggle {
     border-left: none;
-    padding-top: 12px;
+    padding-top: 11px;
     padding-bottom: 11px;
     color: #fff !important;
 }
 
 .navbar-pf .navbar-utility li.dropdown > .dropdown-toggle .pficon-user {
-	top: 11px;
+	top: 10px;
 }
 
 .navbar-pf .navbar-utility > li > a:hover,
@@ -171,15 +174,6 @@ header .navbar {
     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 {
     background: #CC5100;
     color: #FFFFFF;
diff --git a/admin-ui/src/main/resources/META-INF/resources/admin/index.html b/admin-ui/src/main/resources/META-INF/resources/admin/index.html
index 72299d4a98..0a0a967f74 100755
--- a/admin-ui/src/main/resources/META-INF/resources/admin/index.html
+++ b/admin-ui/src/main/resources/META-INF/resources/admin/index.html
@@ -67,9 +67,7 @@
 </div>
 
 <header class="navbar navbar-default navbar-pf navbar-main header">
-    <div class="container">
-        <div data-ng-include data-src="'partials/menu.html'"></div>
-    </div>
+    <div data-ng-include data-src="'partials/menu.html'"></div>
 </header>
 
 <div class="container">
diff --git a/admin-ui/src/main/resources/META-INF/resources/admin/index_mock.html b/admin-ui/src/main/resources/META-INF/resources/admin/index_mock.html
index 6ea63c39f7..f0d11139a6 100755
--- a/admin-ui/src/main/resources/META-INF/resources/admin/index_mock.html
+++ b/admin-ui/src/main/resources/META-INF/resources/admin/index_mock.html
@@ -67,92 +67,89 @@
 </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>
+    <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="#">Settings</a>
-                        <ul class="nav navbar-nav navbar-persistent">
-                            <li class="active">
-                                <a href="#">General</a>
-                            </li>
-                            <li>
-                                <a href="#">Roles</a>
-                            </li>
-                            <li>
-                                <a href="#">Default Roles</a>
-                            </li>
-                            <li>
-                                <a href="#">Credentials</a>
-                            </li>
-                            <li>
-                                <a href="#">Token</a>
-                            </li>
-                            <li>
-                                <a href="#">Keys</a>
-                            </li>
-                            <li>
-                                <a href="#">Email</a>
-                            </li>
-                        </ul>
-                    </li>
-                    <li>
-                        <a href="#">User</a>
-                    </li>
-                    <li>
-                        <a href="#">Applications</a>
-                    </li>
-                    <li>
-                        <a href="#">OAuth Clients</a>
-                    </li>
-                    <!--------------------------------------->
+                <!--------------------------------------->
+                <li class="active">
+                    <a href="#">Settings</a>
+                    <ul class="nav navbar-nav navbar-persistent">
+                        <li class="active">
+                            <a href="#">General</a>
+                        </li>
+                        <li>
+                            <a href="#">Roles</a>
+                        </li>
+                        <li>
+                            <a href="#">Default Roles</a>
+                        </li>
+                        <li>
+                            <a href="#">Credentials</a>
+                        </li>
+                        <li>
+                            <a href="#">Token</a>
+                        </li>
+                        <li>
+                            <a href="#">Keys</a>
+                        </li>
+                        <li>
+                            <a href="#">Email</a>
+                        </li>
+                    </ul>
+                </li>
+                <li>
+                    <a href="#">User</a>
+                </li>
+                <li>
+                    <a href="#">Applications</a>
+                </li>
+                <li>
+                    <a href="#">OAuth Clients</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>
+                <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>
 </header>
 
 <div class="container">
diff --git a/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html b/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html
index b6f07e5244..b3ff7854b9 100755
--- a/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html
+++ b/admin-ui/src/main/resources/META-INF/resources/admin/partials/menu.html
@@ -6,7 +6,7 @@
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
         </button>
-        <h1 class="navbar-title"></h1>
+        <h1 class="navbar-title">Keycloak</h1>
     </div>
     <div class="collapse navbar-collapse navbar-collapse-1">
         <ul class="nav navbar-nav navbar-utility" data-ng-show="auth.loggedIn">
diff --git a/forms/common-themes/src/main/resources/theme/account/base/template.ftl b/forms/common-themes/src/main/resources/theme/account/base/template.ftl
index 355b58304d..1ff34c4246 100644
--- a/forms/common-themes/src/main/resources/theme/account/base/template.ftl
+++ b/forms/common-themes/src/main/resources/theme/account/base/template.ftl
@@ -19,22 +19,20 @@
 <body class="admin-console user ${bodyClass}">
 
     <header class="navbar navbar-default navbar-pf navbar-main header">
-        <div class="container">
-            <div>
-                <nav class="navbar" role="navigation">
-                    <div class="navbar-header">
-                        <div class="navbar-title">
-                        </div>
+        <div>
+            <nav class="navbar" role="navigation">
+                <div class="navbar-header">
+                    <div class="navbar-title">
                     </div>
+                </div>
 
-                    <div class="navbar-collapse">
-                        <ul class="nav navbar-nav navbar-utility">
-                            <#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>
-                        </ul>
-                    </div>
-                </nav>
-            </div>
+                <div class="navbar-collapse">
+                    <ul class="nav navbar-nav navbar-utility">
+                        <#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>
+                    </ul>
+                </div>
+            </nav>
         </div>
     </header>