Size width of Quick Open dropdown more crisply.

Revert PR #7316 - no longer needed to fix #7307.
Tweak the PR #7358 fix to cut down the delay before the dropdown appears to
the bare minimum.

Author: peterflynn

src/search/QuickSearchField.js

@@ -242,7 +242,7 @@ define(function (require, exports, module) {
                     position: "absolute",
                     top: this._dropdownTop,
                     left: this.$input.offset().left,
-                    width: this.$input.width()
+                    width: this.$input.outerWidth()
                 })
                 .click(function (event) {
                     // Unlike the Enter key, where we wait to catch up with typing, clicking commits immediately

src/styles/brackets.less

@@ -1292,16 +1292,15 @@ textarea.exclusions-editor {
 }
 
 .quick-search-container {
-    // the borders show up even if the container is empty, must set height to zero using JS.
+    border: 1px solid @tc-gray-panel-border;
+    box-sizing: border-box;  // lets QuickSearchField size the width more nicely
     background-color: @tc-gray-panel;
     border-radius: 0 0 4px 4px;
     box-shadow: @tc-normal-shadow-bottom;
     opacity: 0;
 
-    // Need this for border-radius because there are no borders
-    overflow: hidden;
-    
-    .animation (autocomplete, 90ms, cubic-bezier(.01, .91, 0, .99), 190ms, 1);
+    // Animation delayed to avoid overlapping with modal-bar slide in, which would make it stuttery
+    .animation (autocomplete, 90ms, cubic-bezier(.01, .91, 0, .99), 66ms, 1);
     -webkit-animation-fill-mode: forwards;
     animation-fill-mode: forwards;
     -webkit-transform-origin: 0 0;

src/styles/brackets_colors.less

@@ -98,7 +98,7 @@
 @tc-panel-border-radius:           5px;
 @tc-small-shadow-top:              0 -1px 3px rgba(0, 0, 0, 0.12);
 @tc-small-shadow-bottom:           0 1px 3px rgba(0, 0, 0, 0.12);
-@tc-normal-shadow-bottom:          0 5px 10px rgba(0, 0, 0, 0.21);
+@tc-normal-shadow-bottom:          0 5px 10px rgba(0, 0, 0, 0.1);
 @tc-highlight:                     #e0f0fa;
 @tc-selected-row:                  #d0d5d5;
 @tc-hover-highlight:               rgba(255, 255, 255, 0.6);