Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-11119 in 4.2.2.
  1. #1
    Sencha User
    Join Date
    Nov 2011
    Posts
    14
    Vote Rating
    0
    MagicMatt is on a distinguished road

      0  

    Default Button 'focus' and 'over' style precedence using image slices in IE8?

    Button 'focus' and 'over' style precedence using image slices in IE8?


    Hello,

    I am experiencing a problem I was hoping someone could help with:


    I've used the CSS-Vars of the Button component to change the style (namely colors) of Ext buttons in various states. To be specific, I set the "default" and "focus" parameters to be the same (so that there is no visual indicator that a button has focus), and then changed the "over" style to change the border color.

    This works great in Chrome, and the images are generated correctly using Sencha Cmd.


    However, in IE when a button has focus, the style does not change when the mouse moves over it. If I take the focus away from the button (by say clicking in the body of an alert), then the button loses focus and the 'over' style works correctly when hovering. But whenever a button has focus, it's like that supersedes any other styling.

    This seems backwards; the 'over' style should take precedence as it does in Chrome. Can anyone lend any explanations or solutions? Thanks!

  2. #2
    Sencha - Ext JS Dev Team
    Join Date
    May 2011
    Posts
    149
    Vote Rating
    56
    Phil Guerrant is a jewel in the rough Phil Guerrant is a jewel in the rough Phil Guerrant is a jewel in the rough

      1  

    Default


    Yes it looks like we have the order of precedence backwards for focus and over styles. Focus currently comes after "over" in the cascade, but it should be the other way around. I'll get this fixed in the next release.

  3. #3
    Sencha User
    Join Date
    Nov 2011
    Posts
    14
    Vote Rating
    0
    MagicMatt is on a distinguished road

      0  

    Default


    Great, thanks!

    Can you think of a quick-and-dirty work around for the time being?

  4. #4
    Sencha - Ext JS Dev Team
    Join Date
    May 2011
    Posts
    149
    Vote Rating
    56
    Phil Guerrant is a jewel in the rough Phil Guerrant is a jewel in the rough Phil Guerrant is a jewel in the rough

      0  

    Default


    One possible workaround would be to override the extjs-button-ui mixin in your theme (copy the entire mixin from ext-theme-neutral/sass/src/button/Button.scss) and then go in and switch the order of all the rules that end in "-focus" with the ones ending in "-over" - they're right next to each other, but focus is currently last.

    Just remember to remove your override once 4.2.2 is released or you won't get to take advantage of any other fixes to the mixin
    Phil Guerrant
    Ext JS - Development Team

  5. #5
    Sencha User
    Join Date
    Nov 2011
    Posts
    14
    Vote Rating
    0
    MagicMatt is on a distinguished road

      0  

    Default


    Thanks for the response. I've done as you suggested and swapped instances of -focus and -over (so that -focus is first), and saved this Button.scss file to my-workspace/packages/ext-theme-cms/sass/src (where 'ext-theme-cms' is my custom theme). I then built the package and then the app that used the theme, but I'm still not seeing any difference in the functionality.

    My guess is I put the file in the wrong spot. Could you tell me where it should be placed (in the theme or app directory structure)? Thanks.

    ***EDIT***
    I'm a doofus, I put the Button.scss file in sass/src instead of sass/src/button. Once in the correct spot in my theme it worked great, thanks!

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar