Page MenuHomePhabricator

Restyle Quiz Extension in favor of a WikimediaUi-like design
Open, MediumPublic

Description

It would be cool if we could restyle this extension to look like a modern Mediawiki extension.

Colors and UI elements should match as match as possible the WikimediaUI Style Guide.

It may be a bit overkill to use OOjs UI but it is a point to discuss.

Event Timeline

I did some research. Since the page is mostly rendered server-side we should use either OOjs UI (via PHP) or MediaWikiUI (via CSS classes and HTML).

It is very hard to find documentation for MediaWikiUI (most of it is outdated and the version marked as current are not complete with examples), that's why the previous link uses Internet Archive, and even that one does not fully work.

I did some testing with OOjs UI (PHP), and it works fine. The only problem is that it would make less effective the purpose of T152293, some UI elements would need to be generated inside the PHP (programmatically, so no more raw HTML) and not in the mustache file anymore, which would become only useful for implementing the general layout (which is still an improvent about the current state of the extension).

It is also worth noting that in a version of the LivingStyleGuide (https://livingstyleguide.wmflabs.org/wiki/Buttons) it is shown that it is possible to generate rich UI elements inside mustache files. But no explanation or example on how to setup that feature is provided.

Should we maybe get in touch with the design group and ask for some guidance?

Mvolz triaged this task as Medium priority.Jun 19 2017, 2:02 PM