xtype: 'button' iconMask: false does not remain when button is pressed

[dw12345]

I have added my own icons for zoom in and out. setting iconMask to false removes the background-color: 'white'. Which displays the icon correctly.
{
xtype: 'button',
icon: 'images/zoomin24.png',
iconMask: false,
itemId: 'zin',
ui: 'plain',
align: 'right'
}

However the background-color: 'white' is restored once the button is pressed. This shows up as a white box surrounding the icon. This can be recreated by adding x-button-pressed to the config.

{
xtype: 'button',
cls: 'x-button-pressed',
icon: 'images/zoomin24.png',
iconMask: false,
itemId: 'zin',
ui: 'plain',
align: 'right'
}

I think once the iconMask set to false it should also apply when the button is pressed. Is this an incorrect assumption? I would like my custom icons to behave the same as the default icons. This does not work in 1.1 either.

Thanks

[mitchellsimoens]

Looks like 'x-button-pressed' is setting a white background for me. Further more, after I press the button, the 'x-button-press' CSS is removed as expected so I'm seeing the expected behavior.

[rdougan]

I agree. I've fixed this internally and will be available in the next release.

For now, you can simply go into button.scss in the Touch SDK and replace line 237:

.x-button-icon {

With this:

.x-button-icon.x-button-mask {

[dw12345]

Thanks I will give that a try.

I added a local CSS but am not sure of the side effects but it is working

.x-button-icon {
    background-color: transparent !important;
}