Wait! Looks like we don't have enough information to add this to bug database. Please follow this template bug format.
  1. #1
    Sencha User
    Join Date
    Mar 2007
    Posts
    416
    Vote Rating
    18
    jweber will become famous soon enough

      0  

    Default Tab bar icons cut off on right side

    Tab bar icons cut off on right side


    REQUIRED INFORMATION


    Ext version tested:
    • Sencha Touch 2.1.1

    Browser versions tested against:
    • Chrome for Mac 25.0.1364.172

    DOCTYPE tested against:
    • html

    Description:
    • In a bottom tab bar, the right edge of the icons is cut off.

    Steps to reproduce the problem:
    • Load the example URL, and look at the "Settings" icon.

    The result that was expected:
    • Icon is fully visible

    The result that occurs instead:
    • The right edge of the top gear is cut off (compare it to the left side of the gear).

    Test Case:

    N/A



    HELPFUL INFORMATION


    Screenshot or Video:
    See this URL for live test case: http://docs.sencha.com/touch/2-1/tou...bs2/index.html


    Debugging already done:
    • none

    Possible fix:
    • not provided

    Additional CSS used:
    • only default ext-all.css

    Operating System:
    • Mac OS 10.8.3

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,549
    Vote Rating
    873
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Have you looked at the 2.2 build? The icons have changed but the element is 30x30 still but they don't seem to be cut off.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Mar 2007
    Posts
    416
    Vote Rating
    18
    jweber will become famous soon enough

      0  

    Default


    It's hard to tell, since the built-in icons in 2.2 are actually characters in the Pictos font, rather than CSS inline images.

    My problem is actually not with the built-in icons, but with custom icons. I'm not sure how to generate these in 2.2. In 2.1, I would do something like this, to mimic Sencha's styles for built-in icons:

    Code:
    .x-tab .x-button-icon.my_custom_icon_class,
    .x-button .x-button-icon.x-icon-mask.my_custom_icon_class {
    	-webkit-mask-image: inline_image("my_custom_icon.png");
    }
    Is there a standard way to generate custom icons in 2.2, or am I on my own?

Thread Participants: 1

Tags for this Thread