diff --git a/client/galaxy/scripts/components/Citations.vue b/client/galaxy/scripts/components/Citations.vue
index 9cc455974210..baea518220b7 100644
--- a/client/galaxy/scripts/components/Citations.vue
+++ b/client/galaxy/scripts/components/Citations.vue
@@ -2,11 +2,11 @@
     <div class="toolForm">
         <div class="toolFormTitle">
             Citations
-            <button v-if="viewRender" v-on:click="toggleViewRender" type="button" class="btn btn-xs citations-to-bibtex" title="Show all in BibTeX format.">
+            <button v-if="viewRender" v-on:click="toggleViewRender" type="button" class="btn btn-sm citations-to-bibtex" title="Show all in BibTeX format.">
                 <i class="fa fa-pencil-square-o"></i>
                 Show BibTeX
             </button>
-            <button v-else type="button" v-on:click="toggleViewRender" class="btn btn-xs citations-to-formatted" title="Return to formatted citation list.">
+            <button v-else type="button" v-on:click="toggleViewRender" class="btn btn-sm citations-to-formatted" title="Return to formatted citation list.">
                 <i class="fa fa-times"></i>
                 Hide BibTeX
             </button>
diff --git a/client/galaxy/scripts/components/RuleCollectionBuilder.vue b/client/galaxy/scripts/components/RuleCollectionBuilder.vue
index 09dc0d45d5b9..8b1ffb8f5f9d 100644
--- a/client/galaxy/scripts/components/RuleCollectionBuilder.vue
+++ b/client/galaxy/scripts/components/RuleCollectionBuilder.vue
@@ -1,6 +1,6 @@
 <template>
     <state-div v-if="state == 'build'">
-        <!-- Different instructions if building up from individual datasets vs. 
+        <!-- Different instructions if building up from individual datasets vs.
              initial data import. -->
         <div class="header flex-row no-flex" v-if="ruleView == 'source'">
             The is an advanced setting, below is a raw JSON description of the rules to apply to the tabular data used. The alternative graphical editor is recommended for most usages.
@@ -182,7 +182,7 @@
                                  v-for="map in mapping"
                                  v-bind:index="map.index"
                                  v-bind:key="map.type">
-                                <column-selector 
+                                <column-selector
                                     :class="'rule-map-' + map.type.replace(/_/g, '-')"
                                     :label="mappingTargets()[map.type].label"
                                     :target.sync="map.columns"
@@ -205,7 +205,7 @@
                                     </li>
                                   </ul>
                                 </div>
-                               <button type="button" class="ui-button-default btn btn-default rule-mapping-ok" v-if="!hasActiveMappingEdit" @click="displayRuleType = null">Okay</button>
+                               <button type="button" class="ui-button-default btn btn-secondary rule-mapping-ok" v-if="!hasActiveMappingEdit" @click="displayRuleType = null">Okay</button>
                             </div>
                         </div>
                         <div class="rule-summary" v-if="displayRuleType == null">
@@ -276,8 +276,8 @@
                                         <rule-target-component :builder="this" rule-type="add_column_value" />
                                         <rule-target-component :builder="this" rule-type="add_column_substr" />
                                   </ul>
-                                </div> 
-                            </div>                               
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -325,7 +325,7 @@
             </label>
             <label class="rule-option pull-right" v-if="mappingAsDict.list_identifiers && !mappingAsDict.collection_name">
                 {{ l("Name") }}:
-                <input class="collection-name" style="width: 260px" 
+                <input class="collection-name" style="width: 260px"
                 :placeholder="namePlaceholder" v-model="collectionName" />
             </label>
             <option-buttons-div>
