[CLOSED] Need an advice on using css..

  1. #1

    [CLOSED] Need an advice on using css..

    after upgrading from version 2.4 to 2.5.1 I had problems with displaying sprites in menu items.
    Please look at the attached images...

    In the new version ext.js appeared style

    . x-menu-item-icon {
    background-size: 16px auto;
    }
    at the moment, I redefine this style:

    . x-menu-item-icon {
    background-size: auto auto! important;
    }
    and everything works... But there are doubts. Maybe there is a better way to use sprites for the menu items? Given the fact that I use all the themes.
    Attached Thumbnails Click image for larger version. 

Name:	hz0.jpg 
Views:	34 
Size:	95.1 KB 
ID:	10131   Click image for larger version. 

Name:	hz1.jpg 
Views:	29 
Size:	94.1 KB 
ID:	10141  
    Last edited by geoffrey.mcgill; Apr 23, 2014 at 2:50 PM. Reason: [CLOSED]
  2. #2
    Hi

    I cannot reproduce the issue, it seems icons are displayed fine in online samples
    https://examples2.ext.net/#/Toolbar/Menu/Overview/
  3. #3
    Quote Originally Posted by Vladimir View Post
    Hi

    I cannot reproduce the issue, it seems icons are displayed fine in online samples
    https://examples2.ext.net/#/Toolbar/Menu/Overview/
    Vladimir, As I saw in your example - there is a single image per file (link for background)... but I have a sprite - a set of images in single file, and background-position in css to choose one:

    .act_add {
        background-image: url('../../content/images/actions.png') !important;
        background-position: 0 0 !important;
    }
    
    .act_duplicate {
        background-image: url('../../content/images/actions.png') !important;
        background-position: -16px 0 !important;
    }
    
    .act_edit {
        background-image: url('../../content/images/actions.png') !important;
        background-position: -32px 0 !important;
    }
    Last edited by Daniil; Apr 22, 2014 at 8:21 PM. Reason: Please use [CODE] tags
  4. #4
    Well, in this case, may be it is better to add 'background-size' rule directly to your rules for icon (.act_add, .act_duplicate and so on)
  5. #5
    Quote Originally Posted by Vladimir View Post
    Well, in this case, may be it is better to add 'background-size' rule directly to your rules for icon (.act_add, .act_duplicate and so on)
    Well, I did it... but not sure this is right way... Maybe there are any property, or some kind of setting to use or not use ext.js background-size style for menu items. In my mind, allways use background-size for any menu item images is strange... If there no possibility to globally disable this style I will redefine it in my own css.
  6. #6
    Hi,

    I don't quite understand why you are not OK with
    . x-menu-item-icon {
        background-size: auto auto! important;
    
    }
    if "everything works".

    Could you, please, clarify?
  7. #7
    Quote Originally Posted by Daniil View Post
    Hi,

    I don't quite understand why you are not OK with
    . x-menu-item-icon {
        background-size: auto auto! important;
    
    }
    if "everything works".

    Could you, please, clarify?
    yes. i did the same. and it's work fine...
    but I do not really understand why it was necessary to add style background-size at the library, because now using sprites will always needs to override that style, just only for disable it. At my opinion, much more logical for those who wants to scale their images for menu items - set background-size style manually, and do not hardcode this style at ext.net library.

    ps. from svn I found this thread http://forums.ext.net/showthread.php?29291 I think it's not a very good solution (((
  8. #8
    Yes, that makes sense. Probably, we just didn't think about such a case.

    Though, that change makes sense as well, because @blurken had a breaking change upgrading from v2.0.

    So, it is a bit controversial.

    I think we are not going to revert it back not to introduce a breaking change again. Moreover, it is easy to overcome.

    Sorry for the inconvenience.
  9. #9
    Quote Originally Posted by Daniil View Post
    Yes, that makes sense. Probably, we just didn't think about such a case.

    Though, that change makes sense as well, because @blurken had a breaking change upgrading from v2.0.

    So, it is a bit controversial.

    I think we are not going to revert it back not to introduce a breaking change again. Moreover, it is easy to overcome.

    Sorry for the inconvenience.
    Ok. I will not argue. But I'm sure a lot of people like me, and it will be an unpleasant surprise. Least because the sprites, especially when used in the menu items are recommended and best practice. I think the right decision, for example, at the level of the menu control, provide the sign(bool) of automatically resize images. And of course, its value by default must be false. Then value is true the background-size style will applied.

    I have no more questions. Let's close topic.

Posting Permissions