1. #1
    Sencha User
    Join Date
    Mar 2007
    Posts
    411
    Answers
    5
    Vote Rating
    17
    jweber will become famous soon enough

      0  

    Default Unanswered: Change to font weight in 2.1.0-b1

    Unanswered: Change to font weight in 2.1.0-b1


    I'm comparing the same app in 2.0.1.1 and 2.1.0-b1 in Chrome 21.0.1180.57 for Mac. In the beta version, any text that's inside a scrolling container appears bolder. It looks like the difference is due to a style on one of the parent DIVs:

    2.0.1.1:
    old.png
    Code:
    <div class="x-inner x-layout-vbox x-scroll-scroller" id="ext-element-769" style="-webkit-box-align: stretch; -webkit-transform: translate3d(0px, 0px, 0px); ">
    2.1.0-b1:
    new.png
    Code:
    <div class="x-inner x-layout-vbox x-scroll-scroller" id="ext-element-41" style="-webkit-box-align: stretch; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); ">
    If I change -webkit-transform to the translate3d value, the font weight goes back to normal.

    Is this intentional? Is there a way I can undo it?

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,604
    Answers
    3449
    Vote Rating
    818
    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


    This simple test case all text in both containers and in 2.0.1.1, 2.0.2 and 2.1.0 b1 are all the same with font-weight: normal

    Code:
    new Ext.Container({
        fullscreen : true,
        layout     : {
            type  : 'hbox',
            align : 'stretch'
        },
        items      : [
            {
                flex : 1,
                html : 'This is not scrollable'
            },
            {
                flex       : 1,
                scrollable : 'vertical',
                html       : 'This is scrollable'
            }
        ]
    });
    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
    411
    Answers
    5
    Vote Rating
    17
    jweber will become famous soon enough

      0  

    Default


    Just to clarify, there's no difference in the font-weight rule; there's just a difference in the way it's displayed, due to the -webkit-transform rule.

    If I load your example in two Chrome windows, one using 2.0.1 and one using 2.1.0-b1, and flip back and forth, I can see the difference. It's not as clear a difference as in my original screen shot (possibly because of the font/colors/size) but the beta version looks more anti-aliased.

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,604
    Answers
    3449
    Vote Rating
    818
    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


    If it is due to the CSS3 transform, then this is a browser issue.
    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.

Thread Participants: 1

Tags for this Thread