Page MenuHomePhabricator

Align core legacy error/warning/success messages/message box visual appearance close to Style Guide
Closed, ResolvedPublic

Description

Bring core legacy error/warning/success messages/message box visual appearance close to Style Guide components template.

Originated in T127405 with

Messages_20190713_error_boxed_level_AA_&_properties.png (1×1 px, 182 KB)

as proposed solution, current treatment of legacy core messages is off template and has too low contrast accessibility issues:
Message boxes 2016-02-18.png (589×618 px, 55 KB)

Event Timeline

Change 519592 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[mediawiki/core@master] Bring legacy messages closer to Style Guide and ensure contrast

https://gerrit.wikimedia.org/r/519592

What do you think about changing paddings?

Change 519592 merged by jenkins-bot:
[mediawiki/core@master] Bring legacy/mediawiki.ui messages closer to Style Guide & ensure contrast

https://gerrit.wikimedia.org/r/519592

@Iniquity To what?

Boxes have 0.5em 1em padding now, but StyleGuide has 1.25em padding or 1.25em 1.25em 1.25em 1.5em padding for boxes.

@Iniquity Thanks for the question. We're not changing them for the time being in core pages outside OOUI, as the most “common” box padding is 0.5em 1em. We might be able to pick this up after T220671.
A not-real example of current OOUI padding in core/Flow:

image.png (768×1 px, 120 KB)

@Iniquity Thanks for the question. We're not changing them for the time being in core pages outside OOUI, as the most “common” box padding is 0.5em 1em. We might be able to pick this up after T220671.
A not-real example of current OOUI padding in core/Flow:

image.png (768×1 px, 120 KB)

Thanks for the answer. :) I know that on ordinary messages paddings look too big. I just need to understand what to build on when we design our boxes: https://ru.wikipedia.org/wiki/Участник:Helgo13/Служебное/Mediawiki_notice.

Change 523152 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[mediawiki/core@master] Add success variables to message group and unify values

https://gerrit.wikimedia.org/r/523152

Change 523152 merged by jenkins-bot:
[mediawiki/core@master] Add success variables to message group and unify values

https://gerrit.wikimedia.org/r/523152

Volker_E claimed this task.

@Volker_E Help advice. Should we use an old paddings or a new one?

@Iniquity Those look very good already! Thanks to your input there's one more patch pending in OOUI reflecting padding amendment in Style Guide https://gerrit.wikimedia.org/r/#/c/oojs/ui/+/523337/

I'd recommend smaller vertical padding like 1em 1.25em to align better with other core boxes. But there's no golden rule as of now, as there are too many styles out there and local communities have come up with own templates.
By the way, the messages all feature no border radius (border-radius: 0).

Thanks for the advice! We will fix it :)

But there's no golden rule as of now, as there are too many styles out there and local communities have come up with own templates.

It has long been necessary to create a design coordination group for communities.