More toolbar/layout tweaks

hawtio · Aug 27, 2013 · 0f08491 · 0f08491
1 parent c938036
commit 0f08491
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 40 deletions.
diff --git a/hawtio-web/src/main/webapp/app/jvm/html/connect.html b/hawtio-web/src/main/webapp/app/jvm/html/connect.html
@@ -1,20 +1,19 @@
 <!-- TODO Should we split this page into partials, and just just allow plugins to register their configurable preferences to this page? -->
 <div ng-controller="JVM.ConnectController">
-  <div class="logbar">
-    <div class="wiki logbar-container">
-      <ul class="nav nav-tabs">
-        <li ng-repeat="link in breadcrumbs" ng-show="isValid(link)" ng-class='{active : isActive(link.href)}'>
-          <a ng-href="{{link.href}}{{hash}}" ng-bind-html-unsafe="link.content"></a>
-        </li>
-        <li class="pull-right">
-          <a href='' ng-click="fetch()"><i class="icon-refresh"></i> Refresh</a>
-        </li>
-      </ul>
-    </div>
-  </div>
 
 
-  <div class="wiki-fixed row-fluid">
+  <div>
+    <ul class="nav nav-tabs connected">
+      <li ng-repeat="link in breadcrumbs" ng-show="isValid(link)" ng-class='{active : isActive(link.href)}'>
+        <a ng-href="{{link.href}}{{hash}}" ng-bind-html-unsafe="link.content"></a>
+      </li>
+      <li class="pull-right">
+        <a href='' ng-click="fetch()"><i class="icon-refresh"></i> Refresh</a>
+      </li>
+    </ul>
+  </div>
+
+  <div class="row-fluid">
     <form class="form-horizontal">
       <div class="control-group">
         <label class="control-label" for="host" title="The host name used to connect over HTTP">host name</label>

diff --git a/hawtio-web/src/main/webapp/app/jvm/html/local.html b/hawtio-web/src/main/webapp/app/jvm/html/local.html
@@ -1,23 +1,21 @@
 <div ng-controller="JVM.JVMsController">
 
-  <div class="logbar">
-    <div class="wiki logbar-container">
-      <ul class="nav nav-tabs">
-        <li ng-repeat="link in breadcrumbs" ng-show="isValid(link)" ng-class='{active : isActive(link.href)}'>
-          <a ng-href="{{link.href}}{{hash}}" ng-bind-html-unsafe="link.content"></a>
-        </li>
-        <li class="pull-right">
-          <a href='' ng-click="fetch()"><i class="icon-refresh"></i> Refresh</a>
-        </li>
-      </ul>
-    </div>
+  <div>
+    <ul class="nav nav-tabs connected">
+      <li ng-repeat="link in breadcrumbs" ng-show="isValid(link)" ng-class='{active : isActive(link.href)}'>
+        <a ng-href="{{link.href}}{{hash}}" ng-bind-html-unsafe="link.content"></a>
+      </li>
+      <li class="pull-right">
+        <a href='' ng-click="fetch()"><i class="icon-refresh"></i> Refresh</a>
+      </li>
+    </ul>
   </div>
 
-  <div ng-hide='data.length > 0' class='wiki-fixed row-fluid'>
+  <div ng-hide='data.length > 0' class='row-fluid'>
     {{status}}
   </div>
 
-  <div ng-show='data.length > 0' class="wiki-fixed row-fluid">
+  <div ng-show='data.length > 0' class="row-fluid">
     <table class='centered table table-bordered table-condensed table-striped'>
       <thead>
       <tr>

