How to consolidate css properties in Sencha Architect

Hello,

To the extent possible, I'm trying to keep all of my CSS properties defined as variables in SCSS theme files and all of my components have custom CSS classes applied using the cls attribute.

However, there are some cases where I have to specify things like widths, heights and margins in the definition for the component which is located in the Sencha Architect JS files.

However, there does not appear to be a way to use SCSS variables in JS files or JS variables in SCSS files. What is the common practice if you would like to define a component property (like say width) in one place and have it be referenced in SCSS and JS files?

One thing I thought about doing was querying the dom for the CSS attributes and overriding the defaults for the components in the beforerender handler or something like that. But that seems kludgy and brittle.

Thanks.