Inline Editor Close Button

src/editor/InlineTextEditor.js

@@ -210,6 +210,7 @@ define(function (require, exports, module) {
 
         // header containing filename, dirty indicator, line number
         var $header = $("<div/>").addClass("inline-editor-header");
+
         var $filenameInfo = $("<a/>").addClass("filename");
 
         // dirty indicator, with file path stored on it

src/editor/InlineWidget.js

@@ -43,8 +43,16 @@ define(function (require, exports, module) {
         this.htmlContent = window.document.createElement("div");
         this.$htmlContent = $(this.htmlContent).addClass("inline-widget");
         this.$htmlContent.append("<div class='shadow top' />")
-            .append("<div class='shadow bottom' />");
-
+            .append("<div class='shadow bottom' />")
+            .append("<a href='#' class='close'>&times;</a>");
+
+        // create the close button
+        this.$closeBtn = this.$htmlContent.find(".close");
+        this.$closeBtn.click(function (e) {
+            self.close();
+            e.stopImmediatePropagation();
+        });
+
         this.$htmlContent.on("keydown", function (e) {
             if (e.keyCode === KeyEvent.DOM_VK_ESCAPE) {
                 self.close();

src/styles/brackets.less

@@ -672,6 +672,15 @@ a, img {
             background-color: @inline-background-color-1;
         }
     }
+
+    .close {
+        position: relative;
+        float: left;
+        left: 15px;
+        top: 10px;
+        margin-right: 30px;
+    }
+
 }
 
 /* CSSInlineEditor rule list */