Make WordPress Core

Opened 7 years ago

Last modified 7 years ago

#40701 new defect (bug)

Admin menu icon distorted in Chrome when #adminmenu folded

Reported by: nextendweb's profile nextendweb Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 4.7.4
Component: Administration Keywords: has-patch
Focuses: ui Cc:

Description (last modified by SergeyBiryukov)

By default - when the admin menu is not folded - the icons in the admin menu are 36px wide.

#adminmenu div.wp-menu-image {
    float: left;
    width: 36px;
    height: 34px;
    margin: 0;
    text-align: center;
}

With this width, Chrome renders the icons sharp.

When the admin menu is folded it changes the width to 35px:

.folded #adminmenu div.wp-menu-image {
    width: 35px;
    height: 30px;
    position: absolute;
    z-index: 25;
}

The icons are blurry as the lines in the icon shifted 0.5px horizontally -> antialising.

Possible solution:
Do not force .wp-menu-image to 35px when the menu folded.

.folded #adminmenu div.wp-menu-image {
    height: 30px;
    position: absolute;
    z-index: 25;
}

Attachments (3)

blurry.PNG (20.1 KB) - added by nextendweb 7 years ago.
Blurry icons
notblurry.PNG (15.3 KB) - added by nextendweb 7 years ago.
Not blurry
40701.patch (63.7 KB) - added by faisal03 7 years ago.

Download all attachments as: .zip

Change History (6)

@nextendweb
7 years ago

Blurry icons

@nextendweb
7 years ago

Not blurry

#1 @faisal03
7 years ago

  • Keywords has-patch added

Hi,

I have attached a patch. Please review.

Thanks

Last edited 7 years ago by faisal03 (previous) (diff)

@faisal03
7 years ago

#2 @nextendweb
7 years ago

Seems OK. It would be good to know if the 35px was a fix for an older bug or not...

#3 @SergeyBiryukov
7 years ago

  • Description modified (diff)
Note: See TracTickets for help on using tickets.