ExtJS: one component

Question

My goal is to change the font size of the title for one panel.

I tried to read http://docs.sencha.com/extjs/4.2.1/#!/guide/theming , but all I found were thematic applications, thematic all-panels- project parameters and configuration overrides in "override JS themes, but CSS variables are not overridden for a single component.

Is there any way to achieve this without the fuss with this SASS for the whole project?

Answer 1

Just add a class to the panel, then create a rule to match:

new Ext.panel.Panel({ cls: 'foo', renderTo: document.body, title: 'X' }); .foo .x-header-text { font-size: 24px; }