EXTjs5 - Custom Theme Issue 1 [Tab]

I have a lot of problems with several SASS theming components. I'll start by saying that I will be very annoyed ... I wrote a BUNCH custom themes for EXTjs 4.x and didn't have these problems, but the 5.x theme turned out to be a bit buggy / different. I'm not sure if I'm just not using the correct sass variables, or what ... please help!

TAB

I extended the theme from the "ext-theme-gray" package. I'm just trying to change the color of the tab title text, but these sass variables don't seem to change the color as expected. The color "ext-theme-gray" has the text color # 333.

I add these sass values ​​and build my theme: Code:

    $tab-color: #c8c8c8 !default;    
    $tab-color-active: #c8c8c8 !default;
    $tab-color-over: #c8c8c8 !default;
    $tab-color-disabled: #c8c8c8 !default;

      

There are no changes only in the ACTIVE tab. For some reason, the active tab is still using ext-theme-gray css and overwriting my theme (screenshot below):

enter image description here

What am I doing wrong?!

ref: link to duplicate sencha forum post here

+3


source to share


1 answer


Why are you including both the CSS theme and the ExtJS theme? Your theme will have all the relevant CSS based on ExtJS detection about which classes you are using.



Your style is overridden by a more specific style in the extjs theme. If you want both (and I don't think you do), you will need to mark your styles as !important

, not!default

+1


source







All Articles