diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js
index 68921594b..463108671 100644
--- a/www/common/common-ui-elements.js
+++ b/www/common/common-ui-elements.js
@@ -791,16 +791,23 @@ define([
                     button = $('<span>');
                     break;
                 }
+                var active = $(".cp-toolbar-history:visible").length !== 0;
                 button = $('<button>', {
-                    title: Messages.historyButton,
+                    title: active ? Messages.history_closeTitle : Messages.historyButton,
                     'class': "fa fa-history cp-toolbar-icon-history",
                 }).append($('<span>', {'class': 'cp-toolbar-drawer-element'}).text(Messages.historyText));
+                button.toggleClass("active", active);
                 if (data.histConfig) {
-                    button
-                    .click(common.prepareFeedback(type))
-                    .on('click', function () {
-                        common.getHistory(data.histConfig);
-                    });
+                    if (active) {
+                        button.click(function () { $(".cp-toolbar-history-close").trigger("click"); });
+                    }
+                    else {
+                        button
+                            .click(common.prepareFeedback(type))
+                            .on('click', function () {
+                            common.getHistory(data.histConfig);
+                        });
+                    }
                 }
                 break;
             case 'more':
diff --git a/www/drive/app-drive.less b/www/drive/app-drive.less
index 2abda3f70..b329b5154 100644
--- a/www/drive/app-drive.less
+++ b/www/drive/app-drive.less
@@ -770,6 +770,9 @@
 
         .cp-toolbar-icon-history {
             float: right;
+            &.active {
+                background-color: rgba(0, 0, 255, 0.2);
+            }
             .cp-toolbar-drawer-element {
                 display: none;
             }