Search code examples
cssextjssasssencha-cmd

Override Ext.js sass/css variable without creating custom theme


Is it possible to just change a few global css variables without creating a whole new theme or ui?

I'm trying to set e.g. $form-field-border-width: 0 0 1px 0; by creating MyApp/sass/var/form/field/Base.scss and just dropping the code.

I'm using Neptune and only have a few changes, so I'm trying to avoid creating a whole theme package.


Solution

  • By default sass directory uses for store styles related to application components. If you want to overwrite scss for core component (like Ext.*) you should replace Sass namespace in app.json file to:

    "sass": {
        "namespace": ""
    },
    

    Be sure to store variables' files in sass/var directory. In your case path should be: MyApp/sass/var/Ext/form/field/Base.scss.