diff --git a/hawtio-web/src/main/webapp/app/wiki/js/navbar.ts b/hawtio-web/src/main/webapp/app/wiki/js/navbar.ts
@@ -22,7 +22,6 @@ module Wiki {
     };
 
     $scope.isActive = (href) => {
-      console.log("href: ", href);
       var tidy = Core.trimLeading(href, "#");
       var loc = $location.path();
       if (loc === tidy) return true;

diff --git a/hawtio-web/src/main/webapp/css/site-branding.css b/hawtio-web/src/main/webapp/css/site-branding.css
@@ -7,10 +7,14 @@ input, button, select, textarea {
 }
 
 html, body {
+  /*
   min-height: 800px;
+  */
   min-width: 850px;
   font-size: 13.5px;
+  /*
   height: 100%;
+  */
 }
 
 small {
@@ -200,14 +204,14 @@ a:hover {
   border: 1px solid inherit;
   padding-left: 0px;
   padding-right: 0px;
-  padding-top: 5px;
-  padding-bottom: 6px;
+  padding-top: 6px;
+  padding-bottom: 5px;
 }
 
 #main.container-fluid div .nav li a:hover {
   border-radius: 0;
-  padding-top: 5px;
-  padding-bottom: 6px;
+  padding-top: 6px;
+  padding-bottom: 5px;
 }
 
 #main.container-fluid div .nav li.active a {
@@ -226,14 +230,17 @@ a:hover {
   color: #2289ba;
   box-shadow: none;
   border-bottom: 1px solid #2289ba;
-  padding-top: 5px;
-  padding-bottom: 6px;
+  padding-top: 6px;
+  padding-bottom: 5px;
 }
 
-div[ng-include][src='viewPartial'] {
+/*
+div[ng-include][src='viewPartial'] .row-fluid {
   padding-left: 10px;
   padding-right: 10px;
+  width: auto;
 }
+*/
 
 .nav li a {
   cursor: pointer;
@@ -407,13 +414,28 @@ div[ng-controller='Core.LoginController']:after {
   padding-right: 0;
 }
 
-.wiki.logbar-container {
-  margin-top: 0;
+.logbar-container .control-group {
   margin-bottom: 0;
+}
+
+.logbar-container .control-group:first-child {
   padding-left: 20px;
+}
+
+.logbar-container .control-group:last-child {
   padding-right: 20px;
 }
 
+.logbar-container {
+  margin-top: 4px;
+  margin-bottom: 4px;
+}
+
+.wiki.logbar-container {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
 div#main div ul.nav li a.nav-primary:hover, div#main div ul.nav li a.nav-primary:active, div#main div ul.nav li a.nav-primary.active, div#main div ul.nav li a.nav-primary.disabled, div#main div ul.nav li a.nav-primary[disabled] {
   background-color: inherit;
   color: #0044CC;
@@ -521,21 +543,25 @@ li.dropdown.open a.dropdown-toggle {
   left: 1px;
 }
 
-li[ng-repeat='link in breadcrumbs'] {
+.wiki ul li[ng-repeat='link in breadcrumbs']:first-child {
+  padding-left: 20px !important;
+}
+
+.wiki ul li[ng-repeat='link in breadcrumbs'] {
   padding-left: 5px !important;
   padding-right: 5px !important;
   white-space: nowrap;
 }
 
-li[ng-repeat='link in breadcrumbs'] a {
+.wiki ul li[ng-repeat='link in breadcrumbs'] a {
   display: inline-block;
 }
 
-li[ng-repeat='link in breadcrumbs']:after {
+.wiki ul li[ng-repeat='link in breadcrumbs']:after {
   content: '/';
 }
 
-li[ng-repeat='link in breadcrumbs'].active:after {
+.wiki ul li[ng-repeat='link in breadcrumbs'].active:after {
   content: '';
 }
 
@@ -563,3 +589,11 @@ div.hawtio-form-tabs ul.nav-tabs li:first-child {
 div.hawtio-form-tabs ul.nav-tabs li.active:first-child {
   margin-left: 3px;
 }
+
+.instance-name {
+  border-top-left-radius: 0;
+  padding: 0;
+  padding-left: 3px;
+  padding-top: 3px;
+  box-shadow: none;
+}