Improve object tools and toolbar arrangement

jet/static/jet/css/_changelist.scss

@@ -88,7 +88,6 @@
 /* TOOLBAR */
 
 #toolbar {
-  float: left;
   margin-bottom: 20px;
   display: none;
 
@@ -106,13 +105,12 @@
     }
 
     #searchbar {
-      margin-bottom: 2px;
+      margin-bottom: 5px;
       margin-right: 2px;
       vertical-align: top;
 
       @include for-mobile {
         margin-right: 5px;
-        margin-bottom: 5px;
       }
 
       @include for-phone {
@@ -129,6 +127,7 @@
         padding: 0 20px;
         text-transform: uppercase;
         vertical-align: middle;
+        margin-bottom: 5px;
       }
 
       &:hover, &:focus {
@@ -147,12 +146,12 @@
 .changelist-filter-select {
   &-wrapper {
     margin-right: 2px;
-    margin-bottom: 2px;
+    margin-bottom: 5px;
     display: inline-block;
+    vertical-align: top;
 
     @include for-mobile {
       margin-right: 5px;
-      margin-bottom: 5px;
     }
 
     .select2-container--jet {

jet/static/jet/css/_object-tools.scss

@@ -28,6 +28,8 @@
     display: inline-block;
     margin-left: 5px;
     margin-bottom: 5px;
+    list-style-type: none;
+    vertical-align: top;
 
     @include for-mobile {
       margin-left: 0;
@@ -35,6 +37,18 @@
     }
   }
 
+  body.change-list & {
+    float: right;
+
+    @include for-mobile {
+      float: none;
+    }
+
+    li {
+      display: list-item;
+    }
+  }
+
   a.addlink {
     &:before {
       @include font-icon;

jet/static/jet/js/src/layout-updaters/toolbar.js

@@ -5,20 +5,6 @@ var ToolbarUpdater = function($changelist) {
 };
 
 ToolbarUpdater.prototype = {
-    getToolbar: function($changelist) {
-        var $toolbar = $changelist.find('#toolbar');
-
-        if ($toolbar.length == 0) {
-            $toolbar = $('<div>').attr('id', 'toolbar');
-            $('#content-main').prepend($toolbar);
-        }
-
-        return $toolbar;
-    },
-    moveToolbar: function($toolbar) {
-        $toolbar.remove();
-        $('#content-main').prepend($toolbar);
-    },
     updateToolbar: function($toolbar) {
         var placeholder = $toolbar.find('input[type="submit"]').val();
         $toolbar.find('#searchbar').attr('placeholder', placeholder);
@@ -78,7 +64,7 @@ ToolbarUpdater.prototype = {
         $('#content-main').each(function() {
             var $content = $(this);
 
-            $.each(['.object-tools', '#toolbar', 'changeform-navigation'], function(i, selector) {
+            $.each(['#toolbar', '.object-tools', 'changeform-navigation'], function(i, selector) {
                 var $element = $content.find(selector).first();
 
                 if ($element.length == 0) {
@@ -94,10 +80,9 @@ ToolbarUpdater.prototype = {
         });
     },
     run: function() {
-        var $toolbar = this.getToolbar(this.$changelist);
+        var $toolbar = this.$changelist.find('#toolbar');
 
         try {
-            this.moveToolbar($toolbar);
             this.updateToolbar($toolbar);
             this.moveFilters(this.$changelist, $toolbar);
         } catch (e) {