562865 - Don't use CSS opacity to fade text in the new add-ons manager

Status: VERIFIED FIXED

(Toolkit :: Add-ons Manager, defect)

Description

[Jesse Ruderman]

Attachment: screenshot (zoom in to see why the disabled extension's text is ugly)

Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.3a5pre) Gecko/20100429 Firefox/3.7a5pre

At least on Mac, opacity prevents text from going through sub-pixel anti-aliasing.  The result is text that is noticeably more jaggedy.

Please use different CSS color properties rather than opacity in the add-ons manager, so the text can be pretty.

Comment 1

[Alex]

This also hits Bug 363861 on Windows, so the hyperlink under the add-on name gets yellow pixels in it.

Comment 2

[Dão Gottwald [:dao]]

We should use graytext for the normal text. Not sure what to do about the links.

Comment 3

[Alfred Kayser]

Hint: replace:
260 .addon[status="installed"][active="false"] .fade {
261   opacity: 0.6;
262 }

with:
.addon[status="installed"][active="false"]:not([selected="true"]) .fade{
   color:threedshadow !important;
}
.addon[status="installed"][active="false"]:not([selected="true"]) .icon{
   opacity:0.5
}

I have also added 'not([selected' to only fade the text when the item is not selected.

Comment 4

[flying sheep]

you are talking about a workaround.
close this bug and open a new one called “fix font rendering of translucent text on mac”

Comment 5

[Dave Townsend [:mossop]]

Fixed by bug 601022, file any remaining issues separately

Comment 6

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Marking as verified fixed with builds on all platforms like Mozilla/5.0 (X11;
Linux i686; rv:2.0b8pre) Gecko/20101125 Firefox/4.0b8pre ID:20101125030318