Module talk:Message box

This module was considered for deletion on 2020 February 15. The result of the discussion was "keep".

Module:Message box is permanently protected from editing because it is a heavily used or highly visible module. Substantial changes should first be proposed and discussed here on this page. If the proposal is uncontroversial or has been discussed and is supported by consensus, editors may use {{edit protected}} to notify an administrator to make the requested edit.

Archives

Archive 1

This page has archives. Sections older than 30 days may be auto-archived by if there are more than 4.

CSS instead of tables

Moved from Template talk:Ambox § CSS instead of tables

– Sapphaline (talk) 10:25, 20 August 2025 (UTC)[reply]

Could this thing use <div style="display:table;"> and <div style="display:table-cell;"> instead of literal tables and table cells (<table>, <td>)?

Were the any previous attempts to remake this using <div>? If so, what was the consensus? Sapphaline (talk) 09:46, 20 August 2025 (UTC)[reply]

A long time ago this would have been converted to divs but apparently IE sucked (this should not be news).

Today, I have User:Izno/Sandbox/Ambox with what are some skimmings and started a sandbox at Module:Message box/div. I have just done a very bad job of finishing this work. Izno (talk) 22:09, 24 August 2025 (UTC)[reply]

Which might be closer to done than not, honestly. I think what it currently needs is to