@@ -1112,7 +1112,7 @@ const ColumnSelector = {
             </label>
         </div>
         <div class="rule-column-selector" v-else>
-            {{ label }} 
+            {{ label }}
             <ol>
                 <li v-for="(targetEl, index) in target"
                     v-bind:index="index"
@@ -1360,7 +1360,7 @@ const RuleComponent = {
     <div v-if="ruleType == displayRuleType" class="rule-editor" :class="typeToClass">
         <slot></slot>
         <div class="buttons" style="margin: 5px; height: 25px;">
-           <button type="button" class="ui-button-default btn btn-default rule-editor-ok" @click="okay">Okay</button>
+           <button type="button" class="ui-button-default btn btn-secondary rule-editor-ok" @click="okay">Okay</button>
            <button type="button" class="ui-button-default btn rule-editor-cancel" @click="cancel">Cancel</button>
         </div>
     </div>`,
diff --git a/client/galaxy/scripts/mvc/grid/grid-template.js b/client/galaxy/scripts/mvc/grid/grid-template.js
index 8a494659ab5d..f61d7b18d685 100644
--- a/client/galaxy/scripts/mvc/grid/grid-template.js
+++ b/client/galaxy/scripts/mvc/grid/grid-template.js
@@ -1,5 +1,9 @@
 // dependencies
 import Utils from "utils/utils";
+import * as _ from "underscore";
+
+/* global $ */
+
 // grid view templates
 export default {
     // template
@@ -8,11 +12,22 @@ export default {
         if (options.embedded) {
             tmpl = this.grid_header(options) + this.grid_table(options);
         } else {
-            tmpl = `<div class="loading-elt-overlay"></div><table><tr><td width="75%">${this.grid_header(
-                options
-            )}</td><td></td><td></td></tr><tr><td width="100%" id="grid-message" valign="top"></td><td></td><td></td></tr></table>${this.grid_table(
-                options
-            )}`;
+            tmpl = `
+                <div class="loading-elt-overlay"></div>
+                <table>
+                    <tr>
+                        <td width="75%">${this.grid_header(options)}</td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    <tr>
+                        <td width="100%" id="grid-message" valign="top"></td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                </table>
+                ${this.grid_table(options)}
+            `;
         }
 
         // add info text
@@ -156,7 +171,7 @@ export default {
                     var target = column_settings.target;
 
                     // unescape value
-                    if (jQuery.type(value) === "string") {
+                    if ($.type(value) === "string") {
                         value = value.replace(/\/\//g, "/");
                     }
 
@@ -458,7 +473,7 @@ export default {
             var column_filter = filters[column_key];
             if (column_filter) {
                 // identify type
-                var type = jQuery.type(column_filter);
+                var type = $.type(column_filter);
 
                 // single filter value
                 if (type == "string") {
diff --git a/client/galaxy/scripts/mvc/library/library-dataset-view.js b/client/galaxy/scripts/mvc/library/library-dataset-view.js
index b96648d3f1e0..12f885a181bd 100644
--- a/client/galaxy/scripts/mvc/library/library-dataset-view.js
+++ b/client/galaxy/scripts/mvc/library/library-dataset-view.js
@@ -621,12 +621,12 @@ var LibraryDatasetView = Backbone.View.extend({
 
                 // BREADCRUMBS
                 '<ol class="breadcrumb">',
-                '<li><a title="Return to the list of libraries" href="#">Libraries</a></li>',
+                '<li class="breadcrumb-item"><a title="Return to the list of libraries" href="#">Libraries</a></li>',
                 '<% _.each(item.get("full_path"), function(path_item) { %>',
                 "<% if (path_item[0] != item.id) { %>",
-                '<li><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
+                '<li class="breadcrumb-item"><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
                 "<% } else { %>",
-                '<li class="active"><span title="You are here"><%- path_item[1] %></span></li>',
+                '<li class="breadcrumb-item active"><span title="You are here"><%- path_item[1] %></span></li>',
                 "<% } %>",
                 "<% }); %>",
                 "</ol>",
@@ -789,12 +789,12 @@ var LibraryDatasetView = Backbone.View.extend({
 
                 // BREADCRUMBS
                 '<ol class="breadcrumb">',
-                '<li><a title="Return to the list of libraries" href="#">Libraries</a></li>',
+                '<li class="breadcrumb-item"><a title="Return to the list of libraries" href="#">Libraries</a></li>',
                 '<% _.each(item.get("full_path"), function(path_item) { %>',
                 "<% if (path_item[0] != item.id) { %>",
-                '<li><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
+                '<li class="breadcrumb-item"><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
                 "<% } else { %>",
-                '<li class="active"><span title="You are here"><%- path_item[1] %></span></li>',
+                '<li class="breadcrumb-item active"><span title="You are here"><%- path_item[1] %></span></li>',
                 "<% } %>",
                 "<% }); %>",
                 "</ol>",
@@ -916,12 +916,12 @@ var LibraryDatasetView = Backbone.View.extend({
 
                 // BREADCRUMBS
                 '<ol class="breadcrumb">',
-                '<li><a title="Return to the list of libraries" href="#">Libraries</a></li>',
+                '<li class="breadcrumb-item"><a title="Return to the list of libraries" href="#">Libraries</a></li>',
                 '<% _.each(item.get("full_path"), function(path_item) { %>',
                 "<% if (path_item[0] != item.id) { %>",
-                '<li><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
+                '<li class="breadcrumb-item"><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
                 "<% } else { %>",
-                '<li class="active"><span title="You are here"><%- path_item[1] %></span></li>',
+                '<li class="breadcrumb-item active"><span title="You are here"><%- path_item[1] %></span></li>',
                 "<% } %>",
                 "<% }); %>",
                 "</ol>",
@@ -1022,12 +1022,12 @@ var LibraryDatasetView = Backbone.View.extend({
 
                 // BREADCRUMBS
                 '<ol class="breadcrumb">',
-                '<li><a title="Return to the list of libraries" href="#">Libraries</a></li>',
+                '<li class="breadcrumb-item"><a title="Return to the list of libraries" href="#">Libraries</a></li>',
                 '<% _.each(item.get("full_path"), function(path_item) { %>',
                 "<% if (path_item[0] != item.id) { %>",
-                '<li><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
+                '<li class="breadcrumb-item"><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
                 "<% } else { %>",
-                '<li class="active"><span title="You are here"><%- path_item[1] %></span></li>',
+                '<li class="breadcrumb-item active"><span title="You are here"><%- path_item[1] %></span></li>',
                 "<% } %>",
                 "<% }); %>",
                 "</ol>",
diff --git a/client/galaxy/scripts/mvc/library/library-folderlist-view.js b/client/galaxy/scripts/mvc/library/library-folderlist-view.js
index 5e0a0c9c0467..1e2360ea53bc 100644
--- a/client/galaxy/scripts/mvc/library/library-folderlist-view.js
+++ b/client/galaxy/scripts/mvc/library/library-folderlist-view.js
@@ -367,14 +367,13 @@ var FolderListView = Backbone.View.extend({
     templateFolder: function() {
         return _.template(
             [
-                // BREADCRUMBS
                 '<ol class="breadcrumb">',
-                '<li><a title="Return to the list of libraries" href="#">Libraries</a></li>',
+                '<li class="breadcrumb-item"><a title="Return to the list of libraries" href="#">Libraries</a></li>',
                 "<% _.each(path, function(path_item) { %>",
                 "<% if (path_item[0] != id) { %>",
-                '<li><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
+                '<li class="breadcrumb-item"><a title="Return to this folder" href="#/folders/<%- path_item[0] %>"><%- path_item[1] %></a> </li> ',
                 "<% } else { %>",
-                '<li class="active"><span title="You are in this folder"><%- path_item[1] %></span></li>',
+                '<li class="breadcrumb-item active"><span title="You are in this folder"><%- path_item[1] %></span></li>',
                 "<% } %>",
                 "<% }); %>",
                 "</ol>",
@@ -395,7 +394,7 @@ var FolderListView = Backbone.View.extend({
                 '<tbody id="folder_list_body">',
                 '<tr id="first_folder_item">',
                 "<td>",
-                '<a href="#<% if (upper_folder_id !== 0){ print("folders/" + upper_folder_id)} %>" title="Go to parent folder" class="btn_open_folder btn btn-secondary btn-xs">..<a>',
+                '<a href="#<% if (upper_folder_id !== 0){ print("folders/" + upper_folder_id)} %>" title="Go to parent folder" class="btn_open_folder btn btn-secondary btn-sm">..<a>',
                 "</td>",
                 "<td></td>",
                 "<td></td>",
diff --git a/client/galaxy/scripts/mvc/library/library-folderrow-view.js b/client/galaxy/scripts/mvc/library/library-folderrow-view.js
index 392f49660a3a..e7c1907ab969 100644
--- a/client/galaxy/scripts/mvc/library/library-folderrow-view.js
+++ b/client/galaxy/scripts/mvc/library/library-folderrow-view.js
@@ -256,18 +256,18 @@ var FolderRowView = Backbone.View.extend({
                 "<td></td>",
                 "<td>",
                 "<% if(edit_mode) { %>", // start edit mode
-                '<button data-toggle="tooltip" data-placement="top" title="Save changes" class="primary-button btn-xs save_folder_btn" type="button" style="<% if(button_config.save_folder_btn === false) { print("display:none;") } %>">',
+                '<button data-toggle="tooltip" data-placement="top" title="Save changes" class="primary-button btn-sm save_folder_btn" type="button" style="<% if(button_config.save_folder_btn === false) { print("display:none;") } %>">',
                 '<span class="fa fa-floppy-o"/> Save',
                 "</button>",
-                '<button data-toggle="tooltip" data-placement="top" title="Discard changes" class="primary-button btn-xs cancel_folder_btn" type="button" style="<% if(button_config.cancel_folder_btn === false) { print("display:none;") } %>">',
+                '<button data-toggle="tooltip" data-placement="top" title="Discard changes" class="primary-button btn-sm cancel_folder_btn" type="button" style="<% if(button_config.cancel_folder_btn === false) { print("display:none;") } %>">',
                 '<span class="fa fa-times"/> Cancel',
                 "</button>",
                 "<% } else if (!edit_mode){%>", // start no edit mode
-                '<button data-toggle="tooltip" data-placement="top" title="Modify \'<%- content_item.get("name") %>\'" class="primary-button btn-xs edit_folder_btn" type="button" style="<% if(button_config.edit_folder_btn === false) { print("display:none;") } %>">',
+                '<button data-toggle="tooltip" data-placement="top" title="Modify \'<%- content_item.get("name") %>\'" class="primary-button btn-sm edit_folder_btn" type="button" style="<% if(button_config.edit_folder_btn === false) { print("display:none;") } %>">',
                 '<span class="fa fa-pencil"/> Edit',
                 "</button>",
                 '<a href="#/folders/<%- content_item.id %>/permissions">',
-                '<button data-toggle="tooltip" data-placement="top" class="primary-button btn-xs permission_folder_btn" title="Permissions of \'<%- content_item.get("name") %>\'" style="<% if(button_config.permission_folder_btn === false) { print("display:none;") } %>">',
+                '<button data-toggle="tooltip" data-placement="top" class="primary-button btn-sm permission_folder_btn" title="Permissions of \'<%- content_item.get("name") %>\'" style="<% if(button_config.permission_folder_btn === false) { print("display:none;") } %>">',
                 '<span class="fa fa-group"/> Manage',
                 "</button>",
                 "</a>",
@@ -314,7 +314,7 @@ var FolderRowView = Backbone.View.extend({
                 "<% } %>",
                 '<% if (content_item.get("can_manage")) { %>',
                 '<a href="#folders/<%- content_item.get("folder_id") %>/datasets/<%- content_item.id %>/permissions">',
-                '<button data-toggle="tooltip" data-placement="top" class="primary-button btn-xs permissions-dataset-btn" title="Permissions of \'<%- content_item.get("name") %>\'">',
+                '<button data-toggle="tooltip" data-placement="top" class="primary-button btn-sm permissions-dataset-btn" title="Permissions of \'<%- content_item.get("name") %>\'">',
                 '<span class="fa fa-group"/> Manage',
                 "</button>",
                 "</a>",
@@ -355,7 +355,7 @@ var FolderRowView = Backbone.View.extend({
                 "</td>",
                 "<td>",
                 '<span data-toggle="tooltip" data-placement="top" title="Marked deleted" style="color:grey;" class="fa fa-ban fa-lg"/>',
-                '<button data-toggle="tooltip" data-placement="top" title="Undelete \'<%- content_item.get("name") %>\'" class="primary-button btn-xs undelete_dataset_btn" type="button" style="margin-left:1em;">',
+                '<button data-toggle="tooltip" data-placement="top" title="Undelete \'<%- content_item.get("name") %>\'" class="primary-button btn-sm undelete_dataset_btn" type="button" style="margin-left:1em;">',
                 '<span class="fa fa-unlock"/> Undelete',
                 "</button>",
                 "</td>",
@@ -388,7 +388,7 @@ var FolderRowView = Backbone.View.extend({
                 "<td></td>",
                 "<td>",
                 '<span data-toggle="tooltip" data-placement="top" title="Marked deleted" style="color:grey;" class="fa fa-ban fa-lg"/>',
-                '<button data-toggle="tooltip" data-placement="top" title="Undelete \'<%- content_item.get("name") %>\'" class="primary-button btn-xs undelete_folder_btn" type="button" style="margin-left:1em;">',
+                '<button data-toggle="tooltip" data-placement="top" title="Undelete \'<%- content_item.get("name") %>\'" class="primary-button btn-sm undelete_folder_btn" type="button" style="margin-left:1em;">',
                 '<span class="fa fa-unlock"/> Undelete',
                 "</button>",
                 "</td>",
diff --git a/client/galaxy/scripts/mvc/library/library-foldertoolbar-view.js b/client/galaxy/scripts/mvc/library/library-foldertoolbar-view.js
index e59302e669e3..8f02d42ffd9e 100644
--- a/client/galaxy/scripts/mvc/library/library-foldertoolbar-view.js
+++ b/client/galaxy/scripts/mvc/library/library-foldertoolbar-view.js
@@ -1371,29 +1371,23 @@ var FolderToolbarView = Backbone.View.extend({
     templateToolBar: function() {
         return _.template(
             [
-                // container start
-                '<div class="library_style_container">',
-                // toolbar start
-                '<div id="library_toolbar">',
-                '<form class="form-inline" role="form">',
-                "<span><strong>DATA LIBRARIES</strong></span>",
-                // paginator will append here
-                '<span class="library-paginator folder-paginator"></span>',
-                // include deleted checkbox
-                '<div class="checkbox toolbar-item logged-dataset-manipulation" style="height: 20px; display:none;">',
-                "<label>",
-                '<input type="checkbox" class="include-deleted-datasets-chk">include deleted</input>',
-                "</label>",
-                "</div>",
-                // create new folder button
-                '<button style="display:none;" data-toggle="tooltip" data-placement="top" title="Create New Folder" class="btn btn-secondary primary-button toolbtn-create-folder add-library-items add-library-items-folder toolbar-item" type="button">',
-                '<span class="fa fa-plus"></span><span class="fa fa-folder"></span> Create Folder ',
-                "</button>",
-                // add datasets button
-                "<% if(mutiple_add_dataset_options) { %>",
-                '<div class="btn-group add-library-items add-library-items-datasets toolbar-item" style="display:none;">',
+                '<div class="library_style_container">', // container start
+                '<div class="d-flex align-items-center mb-2">',
+                '<span class="mr-1">DATA LIBRARIES</span>',
+                '<div class="d-flex align-items-center folder-paginator" />', // paginator will append here
+                '<div id="library_toolbar">', // toolbar start
+                '<form class="form-inline">',
+                    '<div class="form-check logged-dataset-manipulation mr-1" style="display:none;">', // include deleted checkbox
+                        '<input class="form-check-input include-deleted-datasets-chk" id="include_deleted_datasets_chk" type="checkbox">',
+                        '<label class="form-check-label" for="include_deleted_datasets_chk">include deleted</label>',
+                    '</div>',
+                    '<button style="display:none;" data-toggle="tooltip" data-placement="top" title="Create New Folder" class="btn btn-secondary primary-button toolbtn-create-folder add-library-items add-library-items-folder mr-1" type="button">',
+                        '<span class="fa fa-plus"></span> <span class="fa fa-folder"></span> Create Folder ',
+                    '</button>',
+                '<% if(mutiple_add_dataset_options) { %>', // add datasets button
+                '<div class="btn-group add-library-items add-library-items-datasets mr-1" style="display:none;">',
                 '<button title="Add Datasets to Current Folder" id="" type="button" class="primary-button dropdown-toggle" data-toggle="dropdown">',
-                '<span class="fa fa-plus"></span><span class="fa fa-file"></span> Add Datasets <span class="caret"></span>',
+                '<span class="fa fa-plus"></span> <span class="fa fa-file"></span> Add Datasets <span class="caret"></span>',
                 "</button>",
                 '<ul class="dropdown-menu" role="menu">',
                 '<li><a href="#folders/<%= id %>/import/history"> from History</a></li>',
@@ -1418,7 +1412,7 @@ var FolderToolbarView = Backbone.View.extend({
                 "</a>",
                 "<% } %>",
                 // import to history button
-                '<div class="btn-group toolbar-item">',
+                '<div class="btn-group mr-1">',
                 '<button title="Import to history" type="button" class="primary-button dropdown-toggle add-to-history" data-toggle="dropdown">',
                 '<span class="fa fa-book"></span> To History <span class="caret"></span>',
                 "</button>",
@@ -1428,7 +1422,7 @@ var FolderToolbarView = Backbone.View.extend({
                 "</ul>",
                 "</div>",
                 // download button
-                '<div class="btn-group dataset-manipulation toolbar-item" style="display:none; ">',
+                '<div class="btn-group dataset-manipulation mr-1" style="display:none; ">',
                 '<button title="Download items as archive" type="button" class="primary-button dropdown-toggle" data-toggle="dropdown">',
                 '<span class="fa fa-save"></span> Download <span class="caret"></span>',
                 "</button>",
@@ -1439,11 +1433,16 @@ var FolderToolbarView = Backbone.View.extend({
                 "</ul>",
                 "</div>",
                 // delete button
-                '<button data-toggle="tooltip" data-placement="top" title="Mark items deleted" class="primary-button toolbtn-bulk-delete logged-dataset-manipulation toolbar-item" style="display:none;" type="button">',
+                '<button data-toggle="tooltip" data-placement="top" title="Mark items deleted" class="primary-button toolbtn-bulk-delete logged-dataset-manipulation mr-1" style="display:none;" type="button">',
                 '<span class="fa fa-trash"></span> Delete',
                 "</button>",
-                // help button
-                '<span class="right-float" data-toggle="tooltip" data-placement="top" title="See this screen annotated">',
+                '<span class="mr-1" data-toggle="tooltip" data-placement="top" title="Show location details">', // location button
+                '<button data-id="<%- id %>" class="primary-button toolbtn-show-locinfo" type="button">',
+                '<span class="fa fa-info-circle"></span>',
+                '&nbsp;Details',
+                '</button>',
+                '</span>',
+                '<span class="" data-toggle="tooltip" data-placement="top" title="See this screen annotated">', // help button
                 '<a href="https://galaxyproject.org/data-libraries/screen/folder-contents/" target="_blank">',
                 '<button class="primary-button" type="button">',
                 '<span class="fa fa-question-circle"></span>',
@@ -1451,22 +1450,12 @@ var FolderToolbarView = Backbone.View.extend({
                 "</button>",
                 "</a>",
                 "</span>",
-                // location button
-                '<span class="right-float" data-toggle="tooltip" data-placement="top" title="Show location details">',
-                '<button data-id="<%- id %>" class="primary-button toolbtn-show-locinfo toolbar-item" type="button">',
-                '<span class="fa fa-info-circle"></span>',
-                "&nbsp;Details",
-                "</button>",
-                "</span>",
-                // toolbar end
-                "</div>",
                 "</form>",
-                // folder contents will append here
-                '<div id="folder_items_element" />',
-                // paginator will append here
-                '<div class="folder-paginator paginator-bottom" />',
-                // container end
-                "</div>"
+                "</div>", // toolbar end
+                '</div>', // end flex
+                '<div id="folder_items_element" />', // folder contents will append here
+                '<div class="d-flex justify-content-center align-items-center folder-paginator mt-2 mb-2" />', // paginator will append here
+                "</div>" // container end
             ].join("")
         );
     },
@@ -1789,7 +1778,7 @@ var FolderToolbarView = Backbone.View.extend({
     templatePaginator: function() {
         return _.template(
             [
-                '<ul class="pagination pagination-sm">',
+                '<ul class="pagination mr-1">',
                 "<% if ( ( show_page - 1 ) > 0 ) { %>",
                 "<% if ( ( show_page - 1 ) > page_count ) { %>", // we are on higher page than total page count
                 '<li class="page-item"><a class="page-link" href="#folders/<%= id %>/page/1"><span class="fa fa-angle-double-left"></span></a></li>',
@@ -1813,10 +1802,10 @@ var FolderToolbarView = Backbone.View.extend({
                 '<li class="page-item disabled"><a class="page-link" href="#folders/<%= id %>/page/<% print( page_count ) %>"><span class="fa fa-angle-double-right"></span></a></li>',
                 "<% } %>",
                 "</ul>",
-                "<span>",
+                '<span class="mr-1">',
                 ' <%- items_shown %> items shown <a href="" data-toggle="tooltip" data-placement="top" title="currently <%- folder_page_size %> per page" class="page-size-prompt">(change)</a>',
                 "</span>",
-                "<span>",
+                '<span class="mr-1">',
                 " <%- total_items_count %> total",
                 "</span>"
             ].join("")
diff --git a/client/galaxy/scripts/mvc/library/library-libraryrow-view.js b/client/galaxy/scripts/mvc/library/library-libraryrow-view.js
index 99413dc730ff..3db13cc6bd89 100644
--- a/client/galaxy/scripts/mvc/library/library-libraryrow-view.js
+++ b/client/galaxy/scripts/mvc/library/library-libraryrow-view.js
@@ -258,14 +258,14 @@ var LibraryRowView = Backbone.View.extend({
                 '<% if( (library.get("public")) && (library.get("deleted") === false) ) { %>',
                 '<span data-toggle="tooltip" data-placement="top" title="Unrestricted library" style="color:grey;" class="fa fa-globe fa-lg"> </span>',
                 "<% }%>",
-                '<button data-toggle="tooltip" data-placement="top" title="Modify \'<%- library.get("name") %>\'" class="primary-button btn-xs edit_library_btn" type="button" style="<% if(button_config.edit_library_btn === false) { print("display:none;") } %>"><span class="fa fa-pencil"></span> Edit</button>',
-                '<a href="#library/<%- library.get("id") %>/permissions"><button data-toggle="tooltip" data-placement="top" title="Permissions of \'<%- library.get("name") %>\'" class="primary-button btn-xs permission_library_btn" type="button" style="<% if(button_config.permission_library_btn === false) { print("display:none;") } %>"><span class="fa fa-group"></span> Manage</button></a>',
-                '<button data-toggle="tooltip" data-placement="top" title="Save changes" class="primary-button btn-xs save_library_btn" type="button" style="<% if(button_config.save_library_btn === false) { print("display:none;") } %>"><span class="fa fa-floppy-o"></span> Save</button>',
-                '<button data-toggle="tooltip" data-placement="top" title="Discard changes" class="primary-button btn-xs cancel_library_btn" type="button" style="<% if(button_config.cancel_library_btn === false) { print("display:none;") } %>"><span class="fa fa-times"></span> Cancel</button>',
-                '<button data-toggle="tooltip" data-placement="top" title="Delete \'<%- library.get("name") %>\'" class="primary-button btn-xs delete_library_btn" type="button" style="<% if(button_config.delete_library_btn === false) { print("display:none;") } %>"><span class="fa fa-trash-o"></span> Delete</button>',
+                '<button data-toggle="tooltip" data-placement="top" title="Modify \'<%- library.get("name") %>\'" class="primary-button btn-sm edit_library_btn" type="button" style="<% if(button_config.edit_library_btn === false) { print("display:none;") } %>"><span class="fa fa-pencil"></span> Edit</button>',
+                '<a href="#library/<%- library.get("id") %>/permissions"><button data-toggle="tooltip" data-placement="top" title="Permissions of \'<%- library.get("name") %>\'" class="primary-button btn-sm permission_library_btn" type="button" style="<% if(button_config.permission_library_btn === false) { print("display:none;") } %>"><span class="fa fa-group"></span> Manage</button></a>',
+                '<button data-toggle="tooltip" data-placement="top" title="Save changes" class="primary-button btn-sm save_library_btn" type="button" style="<% if(button_config.save_library_btn === false) { print("display:none;") } %>"><span class="fa fa-floppy-o"></span> Save</button>',
+                '<button data-toggle="tooltip" data-placement="top" title="Discard changes" class="primary-button btn-sm cancel_library_btn" type="button" style="<% if(button_config.cancel_library_btn === false) { print("display:none;") } %>"><span class="fa fa-times"></span> Cancel</button>',
+                '<button data-toggle="tooltip" data-placement="top" title="Delete \'<%- library.get("name") %>\'" class="primary-button btn-sm delete_library_btn" type="button" style="<% if(button_config.delete_library_btn === false) { print("display:none;") } %>"><span class="fa fa-trash-o"></span> Delete</button>',
                 // For deleted libraries
                 '<span data-toggle="tooltip" data-placement="top" title="Marked deleted" style="color:grey; <% if(button_config.undelete_library_btn === false) { print("display:none;") } %>" class="fa fa-ban fa-lg"></span>',
-                '<button data-toggle="tooltip" data-placement="top" title="Undelete \'<%- library.get("name") %>\' " class="primary-button btn-xs undelete_library_btn" type="button" style="<% if(button_config.undelete_library_btn === false) { print("display:none;") } %>"><span class="fa fa-unlock"></span> Undelete</button>',
+                '<button data-toggle="tooltip" data-placement="top" title="Undelete \'<%- library.get("name") %>\' " class="primary-button btn-sm undelete_library_btn" type="button" style="<% if(button_config.undelete_library_btn === false) { print("display:none;") } %>"><span class="fa fa-unlock"></span> Undelete</button>',
                 "</td>",
                 "</tr>"
             ].join("")
diff --git a/client/galaxy/scripts/mvc/library/library-librarytoolbar-view.js b/client/galaxy/scripts/mvc/library/library-librarytoolbar-view.js
index fd36967904f3..737eae5a64be 100644
--- a/client/galaxy/scripts/mvc/library/library-librarytoolbar-view.js
+++ b/client/galaxy/scripts/mvc/library/library-librarytoolbar-view.js
@@ -48,7 +48,7 @@ var LibraryToolbarView = Backbone.View.extend({
     renderPaginator: function(options) {
         this.options = _.extend(this.options, options);
         var paginator_template = this.templatePaginator();
-        this.$el.find("#library_paginator").html(
+        this.$el.find(".library-paginator").html(
             paginator_template({
                 show_page: parseInt(this.options.show_page),
                 page_count: parseInt(this.options.page_count),
@@ -196,46 +196,33 @@ var LibraryToolbarView = Backbone.View.extend({
         return _.template(
             [
                 '<div class="library_style_container">',
-                '<div id="toolbar_form">',
-                '<div id="library_toolbar">',
-                '<form class="form-inline" role="form">',
-                '<span><strong><a href="#" title="Go to first page">DATA LIBRARIES</a></strong></span>',
-                '<span id="library_paginator" class="library-paginator">',
-                // paginator will append here
-                "</span>",
-                '<div class="form-group toolbar-item">',
-                '<input type="text" class="form-control library-search-input" placeholder="Search" size="30">',
-                "</div>",
-                // only admins see the following
-                "<% if(admin_user === true) { %>",
-                '<div class="checkbox toolbar-item" style="height: 20px;">',
-                "<label>",
-                '<input id="include_deleted_chk" type="checkbox">',
-                "include deleted ",
-                "</input>",
-                "</label>",
-                "<label>",
-                '<input id="exclude_restricted_chk" type="checkbox">',
-                "exclude restricted",
-                "</input>",
-                "</label>",
-                "</div>",
-                '<span class="toolbar-item" data-toggle="tooltip" data-placement="top" title="Create New Library">',
-                '<button id="create_new_library_btn" class="primary-button btn-xs" type="button"><span class="fa fa-plus"></span> New Library</button>',
-                "</span>",
-                "<% } %>",
-                '<span class="help-button" data-toggle="tooltip" data-placement="top" title="See this screen annotated">',
-                '<a href="https://galaxyproject.org/data-libraries/screen/list-of-libraries/" target="_blank">',
-                '<button class="primary-button" type="button"><span class="fa fa-question-circle"></span> Help</button>',
-                "</a>",
-                "</span>",
-                "</form>",
-                "</div>",
-                "</div>",
-                '<div id="libraries_element">',
-                // table with libraries will append here
-                "</div>",
-                "</div>"
+                    '<div class="d-flex align-items-center mb-2">',
+                        '<a class="mr-1" href="#" data-toggle="tooltip" data-placement="top" title="Go to first page">DATA LIBRARIES</a>',
+                        '<div class="d-flex align-items-center library-paginator mr-1" />', // paginator will append here
+                        '<form class="form-inline mr-1">',
+                            '<input type="text" class="form-control library-search-input mr-1" placeholder="Great Library" size="15">',
+                                "<% if(admin_user === true) { %>", // only admins
+                                    '<div class="form-check mr-1">',
+                                        '<input class="form-check-input" id="include_deleted_chk" type="checkbox">',
+                                        '<label class="form-check-label" for="include_deleted_chk">include deleted</label>',
+                                    '</div>',
+                                    '<div class="form-check mr-1">',
+                                        '<input class="form-check-input" id="exclude_restricted_chk" type="checkbox">',
+                                        '<label class="form-check-label" for="exclude_restricted_chk">exclude restricted</label>',
+                                    '</div>',
+                                    '<span data-toggle="tooltip" data-placement="top" title="Create New Library">',
+                                        '<button id="create_new_library_btn" class="primary-button btn-sm" type="button"><span class="fa fa-plus"></span> New Library</button>',
+                                    "</span>",
+                                "<% } %>", // end admins
+                        "</form>",
+                        '<span class="help-button" data-toggle="tooltip" data-placement="top" title="See this screen annotated">',
+                            '<a href="https://galaxyproject.org/data-libraries/screen/list-of-libraries/" target="_blank">',
+                            '<button class="primary-button" type="button"><span class="fa fa-question-circle"></span> Help</button>',
+                            "</a>",
+                        "</span>",
+                    "</div>", // end flex
+                '<div id="libraries_element" />', // table with libraries will append here
+                '</div>' // end library_style_container
             ].join("")
         );
     },
@@ -243,7 +230,7 @@ var LibraryToolbarView = Backbone.View.extend({
     templatePaginator: function() {
         return _.template(
             [
-                '<ul class="pagination pagination-sm">',
+                '<ul class="pagination mr-1">',
                 "<% if ( ( show_page - 1 ) > 0 ) { %>",
                 "<% if ( ( show_page - 1 ) > page_count ) { %>", // we are on higher page than total page count
                 '<li class="page-item"><a class="page-link" href="#page/1"><span class="fa fa-angle-double-left"></span></a></li>',
@@ -267,10 +254,10 @@ var LibraryToolbarView = Backbone.View.extend({
                 '<li class="page-item disabled"><a class="page-link" href="#page/<% print( page_count ) %>"><span class="fa fa-angle-double-right"></span></a></li>',
                 "<% } %>",
                 "</ul>",
-                "<span>",
+                '<span class="mr-1">',
                 ' <%- libraries_shown %> libraries shown <a href="" data-toggle="tooltip" data-placement="top" title="currently <%- library_page_size %> per page" class="page_size_prompt">(change)</a>',
                 "</span>",
-                "<span>",
+                '<span class="mr-1">',
                 " <%- total_libraries_count %> total",
                 "</span>"
             ].join("")
diff --git a/client/galaxy/scripts/mvc/ui/ui-buttons.js b/client/galaxy/scripts/mvc/ui/ui-buttons.js
index e9a15402deaa..fe775940e1da 100644
--- a/client/galaxy/scripts/mvc/ui/ui-buttons.js
+++ b/client/galaxy/scripts/mvc/ui/ui-buttons.js
@@ -267,7 +267,6 @@ var ButtonMenu = ButtonDefault.extend({
         this.setElement(
             $("<div/>").append(
                 (this.$root = $("<div/>")
-                    .append((this.$icon = $("<i/>")))
                     .append((this.$title = $("<span/>"))))
             )
         );
@@ -296,15 +295,10 @@ var ButtonMenu = ButtonDefault.extend({
                 e.preventDefault();
                 options.onclick && options.onclick();
             });
-        this.$icon
-            .removeClass()
-            .addClass("icon fa")
-            .addClass(options.icon);
         this.$title
             .removeClass()
             .addClass("title")
             .html(options.title);
-        options.icon && options.title && this.$icon.addClass("ui-margin-right");
         this.$menu && this.$menu.remove();
         if (this.collection.length > 0) {
             this.$menu = $("<ul/>")
diff --git a/client/galaxy/style/scss/base.scss b/client/galaxy/style/scss/base.scss
index a6439b5af428..05a565fdc49d 100644
--- a/client/galaxy/style/scss/base.scss
+++ b/client/galaxy/style/scss/base.scss
@@ -723,6 +723,7 @@ textarea {
         // -webkit-box-sizing: border-box;
         max-width: 90%;
     }
+    display: block;
 }
 
 textarea,
diff --git a/client/galaxy/style/scss/library.scss b/client/galaxy/style/scss/library.scss
index decc5fe7ab5f..e8c0e613790e 100644
--- a/client/galaxy/style/scss/library.scss
+++ b/client/galaxy/style/scss/library.scss
@@ -104,30 +104,12 @@
     .roles-selection {
         width: 66%;
     }
-    #library_toolbar {
-        margin-bottom: 0.5em;
-        span {
-            margin-right: 0.2em;
-        }
-        .toolbar-item {
-            margin-left: 0.5em;
-        }
-    }
     #libraries_element,
     #folder_items_element {
         button {
             margin-left: 0.5em;
         }
     }
-    .right-float {
-        float: right;
-    }
-    .pagination-sm {
-        height: 15px;
-    }
-    .library-paginator {
-        margin-left: 2em;
-    }
     .import-type-switch {
         text-decoration: underline;
     }
@@ -135,13 +117,6 @@
     .libimport-select-all {
         margin-left: 0.5em;
     }
-    .paginator-bottom {
-        width: 27em;
-        margin-left: auto;
-        margin-right: auto;
-        margin-top: 2em;
-        margin-bottom: 2em;
-    }
 }
 
 // Extra style for Galaxy modal
diff --git a/static/style/blue/base.css b/static/style/blue/base.css
index f1d292e7a8b8..531f33dd8ff0 100644
--- a/static/style/blue/base.css
+++ b/static/style/blue/base.css
@@ -10871,32 +10871,14 @@ label {
     width: 100%; }
   .library_style_container .roles-selection {
     width: 66%; }
-  .library_style_container #library_toolbar {
-    margin-bottom: 0.5em; }
-    .library_style_container #library_toolbar span {
-      margin-right: 0.2em; }
-    .library_style_container #library_toolbar .toolbar-item {
-      margin-left: 0.5em; }
   .library_style_container #libraries_element button,
   .library_style_container #folder_items_element button {
     margin-left: 0.5em; }
-  .library_style_container .right-float {
-    float: right; }
-  .library_style_container .pagination-sm {
-    height: 15px; }
-  .library_style_container .library-paginator {
-    margin-left: 2em; }
   .library_style_container .import-type-switch {
     text-decoration: underline; }
   .library_style_container .libimport-select-none,
   .library_style_container .libimport-select-all {
     margin-left: 0.5em; }
-  .library_style_container .paginator-bottom {
-    width: 27em;
-    margin-left: auto;
-    margin-right: auto;
-    margin-top: 2em;
-    margin-bottom: 2em; }
 
 .modal-content .library_selected_history_content ul {
   list-style-type: none; }
@@ -12691,12 +12673,14 @@ input,
 textarea {
   font: inherit; }
 
-.form-row select,
-.form-row textarea,
-.form-row input[type="text"],
-.form-row input[type="file"],
-.form-row input[type="password"] {
-  max-width: 90%; }
+.form-row {
+  display: block; }
+  .form-row select,
+  .form-row textarea,
+  .form-row input[type="text"],
+  .form-row input[type="file"],
+  .form-row input[type="password"] {
+    max-width: 90%; }
 
 textarea,
 input[type="text"],
diff --git a/static/style/blue/library.css b/static/style/blue/library.css
index 560d42a5980a..a284fd5f708e 100644
--- a/static/style/blue/library.css
+++ b/static/style/blue/library.css
@@ -75,32 +75,14 @@ label {
     width: 100%; }
   .library_style_container .roles-selection {
     width: 66%; }
-  .library_style_container #library_toolbar {
-    margin-bottom: 0.5em; }
-    .library_style_container #library_toolbar span {
-      margin-right: 0.2em; }
-    .library_style_container #library_toolbar .toolbar-item {
-      margin-left: 0.5em; }
   .library_style_container #libraries_element button,
   .library_style_container #folder_items_element button {
     margin-left: 0.5em; }
-  .library_style_container .right-float {
-    float: right; }
-  .library_style_container .pagination-sm {
-    height: 15px; }
-  .library_style_container .library-paginator {
-    margin-left: 2em; }
   .library_style_container .import-type-switch {
     text-decoration: underline; }
   .library_style_container .libimport-select-none,
   .library_style_container .libimport-select-all {
     margin-left: 0.5em; }
-  .library_style_container .paginator-bottom {
-    width: 27em;
-    margin-left: auto;
-    margin-right: auto;
-    margin-top: 2em;
-    margin-bottom: 2em; }
 
 .modal-content .library_selected_history_content ul {
   list-style-type: none; }
diff --git a/static/welcome.html.sample b/static/welcome.html.sample
index 821bc836a45f..bb7865ad3b00 100644
--- a/static/welcome.html.sample
+++ b/static/welcome.html.sample
@@ -16,9 +16,9 @@
             <br>
             <div class="container">
                 <p>Take an interactive tour:
-                    <a target="_parent" href="../tours/core.galaxy_ui" class="btn btn-default btn-xs">Galaxy UI</a>
-                    <a target="_parent" href="../tours/core.history" class="btn btn-default btn-xs">History</a>
-                    <a target="_parent" href="../tours/core.scratchbook" class="btn btn-default btn-xs">Scratchbook</a>
+                    <a target="_parent" href="../tours/core.galaxy_ui" class="btn btn-secondary btn-sm">Galaxy UI</a>
+                    <a target="_parent" href="../tours/core.history" class="btn btn-secondary btn-sm">History</a>
+                    <a target="_parent" href="../tours/core.scratchbook" class="btn btn-secondary btn-sm">Scratchbook</a>
                 </p>
             </div>
         </div>
diff --git a/templates/user/login.mako b/templates/user/login.mako
index 352593d578d8..027099392c0a 100644
--- a/templates/user/login.mako
+++ b/templates/user/login.mako
@@ -80,12 +80,12 @@ def inherit(context):
         <div class="toolFormTitle">Login</div>
         <form name="login" id="login" action="${form_action}" method="post" >
             <input type="hidden" name="session_csrf_token" value="${trans.session_csrf_token}" />
-            <div class="form-row flex-column">
+            <div class="form-row">
                 <label>Username / Email Address:</label>
                 <input type="text" name="login" value="${login or ''| h}" size="40"/>
                 <input type="hidden" name="redirect" value="${redirect | h}" size="40"/>
             </div>
-            <div class="form-row flex-column">
+            <div class="form-row">
                 <label>Password:</label>
                 <input type="password" name="password" value="" size="40"/>
                 <div class="toolParamHelp" style="clear: both;">
diff --git a/templates/webapps/tool_shed/repository/manage_repository.mako b/templates/webapps/tool_shed/repository/manage_repository.mako
index 6ace7cb0bd91..ac07e57bd087 100644
--- a/templates/webapps/tool_shed/repository/manage_repository.mako
+++ b/templates/webapps/tool_shed/repository/manage_repository.mako
@@ -200,13 +200,13 @@ ${render_tool_shed_repository_actions( repository, metadata=metadata, changeset_
             <div class="form-row">
                 <b>${sharable_link_label}</b>
                 <a href="${ repository.share_url }" target="_blank">${ repository.share_url }</a>
-                <button title="to clipboard" class="btn btn-secondary btn-xs" id="share_clipboard"><span class="fa fa-clipboard"></span></button>
+                <button title="to clipboard" class="btn btn-secondary btn-sm" id="share_clipboard"><span class="fa fa-clipboard"></span></button>
             </div>
             %if can_download or can_push:
                 <div class="form-row">
                     <b>Clone this repository:</b>
                     <code>hg clone <a title="Show in mercurial browser" href="${ repository.clone_url }">${ repository.clone_url }</a></code>
-                    <button title="to clipboard" class="btn btn-secondary btn-xs" id="clone_clipboard"><span class="fa fa-clipboard"></span></button>
+                    <button title="to clipboard" class="btn btn-secondary btn-sm" id="clone_clipboard"><span class="fa fa-clipboard"></span></button>
                 </div>
             %endif
             ${render_repository_type_select_field( repository_type_select_field, render_help=True )}
diff --git a/templates/webapps/tool_shed/repository/view_repository.mako b/templates/webapps/tool_shed/repository/view_repository.mako
index bd2c1212a092..0f2f7fbb3b4f 100644
--- a/templates/webapps/tool_shed/repository/view_repository.mako
+++ b/templates/webapps/tool_shed/repository/view_repository.mako
@@ -137,13 +137,13 @@
         <div class="form-row">
             <b>${sharable_link_label}</b>
             <a href="${ repository.share_url }" target="_blank">${ repository.share_url }</a>
-            <button title="to clipboard" class="btn btn-secondary btn-xs" id="share_clipboard"><span class="fa fa-clipboard"></span></button>
+            <button title="to clipboard" class="btn btn-secondary btn-sm" id="share_clipboard"><span class="fa fa-clipboard"></span></button>
         </div>
         %if can_download or can_push:
             <div class="form-row">
                 <b>Clone this repository:</b>
                 <code>hg clone <a title="Show in mercurial browser" href="${ repository.clone_url }">${ repository.clone_url }</a></code>
-                <button title="to clipboard" class="btn btn-secondary btn-xs" id="clone_clipboard"><span class="fa fa-clipboard"></span></button>
+                <button title="to clipboard" class="btn btn-secondary btn-sm" id="clone_clipboard"><span class="fa fa-clipboard"></span></button>
             </div>
         %endif
         <div class="form-row">
diff --git a/test/galaxy_selenium/has_driver.py b/test/galaxy_selenium/has_driver.py
index ffba975258ee..447ff3fd83d9 100644
--- a/test/galaxy_selenium/has_driver.py
+++ b/test/galaxy_selenium/has_driver.py
@@ -157,12 +157,14 @@ def click(self, selector_template):
         element = self.driver.find_element(*selector_template.element_locator)
         element.click()
 
+    def _timeout_message(self, on_str):
+        return "Timeout waiting on %s." % on_str
+
     def _wait_on(self, condition, on_str=None, **kwds):
         if on_str is None:
             on_str = str(condition)
-        message = "Timeout waiting on %s." % on_str
         wait = self.wait(**kwds)
-        return wait.until(condition, message)
+        return wait.until(condition, self._timeout_message(on_str))
 
     def action_chains(self):
         return ActionChains(self.driver)
diff --git a/test/galaxy_selenium/navigates_galaxy.py b/test/galaxy_selenium/navigates_galaxy.py
index 084b9eb2019d..b97fc5c7a4c1 100644
--- a/test/galaxy_selenium/navigates_galaxy.py
+++ b/test/galaxy_selenium/navigates_galaxy.py
@@ -938,7 +938,7 @@ def workflow_index_rename(self, new_name, workflow_index=0):
     def workflow_index_name(self, workflow_index=0):
         """Get workflow name for workflow_index'th row."""
         row_element = self.workflow_index_table_row(workflow_index=workflow_index)
-        workflow_button = row_element.find_element_by_css_selector(".menubutton")
+        workflow_button = row_element.find_element_by_css_selector(".dropdown-toggle")
         return workflow_button.text
 
     def workflow_index_click_option(self, option_title, workflow_index=0):
@@ -951,7 +951,7 @@ def click_option():
 
         click_option()
 
-        menu_element = self.wait_for_selector_visible(".dropdown.show")
+        menu_element = self.wait_for_selector_visible(".dropdown-menu.show")
         menu_options = menu_element.find_elements_by_css_selector("a.dropdown-item")
         found_option = False
         for menu_option in menu_options:
@@ -972,7 +972,7 @@ def workflow_index_click_tag_display(self, workflow_index=0):
     def workflow_index_tags(self, workflow_index=0):
         workflow_row_element = self.workflow_index_table_row(workflow_index)
         tag_display = workflow_row_element.find_element_by_css_selector(".tags-display")
-        tag_spans = tag_display.find_elements_by_css_selector("span.label")
+        tag_spans = tag_display.find_elements_by_css_selector("span.badge-tags")
         tags = []
         for tag_span in tag_spans:
             tags.append(tag_span.text)
@@ -1244,12 +1244,20 @@ def run_tour(self, path, skip_steps=[], sleep_on_steps={}, tour_callback=None):
 
     def tour_wait_for_clickable_element(self, selector):
         wait = self.wait()
-        element = wait.until(sizzle.sizzle_selector_clickable(selector))
+        timeout_message = self._timeout_message("sizzle (jQuery) selector [%s] to become clickable" % selector)
+        element = wait.until(
+            sizzle.sizzle_selector_clickable(selector),
+            timeout_message,
+        )
         return element
 
     def tour_wait_for_element_present(self, selector):
         wait = self.wait()
-        element = wait.until(sizzle.sizzle_presence_of_selector(selector))
+        timeout_message = self._timeout_message("sizzle (jQuery) selector [%s] to become present" % selector)
+        element = wait.until(
+            sizzle.sizzle_presence_of_selector(selector),
+            timeout_message,
+        )
         return element
 
     def get_tooltip_text(self, element, sleep=0, click_away=True):
diff --git a/test/galaxy_selenium/navigation.yml b/test/galaxy_selenium/navigation.yml
index 3bce574a8622..94aee8678134 100644
--- a/test/galaxy_selenium/navigation.yml
+++ b/test/galaxy_selenium/navigation.yml
@@ -93,7 +93,7 @@ history_panel:
       download_button: '${_} .icon-btn.download-btn'
       info_button: '${_} .icon-btn.params-btn'
       rerun_button: '${_} .icon-btn.rerun-btn'
-      nametags: '${_} .nametags .label'
+      nametags: '${_} .nametags .badge-tags'
 
   multi_operations:
     selectors:
diff --git a/test/selenium_tests/framework.py b/test/selenium_tests/framework.py
index 40e23c6fdb31..96366a6af5b8 100644
--- a/test/selenium_tests/framework.py
+++ b/test/selenium_tests/framework.py
@@ -290,7 +290,8 @@ def setup_driver_and_session(self):
         self.driver = get_driver()
         # New workflow index page does not degrade well to smaller sizes, needed
         # to increase this.
-        self.driver.set_window_size(1280, 900)
+        # Needed to up the height for paired list creator being taller in BS4 branch.
+        self.driver.set_window_size(1280, 1000)
 
         self._setup_galaxy_logging()