diff --git a/app/views/templates.jade b/app/views/templates.jade
index 9f56e611086248dd4c24d92102731d954352d52a..5f4e7574ef6a085201f979f4829078b945f6d225 100644
--- a/app/views/templates.jade
+++ b/app/views/templates.jade
@@ -426,6 +426,10 @@
 	script(type='text/template')#trackChangesPanelTemplate
 		#trackChangesPanel
 			.track-changes-side-bar
+				.track-changes-header
+					h3 Recent changes
+					a(href="#").track-changes-close
+						i.icon-remove
 				.change-list-area
 			.track-changes-diff
 
diff --git a/public/coffee/track-changes/TrackChangesManager.coffee b/public/coffee/track-changes/TrackChangesManager.coffee
index a385f56fed07356c517e1c558e7772ec6c54fe46..58d470b51b167c508d4f2d11da6a50cd58b7d468 100644
--- a/public/coffee/track-changes/TrackChangesManager.coffee
+++ b/public/coffee/track-changes/TrackChangesManager.coffee
@@ -12,6 +12,13 @@ define [
 			$("#editorWrapper").append(@$el)
 			@hideEl()
 
+			@ide.editor.on "change:doc", () =>
+				@hideEl()
+
+			@$el.find(".track-changes-close").on "click", (e) =>
+				e.preventDefault
+				@hideEl()
+
 		show: () ->
 			@project_id = window.userSettings.project_id
 			@doc_id = @ide.editor.current_doc_id
diff --git a/public/stylesheets/less/trackchanges.less b/public/stylesheets/less/trackchanges.less
index c96e69a646223e85bcdae229deee57a3624d443e..c43bb55ab9666fb1db1c9d10b5365262449e64e3 100644
--- a/public/stylesheets/less/trackchanges.less
+++ b/public/stylesheets/less/trackchanges.less
@@ -26,15 +26,31 @@
 		position: absolute;
 		right: 0;
 		background-color: white;
-	}
 
-	.change-list-area {
-		overflow: scroll;
-		position: absolute;
-		left: 0px;
-		right: 0px;
-		top: 0px;
-		bottom: 0px;
+		.track-changes-header {
+			background-color: black;
+			h3 {
+				color: white;
+				padding-left: 8px;
+				font-size: 1.2em;
+			}
+			a {
+				color: white;
+				position: absolute;
+				top: 6px;
+				right: 8px;
+			}
+			height: 30px;
+		}
+
+		.change-list-area {
+			overflow: scroll;
+			position: absolute;
+			left: 0px;
+			right: 0px;
+			top: 30px;
+			bottom: 0px;
+		}
 	}
 
 	.deleted-change-background, .deleted-change-foreground, .inserted-change, .change-name-marker {