One of the main reasons that Ext JS theming is so flexible is that it extracts almost every detail of each component's style into its own SASS variable. This means that we can configure the entire framework by simply setting some variables to our desired value and have them propagate throughout the stylesheet when it is compiled.
This recipe will highlight some of the most important global variables that can be used to customize the default Ext JS theme.
We start by making a copy of the template
my-ext-theme.scss files, which will be used as our base. These can be found in the
resources\themes\templates\resources\sass folder of your Ext JS SDK.
We copy them into a new folder and rename the ...