Results 1 to 2 of 2

Thread: Custom Tab icon bug. 2.2

    Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Dec 2010
    Posts
    83

    Default Custom Tab icon bug. 2.2

    Hello,
    When upgrading to touch 2.2 (via Architect) custom icons in a tab panel will not display.
    This code works in 2.1. Just a blank space where the Icon should be.

    CSS
    Code:
    .x-tab .x-button-icon.myIcon{    -webkit-mask-image: url('../bolt.png');
    }
    Code:
    Ext.define('MyApp.view.MyTabPanel', {
        extend: 'Ext.tab.Panel',
    
    
        config: {
            items: [
                {
                    xtype: 'container',
                    title: 'Tab 1',
                    iconCls: 'info'
                },
                {
                    xtype: 'container',
                    title: 'Tab 2',
                    iconCls: 'info'
                },
                {
                    xtype: 'container',
                    title: 'Tab 3',
                    iconCls: 'myIcon'
                }
            ],
            tabBar: {
                docked: 'bottom'
            }
        }
    
    
    });

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,448

    Default

    This is not a bug. The icons are not images using webkit mask anymore, they are font based. In the theming guide in the docs it discusses the font icons.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •