Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

Selection color in Pontoon

7 views
Skip to first unread message

Baurzhan Muftakhidinov

unread,
Mar 11, 2021, 2:15:55 AM3/11/21
to dev-l10n
Hello,

Currently the color scheme used in Pontoon is slightly confusing. When
the item is selected in the Untranslated items list, its background
color gets darker and matches the dark color in Pontoon UI. Thus, it
is not immediately obvious on quick glance which item is selected,
especially on smaller screens.

Suggestion is to make the background of the selected item brighter, not darker.

Thanks,

Matjaz Horvat

unread,
Mar 11, 2021, 10:17:48 AM3/11/21
to Baurzhan Muftakhidinov, dev-l10n
Hi Baurzhan,

We've made the change as part of preventing the background color clash
between various items and selected tabs:
https://bugzilla.mozilla.org/show_bug.cgi?id=1692539

We went with the darker background instead of making the lighter one even
lighter in order to increase contrast between the background and the text.
While the Pontoon color scheme is dark, it's on the lighter side among the
dark ones.

Obviously, the right solution here is to add support for themes, which
would allow us to also add a light theme:
https://bugzilla.mozilla.org/show_bug.cgi?id=1486503

Cheers,
Matjaž
> _______________________________________________
> dev-l10n mailing list
> dev-...@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-l10n
>

Michael Wolf

unread,
Mar 11, 2021, 1:28:26 PM3/11/21
to dev-...@lists.mozilla.org
11.3.2021 8:15 hodź. Baurzhan Muftakhidinov napisa:
Hi Baurzhan, hi Matjaž.

I also think that the color of selected source strings is to dark and
the contrast between Pontoon background and string background to low.
Well, I used one of the Firefox possibilities :-) and wrote a short CSS
code:


@-moz-document url-prefix("https://pontoon.mozilla.org/hsb/"),
url-prefix("https://pontoon.mozilla.org/dsb/") {

li.entity.missing.selected.batch-editable {
color: white !important;
background: #B1B1B1 !important;
}
}

Text color is white and #B1B1B1 is a light shade of gray. Every user can
customize these colors according to his wishes. I didn't change the
placeholder formatting (mark.placeable) because it goes well with the
string area formatting here.

The locales hsb and dsb should be replaced by the respective other locale.

I know, it's an idividual solution but it may be true that someone else
want to use such a code.


Regards,

Michael

Michael Wolf

unread,
Mar 11, 2021, 1:32:37 PM3/11/21
to dev-...@lists.mozilla.org
11.3.2021 8:15 hodź. Baurzhan Muftakhidinov napisa:
0 new messages