From 7488c14cf867fecc07fbd6daaab5e19350cb207c Mon Sep 17 00:00:00 2001
From: benweet <benoit.schweblin@gmail.com>
Date: Sun, 18 Aug 2013 01:02:23 +0100
Subject: [PATCH] Upgrade to Bootstrap 3

---
 css/jgrowl.css                                |   4 +-
 js/core.js                                    |  27 ++---
 js/extensions/documentPanel.js                |   2 +-
 js/extensions/documentSelector.js             | 106 ++++++++----------
 js/extensions/notifications.js                |   2 +-
 js/fileMgr.js                                 |   7 +-
 js/html/bodyIndex.html                        |   2 +-
 js/libs/bootstrap/bootstrap.js                |  14 ++-
 js/libs/bootstrap/less/buttons.less           |   3 +-
 js/libs/bootstrap/less/dropdowns.less         |   7 +-
 js/libs/bootstrap/less/grid.less              |  10 +-
 js/libs/bootstrap/less/mixins.less            |  58 ++++------
 js/libs/bootstrap/less/navbar.less            |  28 ++---
 js/libs/bootstrap/less/navs.less              |  21 ++--
 js/libs/bootstrap/less/pager.less             |   2 +-
 js/libs/bootstrap/less/panels.less            |   5 +-
 .../bootstrap/less/responsive-utilities.less  |  49 ++++----
 js/libs/bootstrap/less/tables.less            |   9 ++
 js/libs/bootstrap/less/variables.less         |  29 +++--
 js/styles/default.less                        |  12 +-
 20 files changed, 197 insertions(+), 200 deletions(-)

diff --git a/css/jgrowl.css b/css/jgrowl.css
index f4502435..380aff79 100644
--- a/css/jgrowl.css
+++ b/css/jgrowl.css
@@ -1,6 +1,6 @@
 
 div.jGrowl {
-	z-index: 			1050;
+	z-index: 			1040;
 	color: 				#fff;
 }
 
