Last modified: 2014-04-22 03:08:15 UTC
This may be a duplicate bug, but it seems that what both the design team and Jon R. seem to want is a design pattern library. This would include high-level categorization of user interface elements (buttons, text inputs, tabs, etc.) and each example in a particular section would include sample PHP code, sample HTML code, and sample CSS (or LESS).
(In reply to comment #0) > This may be a duplicate bug, but it seems that what both the design team and > Jon R. seem to want is a design pattern library. This would include > high-level > categorization of user interface elements (buttons, text inputs, tabs, etc.) > and each example in a particular section would include sample PHP code, > sample > HTML code, and sample CSS (or LESS). Yep, that is basically the high level ask. This could perhaps be a tracking bug. There are already some semblances of this floating around, in mediawiki.ui, jquery.ui and other places. So it's mostly a lot of standardization work, not just creating new stuff to replace a vacuum. Hence [[mw:UX standardization]]
Marking this as "ASSIGNED" as it's not great to say "Assigned to: Nobody - You can work on this!" when it's under development.
Update: we use KSS to generate a living style guide from MediaWiki's CSS and LESS files; see http://tools.wmflabs.org/styleguide/ We also use jsduck to generate documentation from MediaWiki's JavaScript that can include live example code; see e.g. https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/mw.Message and click 'Live Preview' We also have bits of HTML in docs/uidesign that are accessible in a simple MW configuration, e.g. https://wikitech.wikimedia.org/w/docs/uidesign/table-layout.html All these have the limitation that the HTML isn't part of a MediaWiki page, so you can't see how it changes with skin, language, or Beta Features. => Someone could develop MediaWiki special page(s) that frame their HTML For PHP code we have * Sample code on mediawiki.org , e.g. https://www.mediawiki.org/wiki/HTMLForm#Example_usage * Various samples in extensions/example These do support skin/language/Beta Features, => Someone could package the samples relevant to design with a TOC. https://doc.wikimedia.org could become a MediaWiki instance with these features pages enabled.
This is partly completed as the Living Style Guide (https://git.wikimedia.org/tree/mediawiki%2Fcore.git/10c122ac5440782bda87a65a75db7efe7b28a415/docs%2Fkss). The next step is to get it uploaded to doc.wikimedia.org automatically (bug 64221). I'll make this bug a tracking bug. I'm not sure if there's anything else we want to get done before marking this fixed (e.g. maybe use jsduck Live Preview for any JS controls that are covered by the style guide)