PDA

View Full Version : Change gridpanel style without affecting treepanel



jchau
21 Nov 2012, 9:38 AM
I would like to increase the padding on all grid rows. So I overrode the the following style for grid cells:



.x-grid-cell-inner{
padding:6px !important;
}


But now that treepanels are essentially grids too, it also increased padding between treenodes. Is there a way to target gridpanels only without assigning a special cls to every single gridpanel in my application?

droessner
21 Nov 2012, 11:37 AM
You could do something like this:



Ext.define('My.Override.GridPanel', {
override: 'Ext.grid.Panel',
initComponent: function() {
this.cls = (this.cls || '') + ' custom-grid';
this.callParent(arguments);
}
});


and then define your css as:



.custom-grid .x-grid-cell-inner{
padding: 6px;
}

jchau
21 Nov 2012, 11:48 AM
I solved the problem by resetting the grid cell css for trees only:




.x-grid-cell-inner {
padding: 6px !important; }


.x-grid-cell-treecolumn .x-grid-cell-inner {
padding-top: 0px !important;
padding-bottom: 0px !important; }