0

I'm trying to customize the styling of my buttons. When I add one of the created UIs to my button, it disappears.

@include extjs-button-small-ui(
        $ui: 'test-ui',
        $font-weight: bold,
        $padding: 5px,
        $background-color: #fff
);



Ext.define('MyHeader', {
    extend: 'Ext.panel.Header',
    xtype: 'my-header',

    items: [
        {
            xtype: 'button',
            ui: 'test-ui',
            text: 'Foo Bar'
        }
    ]
});

Any ideas what I'm doing wrong here?

Thanks in advance.

xhadon
  • 876
  • 14
  • 33

1 Answers1

2

You need to create the Button.scss file path: customTheme\sass\src\button\Button.scss

Include the code:

@include extjs-button-small-ui(
        $ui: 'test-ui',
        $font-weight: bold,
        $padding: 5px,
        $background-color: #fff
);

in the file.

Also please find the correct code snippet below:

Ext.define('MyHeader', {
    extend: 'Ext.panel.Header',
    xtype: 'my-header',

    items: [
        {
            xtype: 'button',
            ui: 'test-ui',
            text: 'Foo Bar'
        }
    ]
});
Neha
  • 36
  • 2
  • Yea I missed an apostrophe at `ui: 'test-ui'` Also I had to remove from my path the directory _src_ which has been created by sencha cmd: customTheme\src – xhadon Jan 07 '16 at 12:57