Talk:Recommendations for night mode compatibility on Wikimedia wikis

User perspective (not an editor)

Jdlrobson. Examples have already been provided on the tickets you’ve closed. I also asked if you’d be open to a quick teams/zoom call. You unsubscribed from the ticket you closed so not sure if you even saw the responses I tagged you on right before Ijm8710 (talk) 17:19, 5 October 2023 (UTC)

Hi @Ijm8710 thanks for writing here. Firstly I have nothing to do with the apps team, so lack the context of the bug report or the bugs you've experienced previously. I work on web products, with my main focus being the Minerva and Vector skins. Since articles change, many of the examples I found in the task are outdated. It would be helpful for you to provide me some recent examples so I can see what we can do there. The purpose of this page is to gather and evolve best practices with community members in the editor community (@Izno I want to note you may have different opinions from me on where the boundaries lie and I want to make clear that's expected and the aim is consensus building).

Apologies if this is a little technical: but since you identify as a non-editor you may not be aware of the unusual relationship between software and content - content and its styles tend to be managed on wiki and the chrome (the menus etc) by software maintainers, because of this it can be challenging to agree to specific solutions and sometimes impossible to fix things without the two groups together in conversation or without adding significant technical debt (something I'm trying to remedy with this page). Jdlrobson (talk) 17:44, 5 October 2023 (UTC)

I’ll provide a subset of examples in the next few days but I just want to make sure I’m not wasting my time. I did all this aggregation quite a few times only for it to go nowhere. I understand how you note you’re more on the web side rather than the app side but it sounds like you want to approach them in unison. I don’t expect the fixes to take days but if I put in the work to aggregate examples, is it realistic to hit on some of the bigger templates (the ones that affect huge bulks of athletes/episode pages) within the end of this calendar year?

and regarding the question I’ve raised several times over the years, is there not a way to use darkness of background to dictate text color being applied as white or black. Obviously I’m over simplifying it but atleast to some degree I just can’t fathom why that can’t provide at least a better start.

are you or whomever is most responsible for this issue open to a zoom/teams meet. Can be quick (say 15 minutes)

lastly, being that I’ve never really used talk pages, is there a way to get alerted to replies in the same way I can for phabricators I’m tagged on. This is the main reason I was hesitant to move from there Ijm8710 (talk) 17:58, 5 October 2023 (UTC)

@Ijm8710: Yes, just press the Subscribe button below the topic header (next to the topic header on desktop) to get notifications about replies in the given topic. (Unlike Phabricator, it’s not public who’s subscribed, and one cannot subscribe or unsubscribe others.) You can configure in your notification preferences whether you want to get email and/or web (little drawer icon at the top of the page) notifications. —Tacsipacsi (talk) 12:47, 6 October 2023 (UTC)

Also one other question. Is there someone who is the main pm from the apps perspective? Jmimor and seddon seem to be in that capacity potentially. I’ve got sssurances from seddon a bit ago he was working on this. Was disappointing to find we’re starting anew. Curious who is essentially the lead for the apps-specifically ios for me being of interest Ijm8710 (talk) 18:02, 5 October 2023 (UTC)

Hi @Ijm8710, thank you for all of the energy and effort you've put into sharing your thoughts. I'm Jaz, the Product Manager (PM) for the apps. For context, I was the Product Manager on Android, and in the last few months became the Lead PM for both apps. Jminor is no longer with the Foundation. Seddon is the Engineering Manager for the apps and was managing some of the Dark Mode work on apps when we had engineering contractor resources dedicated to fixing some of that work, so he was pretty in the weeds on the issues with dark mode during that time. The contractor's work with the Foundation unfortunately ended in the summer. I want to fully acknowledge that just because the contract work ended, it doesn't mean all of the issues with dark mode on apps are resolved. It just means we do not at present have engineering resources specifically dedicated to this problem area on the apps. We certainly should have communicated with you why the tickets became inactive. I agree with you the ticket that was closed, should be open because the issue is not resolved. I will fix that today.

Now I am still catching up on everything you've previously suggested to remedy some of the dark mode issues. I do not want you to have to repeat yourself in several places and I want to have appropriate context. While I appreciate you've waited a while for a response, I'd appreciate a bit more grace as I fully catch up. I will provide a full response based on what you've historically shared by the end of next week.

In the meantime, there are some more immediate things that I can share. First, we will have office hours the 27th of October at 5 p.m. UTC. Seddon and I will both be in attendance. I hope you can make it, I agree there is nothing like synchronous communication. You can see the full details of our office hours and see what other topics people have suggested that we cover during that time on our Office Hours MediaWiki page. I will ensure dark mode is a topic we prioritize during office hours if you join. I am also tagging @ARamadan-WMF, our community relations specialist, so that she can follow this conversation and ensure you're subscribed to our team newsletter. I saw that you are keen on updates from our team, that is one of the structured places we share them. If I am ever slow to respond because I am out of office, slammed with meetings, or at an event, please reach out to her. I am also tagging @OVasileva (WMF), she is the Product Manager for the Web team and responsible for all things related to Desktop and Mobile Web. She is the driver of the dark mode effort for our organization's Annual Plan this year, some of which may have implications for the apps and some of which do not. @Jdlrobson is an engineer on the Web team alongside Olga and he is essentially just trying to make sense of the cross platform issues of dark mode since they are starting this work based on the organization's annual plan. He recently started drafting documentation based on various issue areas and possible approaches, which is what you see here. Our annual plan is what drives what gets prioritized by the organization in a given year and what does not. It may be helpful to give it a read to get an idea of the focus areas this year. Also, Olga can share more about how they are thinking about dark mode on Web in regards to that Annual Plan, as well as other accessibility changes they are planning. She can also share how you can stay informed with their team's work holistically so that you may be able to weigh in as they make decisions that impact readers. Again, depending on their approach and capacity, their work could have implications for the apps or not touch it at all, nothing has been officially decided when it comes to an approach.

Once I have a chance to catch up on what you've previously shared and sync with Seddon, Olga, and Jon, I will check back in here next week.

Thanks again for your patience! JTanner (WMF) (talk) 16:15, 6 October 2023 (UTC)

@Ijm8710 Thank you again for your patience as I gained context on your previous requests and concerns.I see you have a suggestion of changing the way we do search on apps. I will have @ARamadan-WMF break this out as a specific task so that we can discuss it as a team and have it triaged. We will have you subscribed so you can track the discussion.

Regarding the readability issues, all of the issues you identified is work that would have to be prioritized by the Content Transform team or MediaWiki Platform team. You can get a glimpse into the Content Transform Team's current work here. As I mentioned earlier, Seddon temporarily had engineering support for fixes at a PCS layer; that responsibility now rests with those teams. I can imagine that is a disappointing answer. I do not want your concerns to fall by the waste side, so I will ensure the PMs of those teams aware of this situation. However, I do want to highlight the time it would take for them to adhoc fix each issue and edge case (which is the approach we had when you first reached out) could actually be fixed systemically with the work theWeb team is planning to do. As they firm up their approach within the next few weeks, that will become clearer. I would wager that the outcome of the conversation amongst teams will be to wait for the Web team’s work, which is scheduled to happen this fiscal year (released by July 2024). Actually, any adhoc fixes done by Content Transform or the MediaWiki Platform team, could potentially be undone with the work the Web team is planning to do.

JTanner (WMF) (talk) 21:26, 26 October 2023 (UTC)

Hello all,

The mentioned suggestion now is on this ticket T350574.

I also added you, @Ijm8710, as a subscriber. ARamadan-WMF (talk) 11:46, 6 November 2023 (UTC)

Hello @Ijm8710!

I am Amal, the Community Relations Specialist supporting the apps team; I wanted to extend a warm welcome to you.

Feel free to reach out for any future communications or questions you may have. You can also subscribe to our newsletter to stay updated with our team's latest developments.

We would love to have you join us at our next office hour as Jazmin explained, scheduled for the 27th of October. It's a great opportunity for synchronous communication.

Looking forward to connecting with you further!

ARamadan-WMF (talk) 16:10, 10 October 2023 (UTC)

mw-no-invert and notheme

This has come up in a few discussions I've had so far around dark mode, most recently with User:Izno. These 2 classes seem similar but are subtly different given the different approaches used by apps and gadgets.

We plan to introduce dark mode to web and hope to resolve this in future as we evolve the draft of this page. This may mean removing the need for these classes, or standardizing on a more common and descriptive class.

At time of writing, the web mode is likely to use CSS variables, which will avoid the need for the inline style rewriting done in apps and the imperfect inverting of gadgets so it's possible the recommendations will change in future. Jdlrobson (talk) 17:23, 5 October 2023 (UTC)

See also T345281, which also introduces mw-invert. ESanders (WMF) (talk) 10:35, 21 October 2023 (UTC)

Night = B&W?

Great to see some of these recs and examples of template-specific css.

• Could you add a list of skin-provided classes with their own light/dark-theme colors?
• The examples in T352462 are fully black-and-white; is that the aim of night mode?

Sj (talk) 00:26, 11 December 2023 (UTC)

We are still in the research phase and no decisions have been made yet.

The recommendations here currently cater for the gadget and mobile apps. It is likely to evolve once we make a decision around how to build this in web.

Questions and concerns relating to that research are very much welcome on our Phabricator tickets! Jdlrobson (talk) 06:33, 13 December 2023 (UTC)

CSS variable to set background color without setting text color

I’ve updated a default gadget on huwiki to use --background-color-error-subtle to set the background color of disambiguation page links. I haven’t set a text color because I want the links to use the default link color, whichever that may be (#36c on Vector 2022, #0645ad on Vector 2010, #236 on Cologne Blue etc.). Is using a CSS variable enough, or does Recommendations for night mode compatibility on Wikimedia wikis#Always define color when defining background still apply? —Tacsipacsi (talk) 19:53, 13 March 2024 (UTC)

Hey @Tacsipacsi yes that's enough. This actually follows the other guideline at use CSS variables or CSS design tokens where possible.

Does this edit clarify things or can you suggest a better edit?

Thanks for making a start to Hungarian Wikipedia's dark mode preparations! Much appreciated! Jdlrobson (talk) 22:36, 15 March 2024 (UTC)

@Jdlrobson: Thanks for the edit! Yes, the current version is clear. In the previous one, it wasn’t clear to me whether the two sections have an and or an or connection. —Tacsipacsi (talk) 00:58, 16 March 2024 (UTC)

Nesting or :is selector for the good

Had my stab at night mode support in a template. It was not terrible, but could be better :). It would help to be able to take some shortcuts with new CSS features.

So CSS Nesting made it to browsers in early 2023 and also nesting is part of Baseline 2023, sadly not part of Windows 7 which was abandoned before that... So, you might want to check the stats for Windows 7, I guess, but also, I think dark mode is something Windows 7 users can live without ;).

