fix a small visual issue encountered on grid that don't have scrolling. Last filter gets cut because of the header row auto-resize.

Author: Ghislain Beaulac

src/app/examples/grid-graphql.component.ts

@@ -48,7 +48,7 @@ export class GridGraphqlComponent implements OnInit {
           selectOptions: [ { value: '', label: '' }, { value: 'male', label: 'male' }, { value: 'female', label: 'female' } ]
         }
       },
-      { id: 'company', name: 'Company', field: 'company' }
+      { id: 'company', name: 'Company', field: 'company', filterable: true }
     ];
 
     this.gridOptions = {

src/app/modules/angular-slickgrid/global-grid-options.ts

@@ -29,7 +29,8 @@ export const GlobalGridOptions: GridOption = {
   gridMenu: {
     columnTitle: 'Columns',
     iconCssClass: 'fa fa-bars',
-    menuWidth: 16
+    menuWidth: 16,
+    resizeOnShowHeaderRow: false
   },
   headerRowHeight: 35,
   multiColumnSort: true,

src/app/modules/angular-slickgrid/services/controlAndPlugin.service.ts

@@ -168,6 +168,6 @@ export class ControlAndPluginService {
     options.gridMenu.customItems = options.gridMenu.customItems || [];
     this.addGridMenuCustomCommands(options);
 
-    options.gridMenu.resizeOnShowHeaderRow = options.showHeaderRow;
+    // options.gridMenu.resizeOnShowHeaderRow = options.showHeaderRow;
   }
 }

src/app/modules/angular-slickgrid/styles/_variables.scss

@@ -50,6 +50,7 @@ $header-input-width:                    100% !default;                        //
 $header-input-padding:                  0 6px !default;                       // padding of the filter form element (input, textarea, select)
 $header-row-background-color:           #ffffff !default;
 $header-row-count:                      2 !default;                           // how many rows to display on the header
+$header-row-filter-padding:             4px !default;
 $header-column-height:                  (16px * $header-row-count) !default;  // header is calculated by rows to show
 $header-border-top:                     0 none !default;
 $header-border-right:                   0 none !default;
@@ -96,7 +97,6 @@ $grid-menu-link-background-color:       #ffffff !default;
 $grid-menu-box-shadow:                  2px 2px 2px silver !default;
 $grid-menu-icon-font-size:              14px;
 
-
 /* Editors */
 $large-editor-background-color:         #ffffff !default;
 $large-editor-border:                   2px solid gray !default;

src/app/modules/angular-slickgrid/styles/slick-bootstrap.scss

@@ -156,7 +156,7 @@
   .slick-headerrow-columns {
     .slick-headerrow-column {
       border: none;
-      padding: 4px 5px;
+      padding: $header-row-filter-padding;
       background: $header-row-background-color;
     }
     .slick-headerrow-column input,