Double check the ambox work
Add "soft" support for the other kinds of boxes (where soft is defined as module-supports but config disabled)
Merge tested /div version but not CSS into main
Enable boxes of each kind one by one.
- Leave ambox for penultimate as the most likely to cause some mass noise in a way
- Probably somewhere around here do ombox, that has some needed coordination
- Leave tmbox for ultimate, there is work to coordinate
Fix bugs that are identified
Move CSS over to better-named stylesheet
Delete the /div CSS (I won't be too sad)
Remove main support for table versions, possibly rename some things

Izno (talk) 22:42, 24 August 2025 (UTC)[reply]

I have now put this plan in a publicly editable place at Module:Message box/div/doc. Izno Public (talk) 00:26, 26 August 2025 (UTC)[reply]

Hi! I didn't know you were doing this, so I made something similar. It seems to work:

Module: [1]
Styles: [2]

Iniquity (talk) 16:57, 11 September 2025 (UTC)[reply]

Yes, I did it in its own sandbox because it's a longterm enough project not to be done in the main sandbox, which should generally be releasable ad hoc for trivial issues. Izno (talk) 17:03, 11 September 2025 (UTC)[reply]

And also, there are enough other dependencies that "just change the two or three places" isn't going to fly. Izno (talk) 17:06, 11 September 2025 (UTC)[reply]

Where else do you think this will affect? It seems that only the mobile version is oriented towards table.ambox, which can also be corrected by CSS Iniquity (talk) 17:09, 11 September 2025 (UTC)[reply]

I have already documented in Module:Message box/div/doc multiple places that will need careful work, ambox among them. Please feel free to peruse and ask questions about what's there and why. Izno (talk) 17:41, 11 September 2025 (UTC)[reply]

Thanks! Iniquity (talk) 17:47, 11 September 2025 (UTC)[reply]

What's broken here? I've probably wrong but AFAIK for accessibility the existing role="presentation" should suffice. Aaron Liu (talk) 23:21, 28 August 2025 (UTC)[reply]

You should always endeavor to use the default aria role element. In this case, that's not a table. Ignoring that, tables are shit for doing other presentation with. Izno (talk) 03:20, 29 August 2025 (UTC)[reply]

This /div work is great work, thanks for this waddie96 ★ (talk) 19:49, 8 September 2025 (UTC)[reply]

Ok, I think we can do {{cmbox}} now. Based on what I wrote down before, the process of a rollout is:

Alert some key pages. Has to include some verbiage like
A change is occurring to how {{cmbox}} is implemented to support mobile resolutions better. It may cause some temporary display weirdness. Further information is available at Module talk:Message box#cmbox migration.
with some text at the specific section
A change is planned to occur in how {{cmbox}} is implemented. It should help improve display at mobile resolutions now, and accessibility later. cmbox was chosen because it has lower reader-facing impact than most other message box types and it's fairly self-contained. The change to cmbox will likely pave the way for other message boxes ({{fmbox}} is probably next).
You can expect some difference in styling from previous for a small period due to the job queue, after which it should return to "normal". You should be able to correct it manually if you want with one of the usual steps (purge, null edit, or dummy edit). If an issue with display persists, leave a comment here (this scenario may be possible with some unexpected setup cmboxes).
- Here (here, here is the warning)
- WP:VPT
- MediaWiki talk:Common.css
- Maybe WT:CAT and WT:CFD
Sync Module:Message box/sandbox to Module:Message box (first time only)
Within quick succession to next step, sync Module:Message box/configuration/sandbox to Module:Message box/configuration
Within quick succession to previous step, sync Module:Message box/div/cmbox.css to Module:Message box/cmbox.css

Izno (talk) 17:08, 1 October 2025 (UTC)[reply]

The /div main and config modules have got some other adjustments that now make it different from what will end up going live, so they shouldn't generally be synced directly. For future me. Izno (talk) 21:59, 1 October 2025 (UTC)[reply]

Also messages now posted to VPT and Common.css. Izno (talk) 22:00, 1 October 2025 (UTC)[reply]

cmbox is deployed. Izno (talk) 20:30, 2 October 2025 (UTC)[reply]

Ok, cmbox has been basically quiet besides notes from the below. I will now work on fmbox, which should also be relatively low impact. I'm also starting to sketch out imbox which may need to interact with template content from Commons as well as c:MediaWiki:Filepage.css. Izno (talk) 20:44, 7 October 2025 (UTC)[reply]

Turns out I don't currently have to worry about commons names, which is something I should have noted when I split message box CSS during the TemplateStylization. Izno (talk) 01:03, 17 October 2025 (UTC)[reply]

What does split message box CSS during the TemplateStylization mean exactly?

Also, what can I help with. waddie96 ★ (talk) 03:56, 17 October 2025 (UTC)[reply]

All of the CSS for the message boxes was once in MediaWiki:Common.css. I moved it to TemplateStyles with some effort because of reasons.

This effort now that I've got my feet under me probably doesn't need much assistance. If you want to spend time on something, working on the problems listed at MediaWiki talk:Common.css/to do#Infobox would be excellent. If you want to spend some time on stuff, crafting an infobox (using Lua or template) to fix our career statistics pages would be super helpful. Izno (talk) 00:27, 19 October 2025 (UTC)[reply]

Change background color for .fmbox-warning

This edit request to Module:Message box/fmbox.css has been answered. Set the |answered= parameter to no to reactivate your request.

Current background color doesn't meet WCAG AA contrast requirements with links color used in Vector-2022, Timeless and Minerva, so I request to change it from #ffdbdb to #ffe6de.

More specifically, edit the 14th line so that

	background-color: #ffdbdb;  /* Pink */

becomes

	background-color: #ffe6de;  /* Pink */

. Sapphaline (talk) 18:02, 10 September 2025 (UTC)[reply]

Hmm why not change it to var(--background-color-destructive-subtle, #ffe6de);? waddie96 ★ (talk) 18:05, 11 September 2025 (UTC)[reply]

Then it'll be dynamic, adaptive for CSS themes, and change in dark mode waddie96 ★ (talk) 18:07, 11 September 2025 (UTC)[reply]

Why did the WMF feel the need to mess with link colors again? (Sent from the REAL vector skin) —pythoncoder (talk | contribs) 17:57, 16 September 2025 (UTC)[reply]

Hahaa I +1 this. waddie96 ★ (talk) 18:30, 16 September 2025 (UTC)[reply]

Not done for now: This is also the background used for cmbox speedy and delete. I'd be fine making this change for all or none. I also think it's a reasonable question whether to consider the token directly for this case. Izno (talk) 23:37, 30 September 2025 (UTC)[reply]

As for the token, the actual token is #ffe9e5 in use with background-color-error-subtle, which is probably the preferable token to reference rather than destructive-subtle.

My issue with lightening the color is indeed that the original color is used in the context of at least one deletion mbox, and we want those to be annoying enough to be annoying.

WCAG 2 AA should be taken a little less interestingly these days with the development of WCAG 3.0 which uses Accessible Perceptual Contrast Algorithm (APCA) to decide whether some content is too much or too little contrast. I expect blue/dark purple on pink to do better with the APCA than it does with WCAG 2 computation. Izno (talk) 03:13, 1 October 2025 (UTC)[reply]

Thanks for the interesting pointer to a new contrast metric! Based on a quick reading of some sites that came up in search, it seems that the WCAG working group is still considering if it will include APCA in the new release of its standards. Nonetheless, it does seem that improved ways of measuring contrast are under consideration. isaacl (talk) 04:55, 1 October 2025 (UTC)[reply]

Yeah, APCA takes into account some of the factors that have been recommended (but rarely considered) for consideration while looking at WCAG 2.0 contrast checking (notably, [relative] font size and boldness), but the contrast checking algo itself has also changed AIUI. Izno (talk) 15:36, 1 October 2025 (UTC)[reply]

My understanding is that APCA tries to adjust the luminance contrast ratio to account for differences in how humans perceive luminance in different colours, as well as which colour is foreground and which is background. The threshold values in WCAG 2.0 were always known to be arbitrarily chosen; there seems to be some concerns that a new replacement in WCAG 3 should have more hard data behind it. isaacl (talk) 21:52, 7 October 2025 (UTC)[reply]

cmbox migration

A change is planned to occur sometime starting in the next day or two in how {{cmbox}} is implemented. It should help improve display at mobile resolutions now, and accessibility later. cmbox was chosen because it has lower reader-facing impact than most other message box types and it's fairly self-contained. The change to cmbox will likely pave the way for other message boxes ({{fmbox}} or {{imbox}} is probably next). (There is some other planning information in #CSS instead of tables.)

You can expect some difference in styling from previous for a small period due to the job queue, after which it should return to "normal". You should be able to correct it manually if you want with one of the usual steps (purge, null edit, or dummy edit). If an issue with display persists, leave a comment here (this scenario may be possible with some unexpected setup cmboxes). Izno (talk) 21:22, 1 October 2025 (UTC)[reply]

Ok, this is now deployed. I await the lions and bears (oh my!). Izno (talk) 20:30, 2 October 2025 (UTC)[reply]

I think this is not working too well with minerva's JavaScript.

Onhttps://en.m.wikipedia.org/wiki/Trolleybuses_in_Tours#Lines for example learn more link appears before rather than after the text (and is kind of useless since it just repeats the expanded text).

Page issues on mobile expect a certain markup outlined on Mw.org. Hopefully an easy fix? 🐸 Jdlrobson (talk) 21:31, 3 October 2025 (UTC)[reply]

@Jdlrobson {{cmbox}} is not (supposed to be) used in mainspace (the c stands for category). If there are issues, they are pre-existing there. Izno (talk) 21:51, 3 October 2025 (UTC)[reply]

Ok, this was a mis-translation use of {{images}} from French Wikipedia which is apparently something closer to {{multiple images}} there. IDK how you stumbled onto this use. It's the only use of cmbox in mainspace. Izno (talk) 21:58, 3 October 2025 (UTC)[reply]

Thanks for looking! I just looked at WhatLinksHere and picked the top article. I didn't realize it was the only one! I must confess I didn't look closely at your changes to determine if it was preexisting. 🐸 Jdlrobson (talk) 00:56, 4 October 2025 (UTC)[reply]

(edit conflict) The change made here is bringing it more into compliance with your mw:Recommendations for mobile friendly articles on Wikimedia wikis#Avoid tables for anything except data. 🙄 Anomie ⚔ 21:52, 3 October 2025 (UTC)[reply]

And as for certain markup, {{ambox}} which is supposed to be used in articles already has one task upstream about it. I suppose I'm glad you ran into this because it mostly firms up my feeling that what MF/Minerva/WikimediaMessages does with what it does desperately needs an overhaul even above the task or two out there. Izno (talk) 21:52, 3 October 2025 (UTC)[reply]

And specifically I had noted this issue with ambox though I hadn't yet written it down as being an issue. I'll go do at least that much. Izno (talk) 22:13, 3 October 2025 (UTC)[reply]

Now at Module:Message box/div/doc#Written. Izno (talk) 22:18, 3 October 2025 (UTC)[reply]

I assume "is planned" here means "is planned by you, Izno, who individually decided to fix it" — or is this orchestrated by the ægis of some larger and grander edifice? jp×g 🗯️ 11:08, 13 October 2025 (UTC)[reply]

If the former, then thanks: somebody's gotta do it. jp×g 🗯️ 11:09, 13 October 2025 (UTC)[reply]

The former. And it's already happened. I was going to do fmbox/imbox at the end of the last week but then time got away from me. Then I took a couple days away. Izno (talk) 16:45, 13 October 2025 (UTC)[reply]

Your nation thanks you for your service. 🫡 jp×g 🗯️ 00:56, 16 October 2025 (UTC)[reply]

The div version has 4 pixels shorter height than the table version. For example, Template:Maintenance category is 57.8 px high using table, but 53.8 px using div. Snævar (talk) 22:55, 15 October 2025 (UTC)[reply]

Yes, I noticed that too shortly after merging it, it's on account of browser default CSS being table { border-collapse: separate; border-spacing: 2px }. I came to the conclusion that there's no real reason to be pixel-perfect here—the only reasonable way to emulate it is to add additional padding, which is probably a few more lines of CSS. Izno (talk) 23:02, 15 October 2025 (UTC)[reply]

Well, it's not a few more lines, it's a gentle adjustment to what we have (bumping our mbox-image/text paddings by about 0.1em), but we probably still won't end up pixel perfect as that would require the use of calc() to add em widths and px widths. I have no great qualms adjusting the current CSS to support that if someone else thinks we should. Izno (talk) 04:34, 16 October 2025 (UTC)[reply]

Ok I did it anyway. Izno (talk) 01:02, 17 October 2025 (UTC)[reply]

fmbox migration

A change is occurring in how {{fmbox}} is implemented. It should help improve display at mobile resolutions now, and accessibility later. fmbox was chosen because it has lower reader-facing impact than most other message box types and it's fairly self-contained. (There is some other planning information in #CSS instead of tables.) (Previously, cmbox was done.)

You can expect some difference in styling from previous for a small period due to the job queue, after which it should return to "normal". You should be able to correct it manually if you want with one of the usual steps (purge, null edit, or dummy edit). If an issue with display persists, leave a comment here (this scenario may be possible with some unexpected setup fmboxes). Izno (talk) 21:19, 15 October 2025 (UTC)[reply]

Warnings for wrong mainspace use or something

Given this comment, I'm entertaining adding a configured warning which would display (and category with it) when a message box is in the mainspace and it shouldn't be. There are some recent changes that I'm going to have to chase down and/or revert to support that. Izno (talk) 21:12, 15 October 2025 (UTC)[reply]

imbox migration

A change is occurring in how {{imbox}} is implemented. It should help improve display at mobile resolutions now, and accessibility later. imbox was chosen third because it has lower reader-facing impact than most other message box types and it's fairly self-contained. (There is some other planning information in #CSS instead of tables.) (Previously, cmbox and fmbox were done.)

You can expect some difference in styling from previous for a small period due to the job queue, after which it should return to "normal". You should be able to correct it manually if you want with one of the usual steps (purge, null edit, or dummy edit). If an issue with display persists, leave a comment here (this scenario may be possible with some unexpected setup imboxes). This may also, but should not have, affected the already-migrated cmbox and fmbox, so if those also appear to have an issue, here is a good spot now. Izno (talk) 18:34, 19 October 2025 (UTC)[reply]