Another great feature to support would be the :is selector (part of a much larger Baseline). So, for example, instead of two or more lines, I could just use one selector:

/* old, boring tedious ;) */
html.skin-theme-clientpref-os .tpl-polska .NavToggle::before,
html.skin-theme-clientpref-os .tpl-polska .NavToggle::after,
html.skin-theme-clientpref-os .tpl-polska .NavHead {
	background-color: black;
	color: white;
}
/* :is */
html.skin-theme-clientpref-os .tpl-polska :is(.NavToggle::before, .NavToggle::after, .NavHead) {
	background-color: black;
	color: white;
}
/* nesting */
html.skin-theme-clientpref-os .tpl-polska {
	.NavToggle::before, .NavToggle::after, .NavHead
	{
		background-color: black;
		color: white;
	}
}

I know this would require non-trivial changes to CSS sanitization and TemplateStyles, I think CSS nesting would be hard, but having these features would help a lot in migrating to night mode. Maybe you could bump priority on any of this? Nux (talk) 22:55, 21 March 2024 (UTC)

There is a conversation going on about dropping IE11 support which I think would help this cause :-)

Thanks for the hint! I think this is also something French Wikipedia have been doing are considering browser support as part of those changes? https://fr.wikipedia.org/wiki/MediaWiki:Gadget-Mobile.css#L-157 Jdlrobson (talk) 03:48, 23 March 2024 (UTC)

Invert or Not API

See https://phabricator.wikimedia.org/T26070#9667442 for details of an available API for deciding whether or not to invert an image. The current and proposed tools might want to take advantage of or host such a service. Sj (talk) 22:21, 31 March 2024 (UTC)