@@ -48,7 +48,7 @@ div.center div.jGrowl-notification, div.center div.jGrowl-closer {
 div.jGrowl div.jGrowl-notification, div.jGrowl div.jGrowl-closer {
 	background-color: 		#777;
 	zoom: 					1;
-	width: 					280px;
+	width: 					260px;
 	padding: 				15px 20px;
 	margin-top: 			5px;
 	margin-bottom: 			5px;
diff --git a/js/core.js b/js/core.js
index 6866d755..2d5e8a85 100644
--- a/js/core.js
+++ b/js/core.js
@@ -195,6 +195,7 @@ define([
             slidable: false,
             livePaneResizing: true,
             enableCursorHotkey: false,
+            resizerDblClickToggle: false,
             north__spacing_open: 6,
             north__spacing_closed: 6,
             spacing_open: 35,
@@ -266,6 +267,7 @@ define([
     var editor = undefined;
     var fileDesc = undefined;
     var documentContent = undefined;
+    var $editorElt = undefined;
     core.initEditor = function(fileDescParam) {
         if(fileDesc !== undefined) {
             eventMgr.onFileClosed(fileDesc);
@@ -273,8 +275,7 @@ define([
         fileDesc = fileDescParam;
         documentContent = undefined;
         var initDocumentContent = fileDesc.content;
-        var editorElt = $("#wmd-input");
-        editorElt.val(initDocumentContent);
+        $editorElt.val(initDocumentContent);
         if(editor !== undefined) {
             // If the editor is already created
             editor.undoManager.reinit(initDocumentContent, fileDesc.editorStart, fileDesc.editorEnd, fileDesc.editorScrollTop);
@@ -285,13 +286,13 @@ define([
         var previewContainerElt = $(".preview-container");
 
         // Store editor scrollTop on scroll event
-        editorElt.scroll(function() {
+        $editorElt.scroll(function() {
             if(documentContent !== undefined) {
                 fileDesc.editorScrollTop = $(this).scrollTop();
             }
         });
         // Store editor selection on change
-        editorElt.bind("keyup mouseup", function() {
+        $editorElt.bind("keyup mouseup", function() {
             if(documentContent !== undefined) {
                 fileDesc.editorStart = this.selectionStart;
                 fileDesc.editorEnd = this.selectionEnd;
@@ -347,7 +348,7 @@ define([
         });
 
         function checkDocumentChanges() {
-            var newDocumentContent = editorElt.val();
+            var newDocumentContent = $editorElt.val();
             if(documentContent !== undefined && documentContent != newDocumentContent) {
                 fileDesc.content = newDocumentContent;
                 eventMgr.onContentChanged(fileDesc);
@@ -361,7 +362,7 @@ define([
                 return function() {
                     if(documentContent === undefined) {
                         makePreview();
-                        editorElt.scrollTop(fileDesc.editorScrollTop);
+                        $editorElt.scrollTop(fileDesc.editorScrollTop);
                         previewContainerElt.scrollTop(fileDesc.previewScrollTop);
                     }
                     else {
@@ -416,7 +417,7 @@ define([
     var uiLocked = false;
     core.lockUI = function(param) {
         uiLocked = param;
-        $("#wmd-input").prop("disabled", uiLocked);
+        $editorElt.prop("disabled", uiLocked);
         $(".navbar-inner .btn").toggleClass("blocked", uiLocked);
         if(uiLocked) {
             $(".lock-ui").removeClass("hide");
@@ -430,7 +431,6 @@ define([
     var isDocumentPanelShown = false;
     var isMenuPanelShown = false;
     core.onReady = function() {
-
         if(viewerMode === true) {
             $('body').html(bodyViewerHTML);
         }
@@ -509,6 +509,7 @@ define([
 
         // UI layout
         createLayout();
+        $editorElt = $("#wmd-input");
 
         // Editor's textarea
         $("#wmd-input, #md-section-helper").css({
@@ -519,15 +520,11 @@ define([
         });
 
         // Handle tab key
-        $("#wmd-input").keydown(function(e) {
+        $editorElt.keydown(function(e) {
             if(e.keyCode === 9) {
-                var value = $(this).val();
+                var value = $editorElt.val();
                 var start = this.selectionStart;
                 var end = this.selectionEnd;
-                // IE8 does not support selection attributes
-                if(start === undefined || end === undefined) {
-                    return;
-                }
                 $(this).val(value.substring(0, start) + "\t" + value.substring(end));
                 this.selectionStart = this.selectionEnd = start + 1;
                 e.preventDefault();
@@ -570,7 +567,7 @@ define([
         }).on('hidden.bs.modal', function() {
             // Focus on the editor when modal is gone
             isModalShown = false;
-            $("#wmd-input").focus();
+            $editorElt.focus();
         }).keyup(function(e) {
             // Handle enter key in modals
             if(e.which == 13 && !$(e.target).is("textarea")) {
diff --git a/js/extensions/documentPanel.js b/js/extensions/documentPanel.js
index c3b65968..fa9c9c71 100644
--- a/js/extensions/documentPanel.js
+++ b/js/extensions/documentPanel.js
@@ -173,7 +173,7 @@ define([
                 filterFiles('');
                 
                 // Scroll to the active file
-                panelContentElt.scrollTop += documentListElt.querySelector('.file.active').getBoundingClientRect().top - 100;
+                panelContentElt.scrollTop += documentListElt.querySelector('.file.active').getBoundingClientRect().top - 120;
             }
         });
         
diff --git a/js/extensions/documentSelector.js b/js/extensions/documentSelector.js
index 490835be..de11cfe8 100644
--- a/js/extensions/documentSelector.js
+++ b/js/extensions/documentSelector.js
@@ -1,12 +1,13 @@
 define([
     "jquery",
     "underscore",
+    "crel",
     "utils",
     "classes/Extension",
     "mousetrap",
     "fileSystem",
     "text!html/documentSelectorSettingsBlock.html",
-], function($, _, utils, Extension, mousetrap, fileSystem, documentSelectorSettingsBlockHTML) {
+], function($, _, crel, utils, Extension, mousetrap, fileSystem, documentSelectorSettingsBlockHTML) {
 
     var documentSelector = new Extension("documentSelector", 'Document Selector');
     documentSelector.settingsBlock = documentSelectorSettingsBlockHTML;
@@ -33,33 +34,45 @@ define([
         fileMgr = fileMgrParameter;
     };
 
+    var liEltTmpl = [
+        '<li class="<%= isCurrent ? "disabled" : "" %>" data-file-index="<%= fileDesc.fileIndex %>">',
+        '   <a href="#">',
+        '       <%= fileDesc.composeTitle() %>',
+        '   </a>',
+        '</li>'
+    ].join('');
+    var $editorElt = undefined;
     var dropdownElt = undefined;
-    var liMap = undefined;
-    var liArray = undefined;
+    var liEltMap = undefined;
+    var liEltList = undefined;
     var sortFunction = undefined;
     var selectFileDesc = undefined;
     var buildSelector = function() {
+        var liListHtml = _.chain(fileSystem).sortBy(sortFunction).reduce(function(result, fileDesc) {
+            return result + _.template(liEltTmpl, {
+                fileDesc: fileDesc,
+                isCurrent: fileDesc === selectFileDesc
+            });
+        }, '').value();
+        dropdownElt.innerHTML = liListHtml;
 
-        liMap = {};
-        dropdownElt.empty();
-        _.chain(fileSystem).sortBy(sortFunction).each(function(fileDesc) {
-            var aElt = $('<a href="#">').html(fileDesc.composeTitle());
-            aElt.click(function() {
-                if(!liMap[fileDesc.fileIndex].is(".disabled")) {
+        liEltList = [];
+        liEltMap = {};
+        _.each(dropdownElt.querySelectorAll('li'), function(liElt) {
+            var $liElt = $(liElt);
+            liEltList.push($liElt);
+            var fileDesc = fileSystem[$liElt.data('fileIndex')];
+            liEltMap[fileDesc.fileIndex] = $liElt;
+            $liElt.find("a").click(function() {
+                if(!$liElt.hasClass("disabled")) {
                     fileMgr.selectFile(fileDesc);
                 }
                 else {
-                    $("#wmd-input").focus();
+                    $editorElt.focus();
                 }
             });
-            var liElt = $("<li>").append(aElt);
-            liMap[fileDesc.fileIndex] = liElt;
-            if(fileDesc === selectFileDesc) {
-                liElt.addClass("disabled");
-            }
-            dropdownElt.append(liElt);
         });
-        liArray = _.values(liMap);
+
     };
 
     documentSelector.onFileSelected = function(fileDesc) {
@@ -93,6 +106,8 @@ define([
     }
 
     documentSelector.onReady = function() {
+        $editorElt = $("#wmd-input");
+
         if(documentSelector.config.orderBy == "title") {
             sortFunction = function(fileDesc) {
                 return fileDesc.title.toLowerCase();
@@ -103,41 +118,16 @@ define([
                 return -fileDesc.selectTime;
             };
         }
-        
-        dropdownElt = $('<ul class="dropdown-menu dropdown-file-selector">');
-        $('<div>').append('<div data-toggle="dropdown">').append(dropdownElt).appendTo('.ui-layout-resizer-north');
-        dropdownElt.dropdown();
+
+        dropdownElt = crel('ul', {
+            class: 'dropdown-menu dropdown-file-selector'
+        });
+        document.querySelector('.ui-layout-resizer-north').appendChild(crel('div', crel('div', {
+            'data-toggle': 'dropdown'
+        }), dropdownElt));
+        var $dropdownElt = $(dropdownElt).dropdown();
 
         var shortcutLi = undefined;
-        /*
-        $(".action-open-file").click(function() {
-            if($(".file-selector").parent().is(".open")) {
-                return;
-            }
-            filterFileSelector();
-            if(shortcutLi !== undefined) {
-                return;
-            }
-            _.defer(function() {
-                $("#file-search").val("").focus();
-            });
-        }).prop("title", _.template("<%= title %>  <%= shortcutPrevious %>  <%= shortcutNext %>", {
-            title: $(".action-open-file").prop("title"),
-            shortcutPrevious: documentSelector.config.shortcutPrevious,
-            shortcutNext: documentSelector.config.shortcutNext
-        }));
-        $("#file-search").keyup(function(e) {
-            if(e.which == 13 || e.which == 27) {
-                $(this).parent().click();
-            }
-            else {
-                filterFileSelector($(this).val());
-            }
-        }).click(function(event) {
-            event.stopPropagation();
-        });
-        */
-        
         var documentPanelTogglerElt = $('.document-panel .collapse-button');
         documentPanelTogglerElt.prop("title", _.template("<%= title %>  <%= shortcutPrevious %>  <%= shortcutNext %>", {
             title: documentPanelTogglerElt.prop("title"),
@@ -149,14 +139,14 @@ define([
         var shortcutPrevious = documentSelector.config.shortcutPrevious.toLowerCase();
         mousetrap.bind(shortcutPrevious, function() {
             if(shortcutLi === undefined) {
-                dropdownElt.dropdown('toggle');
-                shortcutLi = liMap[selectFileDesc.fileIndex];
+                $dropdownElt.dropdown('toggle');
+                shortcutLi = liEltMap[selectFileDesc.fileIndex];
             }
-            var liIndex = _.indexOf(liArray, shortcutLi) - 1;
+            var liIndex = _.indexOf(liEltList, shortcutLi) - 1;
             if(liIndex === -2) {
                 liIndex = -1;
             }
-            shortcutLi = liArray[(liIndex + liArray.length) % liArray.length];
+            shortcutLi = liEltList[(liIndex + liEltList.length) % liEltList.length];
             _.defer(function() {
                 shortcutLi.find("a").focus();
             });
@@ -165,11 +155,11 @@ define([
         var shortcutNext = documentSelector.config.shortcutNext.toLowerCase();
         mousetrap.bind(documentSelector.config.shortcutNext.toLowerCase(), function() {
             if(shortcutLi === undefined) {
-                dropdownElt.dropdown('toggle');
-                shortcutLi = liMap[selectFileDesc.fileIndex];
+                $dropdownElt.dropdown('toggle');
+                shortcutLi = liEltMap[selectFileDesc.fileIndex];
             }
-            var liIndex = _.indexOf(liArray, shortcutLi) + 1;
-            shortcutLi = liArray[liIndex % liArray.length];
+            var liIndex = _.indexOf(liEltList, shortcutLi) + 1;
+            shortcutLi = liEltList[liIndex % liEltList.length];
             _.defer(function() {
                 shortcutLi.find("a").focus();
             });
diff --git a/js/extensions/notifications.js b/js/extensions/notifications.js
index 08a17508..635d051c 100644
--- a/js/extensions/notifications.js
+++ b/js/extensions/notifications.js
@@ -67,7 +67,7 @@ define([
 
     notifications.onOfflineChanged = function(isOffline) {
         if(isOffline === true) {
-            showMessage("You are offline.", "icon-exclamation-sign msg-offline", {
+            showMessage("You are offline.", "icon-attention-circled msg-offline", {
                 sticky: true,
                 close: function() {
                     showMessage("You are back online!", "icon-signal");
diff --git a/js/fileMgr.js b/js/fileMgr.js
index b43fd88b..c428f49f 100644
--- a/js/fileMgr.js
+++ b/js/fileMgr.js
@@ -156,6 +156,7 @@ define([
     };
 
     eventMgr.addListener("onReady", function() {
+        var $editorElt = $("#wmd-input");
 
         fileMgr.selectFile();
 
@@ -164,7 +165,7 @@ define([
         $(".action-create-file").click(function() {
             var fileDesc = fileMgr.createFile();
             fileMgr.selectFile(fileDesc);
-            var wmdInput = $("#wmd-input").focus().get(0);
+            var wmdInput = $editorElt.focus().get(0);
             if(wmdInput.setSelectionRange) {
                 wmdInput.setSelectionRange(0, 0);
             }
@@ -193,7 +194,7 @@ define([
                 eventMgr.onTitleChanged(fileDesc);
             }
             fileTitleInputElt.val(fileDesc.title);
-            $("#wmd-input").focus();
+            $editorElt.focus();
         }
         fileTitleInputElt.blur(function() {
             applyTitle();
@@ -210,7 +211,7 @@ define([
             window.location.href = ".";
         });
         $(".action-edit-document").click(function() {
-            var content = $("#wmd-input").val();
+            var content = $editorElt.val();
             var title = fileMgr.currentFile.title;
             var fileDesc = fileMgr.createFile(title, content);
             fileMgr.selectFile(fileDesc);
diff --git a/js/html/bodyIndex.html b/js/html/bodyIndex.html
index 99845f5d..96dcba7d 100644
--- a/js/html/bodyIndex.html
+++ b/js/html/bodyIndex.html
@@ -389,7 +389,7 @@
 				<p id="dropzone-import-harddrive-html" class="drop-zone">Drop
 					files here</p>
 				<p>Or insert your HTML code here:</p>
-				<textarea id="input-convert-html"></textarea>
+				<textarea id="input-convert-html" class="form-control"></textarea>
 			</div>
 			<div class="modal-footer">
 				<a href="#" class="btn btn-default" data-dismiss="modal">Close</a> <a
diff --git a/js/libs/bootstrap/bootstrap.js b/js/libs/bootstrap/bootstrap.js
index 1a034581..107ca31b 100644
--- a/js/libs/bootstrap/bootstrap.js
+++ b/js/libs/bootstrap/bootstrap.js
@@ -711,7 +711,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
     clearMenus()
 
     if (!isActive) {
-      if ('ontouchstart' in document.documentElement) {
+      if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) {
         // if mobile we we use a backdrop because click events don't delegate
         $('<div class="dropdown-backdrop"/>').insertAfter($(this)).on('click', clearMenus)
       }
@@ -723,9 +723,9 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
       $parent
         .toggleClass('open')
         .trigger('shown.bs.dropdown')
-    }
 
-    $this.focus()
+      $this.focus()
+    }
 
     return false
   }
@@ -851,7 +851,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
 
   var Modal = function (element, options) {
     this.options   = options
-    this.$element  = $(element).on('click.dismiss.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
+    this.$element  = $(element)
     this.$backdrop =
     this.isShown   = null
 
@@ -880,6 +880,8 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
 
     this.escape()
 
+    this.$element.on('click.dismiss.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
+
     this.backdrop(function () {
       var transition = $.support.transition && that.$element.hasClass('fade')
 
@@ -902,7 +904,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
       var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
 
       transition ?
-        that.$element
+        that.$element.find('.modal-dialog') // wait for modal to slide in
           .one($.support.transition.end, function () {
             that.$element.focus().trigger(e)
           })
@@ -1064,7 +1066,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
   })
 
   $(document)
-    .on('shown.bs.modal',  '.modal', function () { $(document.body).addClass('modal-open') })
+    .on('show.bs.modal',  '.modal', function () { $(document.body).addClass('modal-open') })
     .on('hidden.bs.modal', '.modal', function () { $(document.body).removeClass('modal-open') })
 
 }(window.jQuery);
diff --git a/js/libs/bootstrap/less/buttons.less b/js/libs/bootstrap/less/buttons.less
index 7b8692ce..5d60d39a 100644
--- a/js/libs/bootstrap/less/buttons.less
+++ b/js/libs/bootstrap/less/buttons.less
@@ -35,6 +35,7 @@
   &:active,
   &.active {
     outline: 0;
+    background-image: none;
     .box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
   }
 
@@ -130,7 +131,7 @@
   .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
 }
 .btn-xs {
-  padding: 3px 5px;
+  padding: 1px 5px;
 }
 
 
diff --git a/js/libs/bootstrap/less/dropdowns.less b/js/libs/bootstrap/less/dropdowns.less
index d9417358..53aab026 100644
--- a/js/libs/bootstrap/less/dropdowns.less
+++ b/js/libs/bootstrap/less/dropdowns.less
@@ -13,6 +13,9 @@
   border-top:   @caret-width-base solid @dropdown-caret-color;
   border-right: @caret-width-base solid transparent;
   border-left:  @caret-width-base solid transparent;
+  // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once fixed,
+  // we can just straight up remove this.
+  border-bottom: 0 dotted;
   content: "";
 }
 
@@ -161,7 +164,9 @@
 .navbar-fixed-bottom .dropdown {
   // Reverse the caret
   .caret {
-    border-top: 0;
+    // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once this
+    // gets fixed, restore `border-top: 0;`.
+    border-top: 0 dotted;
     border-bottom: 4px solid @dropdown-caret-color;
     content: "";
   }
diff --git a/js/libs/bootstrap/less/grid.less b/js/libs/bootstrap/less/grid.less
index c51aab9c..c77f455f 100644
--- a/js/libs/bootstrap/less/grid.less
+++ b/js/libs/bootstrap/less/grid.less
@@ -223,6 +223,7 @@
   .col-md-12 { width: 100%; }
 
   // Push and pull columns for source order changes
+  .col-md-push-0  { left: auto; }
   .col-md-push-1  { left: percentage((1 / @grid-columns)); }
   .col-md-push-2  { left: percentage((2 / @grid-columns)); }
   .col-md-push-3  { left: percentage((3 / @grid-columns)); }
@@ -235,6 +236,7 @@
   .col-md-push-10 { left: percentage((10/ @grid-columns)); }
   .col-md-push-11 { left: percentage((11/ @grid-columns)); }
 
+  .col-md-pull-0  { right: auto; }
   .col-md-pull-1  { right: percentage((1 / @grid-columns)); }
   .col-md-pull-2  { right: percentage((2 / @grid-columns)); }
   .col-md-pull-3  { right: percentage((3 / @grid-columns)); }
@@ -248,6 +250,7 @@
   .col-md-pull-11 { right: percentage((11/ @grid-columns)); }
 
   // Offsets
+  .col-md-offset-0  { margin-left: 0; }
   .col-md-offset-1  { margin-left: percentage((1 / @grid-columns)); }
   .col-md-offset-2  { margin-left: percentage((2 / @grid-columns)); }
   .col-md-offset-3  { margin-left: percentage((3 / @grid-columns)); }
@@ -269,9 +272,9 @@
 // Note that `.col-lg-12` doesn't get floated on purpose—there's no need since
 // it's full-width.
 
-@media (min-width: @screen-large-desktop) {
+@media (min-width: @screen-lg-desktop) {
   .container {
-    max-width: @container-large-desktop;
+    max-width: @container-lg-desktop;
   }
 
   .col-lg-1,
@@ -301,6 +304,7 @@
   .col-lg-12 { width: 100%; }
 
   // Push and pull columns for source order changes
+  .col-lg-push-0  { left: auto; }
   .col-lg-push-1  { left: percentage((1 / @grid-columns)); }
   .col-lg-push-2  { left: percentage((2 / @grid-columns)); }
   .col-lg-push-3  { left: percentage((3 / @grid-columns)); }
@@ -313,6 +317,7 @@
   .col-lg-push-10 { left: percentage((10/ @grid-columns)); }
   .col-lg-push-11 { left: percentage((11/ @grid-columns)); }
 
+  .col-lg-pull-0  { right: auto; }
   .col-lg-pull-1  { right: percentage((1 / @grid-columns)); }
   .col-lg-pull-2  { right: percentage((2 / @grid-columns)); }
   .col-lg-pull-3  { right: percentage((3 / @grid-columns)); }
@@ -326,6 +331,7 @@
   .col-lg-pull-11 { right: percentage((11/ @grid-columns)); }
 
   // Offsets
+  .col-lg-offset-0  { margin-left: 0; }
   .col-lg-offset-1  { margin-left: percentage((1 / @grid-columns)); }
   .col-lg-offset-2  { margin-left: percentage((2 / @grid-columns)); }
   .col-lg-offset-3  { margin-left: percentage((3 / @grid-columns)); }
diff --git a/js/libs/bootstrap/less/mixins.less b/js/libs/bootstrap/less/mixins.less
index 65d8a0f7..c4d1de5f 100644
--- a/js/libs/bootstrap/less/mixins.less
+++ b/js/libs/bootstrap/less/mixins.less
@@ -412,12 +412,17 @@
   &:hover,
   &:focus,
   &:active,
-  &.active {
+  &.active,
+  .open .dropdown-toggle& {
     color: @color;
     background-color: darken(@background, 8%);
         border-color: darken(@border, 12%);
   }
-
+  &:active,
+  &.active,
+  .open .dropdown-toggle& {
+    background-image: none;
+  }
   &.disabled,
   &[disabled],
   fieldset[disabled] & {
@@ -519,43 +524,28 @@
 .container-fixed() {
   margin-right: auto;
   margin-left: auto;
+  padding-left:  (@grid-gutter-width / 2);
+  padding-right: (@grid-gutter-width / 2);
   .clearfix();
 }
 
 // Creates a wrapper for a series of columns
 .make-row(@gutter: @grid-gutter-width) {
-  // Then clear the floated columns
+  margin-left:  (@gutter / -2);
+  margin-right: (@gutter / -2);
   .clearfix();
-
-  .container & {
-    @media (min-width: @screen-small) {
-      margin-left:  (@gutter / -2);
-      margin-right: (@gutter / -2);
-    }
-  }
-
-  // Negative margin nested rows out to align the content of columns
-  .row {
-    margin-left:  (@gutter / -2);
-    margin-right: (@gutter / -2);
-  }
 }
 
 // Generate the extra small columns
 .make-xs-column(@columns; @gutter: @grid-gutter-width) {
   position: relative;
   float: left;
+  width: percentage((@columns / @grid-columns));
   // Prevent columns from collapsing when empty
   min-height: 1px;
   // Inner gutter via padding
   padding-left:  (@gutter / 2);
   padding-right: (@gutter / 2);
-  @max-width: (@screen-small - 1);
-
-  // Calculate width based on number of columns available
-  @media (max-width: @max-width) {
-    width: percentage((@columns / @grid-columns));
-  }
 }
 
 // Generate the small columns
@@ -568,7 +558,7 @@
   padding-right: (@gutter / 2);
 
   // Calculate width based on number of columns available
-  @media (min-width: @screen-small) {
+  @media (min-width: @screen-sm) {
     float: left;
     width: percentage((@columns / @grid-columns));
   }
@@ -576,17 +566,17 @@
 
 // Generate the small column offsets
 .make-sm-column-offset(@columns) {
-  @media (min-width: @screen-small) {
+  @media (min-width: @screen-sm) {
     margin-left: percentage((@columns / @grid-columns));
   }
 }
 .make-sm-column-push(@columns) {
-  @media (min-width: @screen-small) {
+  @media (min-width: @screen-sm) {
     left: percentage((@columns / @grid-columns));
   }
 }
 .make-sm-column-pull(@columns) {
-  @media (min-width: @screen-small) {
+  @media (min-width: @screen-sm) {
     right: percentage((@columns / @grid-columns));
   }
 }
@@ -601,7 +591,7 @@
   padding-right: (@gutter / 2);
 
   // Calculate width based on number of columns available
-  @media (min-width: @screen-medium) {
+  @media (min-width: @screen-md) {
     float: left;
     width: percentage((@columns / @grid-columns));
   }
@@ -609,17 +599,17 @@
 
 // Generate the large column offsets
 .make-md-column-offset(@columns) {
-  @media (min-width: @screen-medium) {
+  @media (min-width: @screen-md) {
     margin-left: percentage((@columns / @grid-columns));
   }
 }
 .make-md-column-push(@columns) {
-  @media (min-width: @screen-medium) {
+  @media (min-width: @screen-md) {
     left: percentage((@columns / @grid-columns));
   }
 }
 .make-md-column-pull(@columns) {
-  @media (min-width: @screen-medium) {
+  @media (min-width: @screen-md) {
     right: percentage((@columns / @grid-columns));
   }
 }
@@ -634,7 +624,7 @@
   padding-right: (@gutter / 2);
 
   // Calculate width based on number of columns available
-  @media (min-width: @screen-large) {
+  @media (min-width: @screen-lg) {
     float: left;
     width: percentage((@columns / @grid-columns));
   }
@@ -642,17 +632,17 @@
 
 // Generate the large column offsets
 .make-lg-column-offset(@columns) {
-  @media (min-width: @screen-large) {
+  @media (min-width: @screen-lg) {
     margin-left: percentage((@columns / @grid-columns));
   }
 }
 .make-lg-column-push(@columns) {
-  @media (min-width: @screen-large) {
+  @media (min-width: @screen-lg) {
     left: percentage((@columns / @grid-columns));
   }
 }
 .make-lg-column-pull(@columns) {
-  @media (min-width: @screen-large) {
+  @media (min-width: @screen-lg) {
     right: percentage((@columns / @grid-columns));
   }
 }
diff --git a/js/libs/bootstrap/less/navbar.less b/js/libs/bootstrap/less/navbar.less
index dc11007e..110e8a35 100644
--- a/js/libs/bootstrap/less/navbar.less
+++ b/js/libs/bootstrap/less/navbar.less
@@ -51,20 +51,19 @@
 // content for the user's viewport.
 
 .navbar-collapse {
+  max-height: 340px;
+  overflow-x: visible;
   padding-right: @navbar-padding-horizontal;
   padding-left:  @navbar-padding-horizontal;
   border-top: 1px solid darken(@navbar-bg, 7%);
   box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
-  // Clear floated elements and prevent collapsing of padding
   .clearfix();
-
-  // This is not automatically added to the `.navbar-fixed-top` because it causes
-  // z-index bugs in iOS7 (possibly earlier).
-  max-height: 340px;
-  overflow-x: visible;
-  overflow-y: auto;
   -webkit-overflow-scrolling: touch;
 
+  &.in {
+    overflow-y: auto;
+  }
+
   @media (min-width: @grid-float-breakpoint) {
     width: auto;
     padding-right: 0;
@@ -94,8 +93,8 @@
 
 // Static top (unfixed, but 100% wide) navbar
 .navbar-static-top {
+  border-width: 0 0 1px;
   @media (min-width: @grid-float-breakpoint) {
-    border-width: 0 0 1px;
     border-radius: 0;
   }
 }
@@ -187,10 +186,7 @@
 // the nav the full height of the horizontal nav (above 768px).
 
 .navbar-nav {
-  padding-top:    (@navbar-padding-vertical / 2);
-  padding-bottom: (@navbar-padding-vertical / 2);
-  margin-left: -@navbar-padding-horizontal;
-  margin-right: -@navbar-padding-horizontal;
+  margin: (@navbar-padding-vertical / 2) -@navbar-padding-horizontal;
 
   > li > a {
     padding-top:    10px;
@@ -220,7 +216,7 @@
     }
   }
 
-  @media (max-width: @screen-phone-max) {
+  @media (max-width: @screen-xs-max) {
     // Dropdowns get custom display when collapsed
     .open .dropdown-menu {
       position: static;
@@ -267,8 +263,6 @@
   @media (min-width: @grid-float-breakpoint) {
     float: left;
     margin: 0;
-    padding-top: 0;
-    padding-bottom: 0;
 
     > li {
       float: left;
@@ -317,7 +311,7 @@
   .form-inline();
 
   .form-group {
-    @media (max-width: @screen-phone-max) {
+    @media (max-width: @screen-xs-max) {
       margin-bottom: 5px;
     }
   }
@@ -518,7 +512,7 @@
       }
     }
 
-    @media (max-width: @screen-phone-max) {
+    @media (max-width: @screen-xs-max) {
       // Dropdowns get custom display
       .open .dropdown-menu {
         > .dropdown-header {
diff --git a/js/libs/bootstrap/less/navs.less b/js/libs/bootstrap/less/navs.less
index e4b3243d..6002a8cd 100644
--- a/js/libs/bootstrap/less/navs.less
+++ b/js/libs/bootstrap/less/navs.less
@@ -42,17 +42,12 @@
   }
 
   // Open dropdowns
-  &.open > a {
+  .open > a {
     &,
     &:hover,
     &:focus {
-      color: @nav-open-link-hover-color;
-      background-color: @link-color;
+      background-color: @nav-link-hover-bg;
       border-color: @link-color;
-      .caret {
-        border-top-color: @nav-open-caret-border-color;
-        border-bottom-color: @nav-open-caret-border-color;
-      }
     }
   }
 
@@ -159,14 +154,20 @@
 
 .nav-justified {
   width: 100%;
+
   > li {
     float: none;
-    display: table-cell;
-    width: 1%;
-    > a {
+     > a {
       text-align: center;
     }
   }
+
+  @media (min-width: @screen-sm) {
+    > li {
+      display: table-cell;
+      width: 1%;
+    }
+  }
 }
 
 // Move borders to anchors instead of bottom of list
diff --git a/js/libs/bootstrap/less/pager.less b/js/libs/bootstrap/less/pager.less
index 04585a3a..16993ddc 100644
--- a/js/libs/bootstrap/less/pager.less
+++ b/js/libs/bootstrap/less/pager.less
@@ -23,7 +23,7 @@
     > a:hover,
     > a:focus {
       text-decoration: none;
-      background-color: @pagination-active-bg;
+      background-color: @pagination-hover-bg;
     }
   }
 
diff --git a/js/libs/bootstrap/less/panels.less b/js/libs/bootstrap/less/panels.less
index 06397316..9d1b2138 100644
--- a/js/libs/bootstrap/less/panels.less
+++ b/js/libs/bootstrap/less/panels.less
@@ -15,6 +15,7 @@
 // Panel contents
 .panel-body {
   padding: 15px;
+  .clearfix();
 }
 
 // List groups in panels
@@ -23,7 +24,7 @@
 // any kind of custom content between the two.
 
 .panel {
-  .list-group {
+  > .list-group {
     margin-bottom: 0;
 
     .list-group-item {
@@ -59,7 +60,7 @@
 .panel-title {
   margin-top: 0;
   margin-bottom: 0;
-  font-size: (@font-size-base * 1.25);
+  font-size: ceil((@font-size-base * 1.125));
   > a {
     color: inherit;
   }
diff --git a/js/libs/bootstrap/less/responsive-utilities.less b/js/libs/bootstrap/less/responsive-utilities.less
index cec86908..062d6820 100644
--- a/js/libs/bootstrap/less/responsive-utilities.less
+++ b/js/libs/bootstrap/less/responsive-utilities.less
@@ -37,98 +37,98 @@
 
 .visible-xs {
   .responsive-visibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-invisibility();
   }
 }
 .visible-sm {
   .responsive-invisibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-invisibility();
   }
 }
 .visible-md {
   .responsive-invisibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-invisibility();
   }
 }
 .visible-lg {
   .responsive-invisibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-visibility();
   }
 }
 
 .hidden-xs {
   .responsive-invisibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-visibility();
   }
 }
 .hidden-sm {
   .responsive-visibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-visibility();
   }
 }
 .hidden-md {
   .responsive-visibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-invisibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-visibility();
   }
 }
 .hidden-lg {
   .responsive-visibility();
-  @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+  @media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+  @media (min-width: @screen-md) and (max-width: @screen-md-max) {
     .responsive-visibility();
   }
-  @media (min-width: @screen-large-desktop) {
+  @media (min-width: @screen-lg) {
     .responsive-invisibility();
   }
 }
@@ -137,7 +137,6 @@
 .visible-print {
   .responsive-invisibility();
 }
-.hidden-print  { }
 
 @media print {
   .visible-print {
diff --git a/js/libs/bootstrap/less/tables.less b/js/libs/bootstrap/less/tables.less
index 05c09192..6fa535d1 100644
--- a/js/libs/bootstrap/less/tables.less
+++ b/js/libs/bootstrap/less/tables.less
@@ -35,6 +35,7 @@ th {
   // Bottom align for column headings
   thead > tr > th {
     vertical-align: bottom;
+    border-bottom: 2px solid @table-border-color;
   }
   // Remove top border from thead by default
   caption + thead,
@@ -92,6 +93,14 @@ th {
       }
     }
   }
+  > thead {
+    > tr {
+      > th,
+      > td {
+        border-bottom-width: 2px;
+      }
+    }
+  }
 }
 
 
diff --git a/js/libs/bootstrap/less/variables.less b/js/libs/bootstrap/less/variables.less
index aa0f9fb0..a46ad4fb 100644
--- a/js/libs/bootstrap/less/variables.less
+++ b/js/libs/bootstrap/less/variables.less
@@ -193,26 +193,25 @@
 // --------------------------------------------------
 
 // Extra small screen / phone
-@screen-xsmall:              480px;
-@screen-phone:               @screen-xsmall;
+@screen-xs:                  480px;
+@screen-phone:               @screen-xs;
 
 // Small screen / tablet
-@screen-small:               768px;
-@screen-tablet:              @screen-small;
+@screen-sm:                  768px;
+@screen-tablet:              @screen-sm;
 
 // Medium screen / desktop
-@screen-medium:              992px;
-@screen-desktop:             @screen-medium;
+@screen-md:                  992px;
+@screen-desktop:             @screen-md;
 
 // Large screen / wide desktop
-@screen-large:               1200px;
-@screen-large-desktop:       @screen-large;
+@screen-lg:                  1200px;
+@screen-lg-desktop:          @screen-lg;
 
 // So media queries don't overlap when required, provide a maximum
-@screen-phone-max:           (@screen-small - 1);
-@screen-small-max:           (@screen-medium - 1);
-@screen-tablet-max:          (@screen-desktop - 1);
-@screen-desktop-max:         (@screen-large-desktop - 1);
+@screen-xs-max:              (@screen-sm - 1);
+@screen-sm-max:              (@screen-md - 1);
+@screen-md-max:              (@screen-lg - 1);
 
 
 // Grid system
@@ -600,10 +599,10 @@
 // --------------------------------------------------
 
 // Small screen / tablet
-@container-tablet:          720px;
+@container-tablet:            ((720px + @grid-gutter-width));
 
 // Medium screen / desktop
-@container-desktop:         940px;
+@container-desktop:           ((940px + @grid-gutter-width));
 
 // Large screen / wide desktop
-@container-large-desktop:   1140px;
+@container-lg-desktop:        ((1140px + @grid-gutter-width));
diff --git a/js/styles/default.less b/js/styles/default.less
index 97319bb2..2e3f3118 100644
--- a/js/styles/default.less
+++ b/js/styles/default.less
@@ -87,7 +87,7 @@ body {
 }
 
 .move-to-front {
-	z-index: 1031 !important;
+	z-index: 1050 !important;
 }
 
 
@@ -401,8 +401,10 @@ body {
 	right: 30px;
 	left: auto;
 	margin: 0;
-	max-height: 500px;
 	min-width: 280px;
+	max-width: 400px;
+	overflow-x: hidden;
+	max-height: 400px;
 	overflow-y: auto;
 }
 
@@ -1008,9 +1010,9 @@ input[type="file"] {
 }
 
 .modal-import-harddrive-html textarea {
-	width: 500px;
-	max-width: 500px;
-	height: 100px;
+	width: 530px;
+	max-width: 530px;
+	height: 120px;
 }
 
 #md-section-helper {