Moverd more id bound elements from header bar style to class bound elements for reusability

js/apps/system/aardvark/frontend/css/buttons.css

@@ -18,8 +18,22 @@
   position: relative;
 }
 
+ul.headerButtonList {
+  display: inline-block;
+  *display: inline;
+  margin-bottom: 0;
+  margin-left: 0;
+  padding-left: 0!important;
+}
+
+ul.headerButtonList > li {
+  display: inline;
+  margin-right: 2px;
+}
+
 a.headerButton {
- margin-top: -2px; 
+ float: left;
+ margin-top: 0px; 
  margin-left: 5px;
  margin-right: 5px;
  min-height: 19px;
@@ -30,12 +44,27 @@ a.headerButton {
  color:#FFFFFF !important;
  height:20px;
  width:14px;
+ padding: 5px 11px 2px 9px;
 }
 
 a.paginationButton, ul.arangoPagination a {
   border-radius: 2px;
 }
 
+/* better look of some icons */
+a.headerButton .icon_arangodb_filter {
+  top: 1px !important;
+}
+
+a.headerButton .icon_arangodb_import {
+  top: -1px !important;
+}
+
+a.headerButton .icon_arangodb_arrowleft,
+a.headerButton .icon_arangodb_arrowright {
+  font-weight:bold;
+}
+
 /*
 #documentsToolbar span {
   position: absolute;
@@ -45,4 +74,10 @@ a.paginationButton, ul.arangoPagination a {
   margin-right: 3px;
   margin-left: 0px;
 }
+
+#documentsToolbar li a {
+  margin-top: 0px !important;
+  padding: 5px 11px 2px 9px;
+}
+
 */

js/apps/system/aardvark/frontend/css/documentsView.css

@@ -10,10 +10,6 @@
   height: 56px;
 }
 
-#documentsToolbar {
-  margin-bottom: 0 !important;
-}
-
 .marginRight5 {
   margin-right: 10px;
 }
@@ -176,16 +172,6 @@
 	border-width:0 0 0 0px;
 }
 
-#documentsToolbar li {
-  margin-right: 2px;
-}
-
-#documentsToolbar .pagination-mini ul > li:first-child > a,
-#documentsToolbar .pagination-small ul > li:first-child > a,
-#documentsToolbar .pagination-mini ul > li:first-child > span,
-#documentsToolbar .pagination-small ul > li:first-child > span {
-	margin-right: 5px;
-}
 /*
 .pagination-mini ul > li:first-child > a, .pagination-small ul > li:first-child > a, .pagination-mini ul > li:first-child > span, .pagination-small ul > li:first-child > span {
 	margin-right: 5px;
@@ -372,11 +358,6 @@
   margin-left: 11px;
 }
 
-#documentsToolbar ul {
-  margin-left: 0 !important;
-  padding-left: 0!important;
-}
-
 .queryline select, .queryline input {
   margin-bottom: 5px !important;
 }
@@ -399,25 +380,6 @@
   margin-left: 5px !important;
 }
 
-#documentsToolbar li a {
-  margin-top: 0px !important;
-  padding: 5px 11px 2px 9px;
-}
-
-
-/* better look of some icons */
-#documentsToolbar .icon_arangodb_filter {
-  top: 1px !important;
-}
-
-#documentsToolbar .icon_arangodb_import {
-  top: -1px !important;
-}
-
-#documentsToolbar .icon_arangodb_arrowleft,
-#documentsToolbar .icon_arangodb_arrowright {
-  font-weight:bold;
-}
 
 #indexHeaderContent > div {
   padding: 10px;

js/apps/system/aardvark/frontend/css/headerBar.css

@@ -26,8 +26,9 @@ div.headerBar a.arangoHeader,
 
 /* The buttons on the right side */
 
-div.headerBar > div.pagination {
+div.headerBar > div.headerButtonBar {
   margin: 4px 0px;
+  margin-bottom: 0 !important;
 }
 
 /* Breadcrumbs on the left side */

js/apps/system/aardvark/frontend/js/templates/documentsView.ejs

@@ -1,10 +1,10 @@
 <ul class="thumbnails2">
   <div id="transparentHeader" class="headerBar">
-    <div id="documentsToolbar" class="pagination pagination-small pull-right">
+    <div id="documentsToolbar" class="headerButtonBar pull-right">
 
 
     <!-- remove marker for docupdiv--!>
-    <ul>
+    <ul class="headerButtonList">
       <li class="enabled">
         <a id="indexCollection" class="headerButton">
           <span class="icon_arangodb_checklist" title="Index collection"></span>

js/apps/system/aardvark/frontend/js/templates/queryView.ejs

@@ -1,6 +1,6 @@
 <ul class="thumbnails2">
   <div id="transparentHeader" class="headerBar">
-    <div class="pagination pagination-small pagination-right toolbarUL">
+    <div class="pagination pagination-small pull-right toolbarUL">
       <ul>
         <li class="enabled" style="visibility:hidden">
           <a id="aqlToggle" class="headerButton">