History panel: allow searching datasets: name, tags, annotation, dbkey, file_ext, blurb, and info will be searched when enter is pressed in the search field, include whitespace by enclosing search term in double quotes, allow specifying which field to search by using the idiom 'field=term' where field is any of the previous field names (or more user-centric aliases: database for dbkey, etc.), (GUI filters as an alternate means to accomplish field specifiers to be added soon); Allow showing and hiding search input; Tweak style on panel-header buttons; pack scripts

static/scripts/mvc/history/history-panel.js

@@ -664,6 +664,13 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
             this._renderTags( $newRender );
             this._renderAnnotation( $newRender );
         }
+        // button for opening search
+        faIconButton({
+            title   : _l( 'Search datasets' ),
+            classes : 'history-search-btn',
+            faIcon  : 'fa-search'
+        }).prependTo( $newRender.find( '.history-secondary-actions' ) );
+
         this._setUpBehaviours( $newRender );
 
         // render hda views (if any and any shown (show_deleted/hidden)
@@ -696,10 +703,9 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
         });
     },
 
-    /** Set up HistoryPanel js/widget behaviours
-     */
-    //TODO: these should be either sub-MVs, or handled by events
+    /** Set up HistoryPanel js/widget behaviours */
     _setUpBehaviours : function( $where ){
+        //TODO: these should be either sub-MVs, or handled by events
         $where = $where || this.$el;
         $where.find( '[title]' ).tooltip({ placement: 'bottom' });
 
@@ -757,7 +763,8 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
     events : {
         // allow (error) messages to be clicked away
         //TODO: switch to common close (X) idiom
-        'click .message-container'   : 'clearMessages'
+        'click .message-container'      : 'clearMessages',
+        'click .history-search-btn'     : 'toggleSearchControls'
     },
 
     /** Update the history size display (curr. upper right of panel).
@@ -843,7 +850,11 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
             $searchInput = this.renderSearchControls().hide();
             this.$el.find( '.history-title' ).before( $searchInput );
         }
-        $searchInput.slideToggle( this.fxSpeed );
+        $searchInput.slideToggle( this.fxSpeed, function(){
+            if( $( this ).is( ':visible' ) ){
+                $( this ).find( 'input' ).focus();
+            }
+        });
     },
 
     // ........................................................................ multi-select of hdas

static/scripts/mvc/ui.js

@@ -590,7 +590,7 @@ var searchInput = function( options ){
 
     // a button for clearing the search bar, placed on the right hand side
     function clearBtnTemplate(){
-        return '<span class="search-clear fa fa-times-circle"></span>';
+        return '<span class="search-clear fa fa-times-circle" title="' + _l( 'clear search (esc)' ) + '"></span>';
     }
     function $clearBtn(){
 //TODO: to base.less
@@ -602,6 +602,7 @@ var searchInput = function( options ){
             'line-height': '23px',
             color       : 'grey'
         })
+        .tooltip({ placement: 'bottom' })
         .click( function( event ){
             clearSearchInput.call( this, event );
         });

static/scripts/packed/galaxy.menu.js

@@ -1 +1 @@
-define(["galaxy.masthead"],function(b){var a=Backbone.Model.extend({options:null,masthead:null,initialize:function(c){this.options=c.config;this.masthead=c.masthead;this.create()},create:function(){var d=new b.GalaxyMastheadTab({title:"Analyze Data",content:"root/index"});this.masthead.append(d);var c=new b.GalaxyMastheadTab({title:"Workflow",content:"workflow"});this.masthead.append(c);var g=new b.GalaxyMastheadTab({title:"Shared Data",content:"library/index"});g.addMenu({title:"Data Libraries",content:"library/index",divider:true});g.addMenu({title:"Published Histories",content:"history/list_published"});g.addMenu({title:"Published Workflows",content:"workflow/list_published"});g.addMenu({title:"Published Visualizations",content:"visualization/list_published"});g.addMenu({title:"Published Pages",content:"page/list_published"});this.masthead.append(g);if(this.options.user.requests){var h=new b.GalaxyMastheadTab({title:"Lab"});h.addMenu({title:"Sequencing Requests",content:"requests/index"});h.addMenu({title:"Find Samples",content:"requests/find_samples_index"});h.addMenu({title:"Help",content:this.options.lims_doc_url});this.masthead.append(h)}var k=new b.GalaxyMastheadTab({title:"Visualization",content:"visualization/list"});k.addMenu({title:"New Track Browser",content:"visualization/trackster",target:"_frame"});k.addMenu({title:"Saved Visualizations",content:"visualization/list",target:"_frame"});this.masthead.append(k);if(this.options.enable_cloud_launch){var e=new b.GalaxyMastheadTab({title:"Cloud",content:"cloudlaunch/index"});e.addMenu({title:"New Cloud Cluster",content:"cloudlaunch/index"});this.masthead.append(e)}if(this.options.is_admin_user){var f=new b.GalaxyMastheadTab({title:"Admin",content:"admin/index",extra_class:"admin-only"});this.masthead.append(f)}var j=new b.GalaxyMastheadTab({title:"Help"});if(this.options.biostar_url){j.addMenu({title:"Galaxy Q&A Site",content:this.options.biostar_url_redirect,target:"_blank"});j.addMenu({title:"Ask a question",content:"biostar/biostar_question_redirect",target:"_blank"})}j.addMenu({title:"Support",content:this.options.support_url,target:"_blank"});j.addMenu({title:"Search",content:this.options.search_url,target:"_blank"});j.addMenu({title:"Mailing Lists",content:this.options.mailing_lists,target:"_blank"});j.addMenu({title:"Videos",content:this.options.screencasts_url,target:"_blank"});j.addMenu({title:"Wiki",content:this.options.wiki_url,target:"_blank"});j.addMenu({title:"How to Cite Galaxy",content:this.options.citation_url,target:"_blank"});if(!this.options.terms_url){j.addMenu({title:"Terms and Conditions",content:this.options.terms_url,target:"_blank"})}this.masthead.append(j);if(!this.options.user.valid){var i=new b.GalaxyMastheadTab({title:"User",extra_class:"loggedout-only"});i.addMenu({title:"Login",content:"user/login",target:"galaxy_main"});if(this.options.allow_user_creation){i.addMenu({title:"Register",content:"user/create",target:"galaxy_main"})}this.masthead.append(i)}else{var i=new b.GalaxyMastheadTab({title:"User",extra_class:"loggedin-only"});i.addMenu({title:"Logged in as "+this.options.user.email});if(this.options.use_remote_user&&this.options.remote_user_logout_href){i.addMenu({title:"Logout",content:this.options.remote_user_logout_href,target:"_top"})}else{i.addMenu({title:"Preferences",content:"user?cntrller=user",target:"galaxy_main"});i.addMenu({title:"Custom Builds",content:"user/dbkeys",target:"galaxy_main"});i.addMenu({title:"Logout",content:"user/logout",target:"_top",divider:true})}i.addMenu({title:"Saved Histories",content:"history/list",target:"galaxy_main"});i.addMenu({title:"Saved Datasets",content:"dataset/list",target:"galaxy_main"});i.addMenu({title:"Saved Pages",content:"page/list",target:"_top"});i.addMenu({title:"API Keys",content:"user/api_keys?cntrller=user",target:"galaxy_main"});if(this.options.use_remote_user){i.addMenu({title:"Public Name",content:"user/edit_username?cntrller=user",target:"galaxy_main"})}this.masthead.append(i)}}});return{GalaxyMenu:a}});
+define(["galaxy.masthead"],function(b){var a=Backbone.Model.extend({options:null,masthead:null,initialize:function(c){this.options=c.config;this.masthead=c.masthead;this.create()},create:function(){var d=new b.GalaxyMastheadTab({id:"analysis",title:"Analyze Data",content:"root/index"});this.masthead.append(d);var c=new b.GalaxyMastheadTab({id:"workflow",title:"Workflow",content:"workflow"});this.masthead.append(c);var g=new b.GalaxyMastheadTab({id:"shared",title:"Shared Data",content:"library/index"});g.add({title:"Data Libraries",content:"library/index",divider:true});g.add({title:"Published Histories",content:"history/list_published"});g.add({title:"Published Workflows",content:"workflow/list_published"});g.add({title:"Published Visualizations",content:"visualization/list_published"});g.add({title:"Published Pages",content:"page/list_published"});this.masthead.append(g);if(this.options.user.requests){var h=new b.GalaxyMastheadTab({id:"lab",title:"Lab"});h.add({title:"Sequencing Requests",content:"requests/index"});h.add({title:"Find Samples",content:"requests/find_samples_index"});h.add({title:"Help",content:this.options.lims_doc_url});this.masthead.append(h)}var k=new b.GalaxyMastheadTab({id:"visualization",title:"Visualization",content:"visualization/list"});k.add({title:"New Track Browser",content:"visualization/trackster",target:"_frame"});k.add({title:"Saved Visualizations",content:"visualization/list",target:"_frame"});this.masthead.append(k);if(this.options.enable_cloud_launch){var e=new b.GalaxyMastheadTab({id:"cloud",title:"Cloud",content:"cloudlaunch/index"});e.add({title:"New Cloud Cluster",content:"cloudlaunch/index"});this.masthead.append(e)}if(this.options.is_admin_user){var f=new b.GalaxyMastheadTab({id:"admin",title:"Admin",content:"admin/index",extra_class:"admin-only"});this.masthead.append(f)}var j=new b.GalaxyMastheadTab({id:"help",title:"Help"});if(this.options.biostar_url){j.add({title:"Galaxy Q&A Site",content:this.options.biostar_url_redirect,target:"_blank"});j.add({title:"Ask a question",content:"biostar/biostar_question_redirect",target:"_blank"})}j.add({title:"Support",content:this.options.support_url,target:"_blank"});j.add({title:"Search",content:this.options.search_url,target:"_blank"});j.add({title:"Mailing Lists",content:this.options.mailing_lists,target:"_blank"});j.add({title:"Videos",content:this.options.screencasts_url,target:"_blank"});j.add({title:"Wiki",content:this.options.wiki_url,target:"_blank"});j.add({title:"How to Cite Galaxy",content:this.options.citation_url,target:"_blank"});if(!this.options.terms_url){j.add({title:"Terms and Conditions",content:this.options.terms_url,target:"_blank"})}this.masthead.append(j);if(!this.options.user.valid){var i=new b.GalaxyMastheadTab({id:"user",title:"User",extra_class:"loggedout-only"});i.add({title:"Login",content:"user/login",target:"galaxy_main"});if(this.options.allow_user_creation){i.add({title:"Register",content:"user/create",target:"galaxy_main"})}this.masthead.append(i)}else{var i=new b.GalaxyMastheadTab({id:"user",title:"User",extra_class:"loggedin-only"});i.add({title:"Logged in as "+this.options.user.email});if(this.options.use_remote_user&&this.options.remote_user_logout_href){i.add({title:"Logout",content:this.options.remote_user_logout_href,target:"_top"})}else{i.add({title:"Preferences",content:"user?cntrller=user",target:"galaxy_main"});i.add({title:"Custom Builds",content:"user/dbkeys",target:"galaxy_main"});i.add({title:"Logout",content:"user/logout",target:"_top",divider:true})}i.add({title:"Saved Histories",content:"history/list",target:"galaxy_main"});i.add({title:"Saved Datasets",content:"dataset/list",target:"galaxy_main"});i.add({title:"Saved Pages",content:"page/list",target:"_top"});i.add({title:"API Keys",content:"user/api_keys?cntrller=user",target:"galaxy_main"});if(this.options.use_remote_user){i.add({title:"Public Name",content:"user/edit_username?cntrller=user",target:"galaxy_main"})}this.masthead.append(i)}if(this.options.active_view){this.masthead.highlight(this.options.active_view)}}});return{GalaxyMenu:a}});

static/scripts/packed/templates/compiled/template-history-historyPanel.js

@@ -1 +1 @@
-(function(){var b=Handlebars.template,a=Handlebars.templates=Handlebars.templates||{};a["template-history-historyPanel"]=b(function(h,s,q,l,w){this.compilerInfo=[4,">= 1.0.0"];q=this.merge(q,h.helpers);w=w||{};var r="",i,f,p=this,e="function",c=q.blockHelperMissing,d=this.escapeExpression;function o(B,A){var x="",z,y;x+='\n            <div class="history-name" title="';y={hash:{},inverse:p.noop,fn:p.program(2,n,A),data:A};if(z=q.local){z=z.call(B,y)}else{z=B.local;z=typeof z===e?z.apply(B):z}if(!q.local){z=c.call(B,z,y)}if(z||z===0){x+=z}x+='">\n                ';if(z=q.name){z=z.call(B,{hash:{},data:A})}else{z=B.name;z=typeof z===e?z.apply(B):z}x+=d(z)+"\n            </div>\n            ";return x}function n(y,x){return"Click to rename history"}function m(A,z){var x="",y;x+='\n            <div class="history-size">';if(y=q.nice_size){y=y.call(A,{hash:{},data:z})}else{y=A.nice_size;y=typeof y===e?y.apply(A):y}x+=d(y)+"</div>\n            ";return x}function k(B,A){var x="",z,y;x+='\n        <div class="warningmessagesmall"><strong>\n            ';y={hash:{},inverse:p.noop,fn:p.program(7,j,A),data:A};if(z=q.local){z=z.call(B,y)}else{z=B.local;z=typeof z===e?z.apply(B):z}if(!q.local){z=c.call(B,z,y)}if(z||z===0){x+=z}x+="\n        </strong></div>\n        ";return x}function j(y,x){return"You are currently viewing a deleted history!"}function g(A,z){var x="",y;x+='\n            \n            <div class="';if(y=q.status){y=y.call(A,{hash:{},data:z})}else{y=A.status;y=typeof y===e?y.apply(A):y}x+=d(y)+'message">';if(y=q.message){y=y.call(A,{hash:{},data:z})}else{y=A.message;y=typeof y===e?y.apply(A):y}x+=d(y)+"</div>\n            ";return x}function v(y,x){return"You are over your disk quota"}function u(y,x){return"Tool execution is on hold until your disk usage drops below your allocated quota"}function t(y,x){return"Your history is empty. Click 'Get Data' on the left pane to start"}r+='<div class="history-controls">\n\n        <div class="history-title">\n            ';i=q["if"].call(s,s.name,{hash:{},inverse:p.noop,fn:p.program(1,o,w),data:w});if(i||i===0){r+=i}r+='\n        </div>\n\n        <div class="history-subtitle clear">\n            ';i=q["if"].call(s,s.nice_size,{hash:{},inverse:p.noop,fn:p.program(4,m,w),data:w});if(i||i===0){r+=i}r+='\n\n            <div class="history-secondary-actions">\n            </div>\n        </div>\n\n        ';i=q["if"].call(s,s.deleted,{hash:{},inverse:p.noop,fn:p.program(6,k,w),data:w});if(i||i===0){r+=i}r+='\n\n        <div class="message-container">\n            ';i=q["if"].call(s,s.message,{hash:{},inverse:p.noop,fn:p.program(9,g,w),data:w});if(i||i===0){r+=i}r+='\n        </div>\n\n        <div class="quota-message errormessage">\n            ';f={hash:{},inverse:p.noop,fn:p.program(11,v,w),data:w};if(i=q.local){i=i.call(s,f)}else{i=s.local;i=typeof i===e?i.apply(s):i}if(!q.local){i=c.call(s,i,f)}if(i||i===0){r+=i}r+=".\n            ";f={hash:{},inverse:p.noop,fn:p.program(13,u,w),data:w};if(i=q.local){i=i.call(s,f)}else{i=s.local;i=typeof i===e?i.apply(s):i}if(!q.local){i=c.call(s,i,f)}if(i||i===0){r+=i}r+='.\n        </div>\n        \n        <div class="tags-display"></div>\n        <div class="annotation-display"></div>\n\n    </div>\n\n    \n    <div class="datasets-list"></div>\n\n    <div class="empty-history-message infomessagesmall">\n        ';f={hash:{},inverse:p.noop,fn:p.program(15,t,w),data:w};if(i=q.local){i=i.call(s,f)}else{i=s.local;i=typeof i===e?i.apply(s):i}if(!q.local){i=c.call(s,i,f)}if(i||i===0){r+=i}r+="\n    </div>";return r})})();
+(function(){var b=Handlebars.template,a=Handlebars.templates=Handlebars.templates||{};a["template-history-historyPanel"]=b(function(h,s,q,l,w){this.compilerInfo=[4,">= 1.0.0"];q=this.merge(q,h.helpers);w=w||{};var r="",i,f,p=this,e="function",c=q.blockHelperMissing,d=this.escapeExpression;function o(B,A){var x="",z,y;x+='\n            <div class="history-name" title="';y={hash:{},inverse:p.noop,fn:p.program(2,n,A),data:A};if(z=q.local){z=z.call(B,y)}else{z=B.local;z=typeof z===e?z.apply(B):z}if(!q.local){z=c.call(B,z,y)}if(z||z===0){x+=z}x+='">\n                ';if(z=q.name){z=z.call(B,{hash:{},data:A})}else{z=B.name;z=typeof z===e?z.apply(B):z}x+=d(z)+"\n            </div>\n            ";return x}function n(y,x){return"Click to rename history"}function m(A,z){var x="",y;x+='\n            <div class="history-size">';if(y=q.nice_size){y=y.call(A,{hash:{},data:z})}else{y=A.nice_size;y=typeof y===e?y.apply(A):y}x+=d(y)+"</div>\n            ";return x}function k(B,A){var x="",z,y;x+='\n        <div class="warningmessagesmall"><strong>\n            ';y={hash:{},inverse:p.noop,fn:p.program(7,j,A),data:A};if(z=q.local){z=z.call(B,y)}else{z=B.local;z=typeof z===e?z.apply(B):z}if(!q.local){z=c.call(B,z,y)}if(z||z===0){x+=z}x+="\n        </strong></div>\n        ";return x}function j(y,x){return"You are currently viewing a deleted history!"}function g(A,z){var x="",y;x+='\n            \n            <div class="';if(y=q.status){y=y.call(A,{hash:{},data:z})}else{y=A.status;y=typeof y===e?y.apply(A):y}x+=d(y)+'message">';if(y=q.message){y=y.call(A,{hash:{},data:z})}else{y=A.message;y=typeof y===e?y.apply(A):y}x+=d(y)+"</div>\n            ";return x}function v(y,x){return"You are over your disk quota"}function u(y,x){return"Tool execution is on hold until your disk usage drops below your allocated quota"}function t(y,x){return"Your history is empty. Click 'Get Data' on the left pane to start"}r+='<div class="history-controls">\n\n        <div class="history-title">\n            ';i=q["if"].call(s,s.name,{hash:{},inverse:p.noop,fn:p.program(1,o,w),data:w});if(i||i===0){r+=i}r+='\n        </div>\n\n        <div class="history-subtitle clear">\n            ';i=q["if"].call(s,s.nice_size,{hash:{},inverse:p.noop,fn:p.program(4,m,w),data:w});if(i||i===0){r+=i}r+='\n\n            <div class="history-secondary-actions"></div>\n        </div>\n\n        ';i=q["if"].call(s,s.deleted,{hash:{},inverse:p.noop,fn:p.program(6,k,w),data:w});if(i||i===0){r+=i}r+='\n\n        <div class="message-container">\n            ';i=q["if"].call(s,s.message,{hash:{},inverse:p.noop,fn:p.program(9,g,w),data:w});if(i||i===0){r+=i}r+='\n        </div>\n\n        <div class="quota-message errormessage">\n            ';f={hash:{},inverse:p.noop,fn:p.program(11,v,w),data:w};if(i=q.local){i=i.call(s,f)}else{i=s.local;i=typeof i===e?i.apply(s):i}if(!q.local){i=c.call(s,i,f)}if(i||i===0){r+=i}r+=".\n            ";f={hash:{},inverse:p.noop,fn:p.program(13,u,w),data:w};if(i=q.local){i=i.call(s,f)}else{i=s.local;i=typeof i===e?i.apply(s):i}if(!q.local){i=c.call(s,i,f)}if(i||i===0){r+=i}r+='.\n        </div>\n        \n        <div class="tags-display"></div>\n        <div class="annotation-display"></div>\n\n    </div>\n\n    \n    <div class="datasets-list"></div>\n\n    <div class="empty-history-message infomessagesmall">\n        ';f={hash:{},inverse:p.noop,fn:p.program(15,t,w),data:w};if(i=q.local){i=i.call(s,f)}else{i=s.local;i=typeof i===e?i.apply(s):i}if(!q.local){i=c.call(s,i,f)}if(i||i===0){r+=i}r+="\n    </div>";return r})})();

static/scripts/templates/compiled/history-templates.js

@@ -507,7 +507,7 @@ function program15(depth0,data) {
   buffer += "\n        </div>\n\n        <div class=\"history-subtitle clear\">\n            ";
   stack1 = helpers['if'].call(depth0, depth0.nice_size, {hash:{},inverse:self.noop,fn:self.program(4, program4, data),data:data});
   if(stack1 || stack1 === 0) { buffer += stack1; }
-  buffer += "\n\n            <div class=\"history-secondary-actions\">\n            </div>\n        </div>\n\n        ";
+  buffer += "\n\n            <div class=\"history-secondary-actions\"></div>\n        </div>\n\n        ";
   stack1 = helpers['if'].call(depth0, depth0.deleted, {hash:{},inverse:self.noop,fn:self.program(6, program6, data),data:data});
   if(stack1 || stack1 === 0) { buffer += stack1; }
   buffer += "\n\n        <div class=\"message-container\">\n            ";

static/scripts/templates/compiled/template-history-historyPanel.js

@@ -96,7 +96,7 @@ function program15(depth0,data) {
   buffer += "\n        </div>\n\n        <div class=\"history-subtitle clear\">\n            ";
   stack1 = helpers['if'].call(depth0, depth0.nice_size, {hash:{},inverse:self.noop,fn:self.program(4, program4, data),data:data});
   if(stack1 || stack1 === 0) { buffer += stack1; }
-  buffer += "\n\n            <div class=\"history-secondary-actions\">\n            </div>\n        </div>\n\n        ";
+  buffer += "\n\n            <div class=\"history-secondary-actions\"></div>\n        </div>\n\n        ";
   stack1 = helpers['if'].call(depth0, depth0.deleted, {hash:{},inverse:self.noop,fn:self.program(6, program6, data),data:data});
   if(stack1 || stack1 === 0) { buffer += stack1; }
   buffer += "\n\n        <div class=\"message-container\">\n            ";

static/scripts/templates/history-templates.html

@@ -16,8 +16,7 @@
             <div class="history-size">{{nice_size}}</div>
             {{/if}}
 
-            <div class="history-secondary-actions">
-            </div>
+            <div class="history-secondary-actions"></div>
         </div>
 
         {{#if deleted}}

static/style/blue/base.css

@@ -1507,9 +1507,10 @@ div.permissionContainer{padding-left:20px}
 .icon-button.link{background:url(../images/silk/link.png) no-repeat;cursor:pointer;float:none;display:inline-block;margin-left:10px}
 .icon-button.link-broken{background:url(../images/silk/link_break.png) no-repeat;cursor:pointer;float:none;display:inline-block;margin-left:10px}
 .workflow-invocation-complete{border:solid 1px #6A6;border-left-width:5px;margin:10px 0;padding-left:5px}
-.icon-btn{display:inline-block;height:20px;width:20px;text-align:center;line-height:17px;border-radius:3px;border:1px solid rgba(0,0,0,0.1);background-color:rgba(0,0,0,0.05);color:#555;font-size:1.2em;cursor:pointer}
+.icon-btn{display:inline-block;height:20px;width:20px;text-align:center;line-height:17px;font-size:1.2em;border-radius:3px;border:1px solid rgba(0,0,0,0.1);background-color:rgba(0,0,0,0.05);color:#555;cursor:pointer}
 .icon-btn:hover{background-color:white;color:maroon}
 .icon-btn.disabled{background-color:transparent;color:rgba(0,0,0,0.05)}
+#history-refresh-button,#history-options-button{display:inline-block;height:20px;width:20px;text-align:center;line-height:17px;font-size:1.2em;padding:0px}
 .history-panel [class$="messagesmall"]{margin:0px}
 .history-panel .editable-text{border:solid transparent 1px}
 .history-panel .editable-text:hover{cursor:pointer;border:1px dotted #999999}

static/style/src/less/history.less

@@ -34,13 +34,14 @@
     // center the icon
     text-align: center;
     line-height: @icon-btn-size - 3;
+    font-size: 1.2em;
+
     // colors and borders
     border-radius: 3px;
     border: 1px solid @icon-btn-border;
     background-color: @icon-btn-bg;
     color           : @icon-btn-color;
 
-    font-size: 1.2em;
     cursor: pointer;
 
     // tweaks
@@ -59,6 +60,19 @@
     color: @icon-btn-bg;
 }
 
+// ---------------------------------------------------------------------------- panel header buttons
+#history-refresh-button,
+#history-options-button {
+    display : inline-block;
+    height  : @icon-btn-size;
+    width   : @icon-btn-size;
+    text-align  : center;
+    line-height : @icon-btn-size - 3;
+    font-size   : 1.2em;
+
+    padding: 0px;
+}
+
 
 // ---------------------------------------------------------------------------- history
 .history-panel {