CODEWITHSUNDEEP
cssextjsextjs4
uncle Lem
uncle Lem

Reputation: 5024

ExtJS: Theming single component

My target is to change header's font size for one single panel.

I tried to read http://docs.sencha.com/extjs/4.2.1/#!/guide/theming, but all what I found was theming the whole applications, theming all-the-panels-in-the-project and overriding config options in "Theme JS Overrides", but no CSS variables overriding for single component.

Is there any way to achieve it without fussing with this SASS for whole project?

Upvotes: 0

Views: 761

Answers (1)

Evan Trimboli
Evan Trimboli

Reputation: 30082

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;
}

Upvotes: 4

Related Questions