Design/Living style guide
This page is obsolete. It is being retained for archival purposes. It may document extensions or features that are obsolete and/or no longer supported. Do not rely on any information on this page. See Codex, the design system for Wikimedia instead. |
A living style guide offers improved documentation of the visual appearance and behaviour of a site.
Unlike a static style guide (say, a wiki page or PDF), it is generated on-the-fly from the actual HTML, CSS, and JavaScript used in production.[1][2]
This allows us to view styles as they are live on the site, and inline comments can be added to document the purpose of a particular style or set of styles.
MediaWiki's style guide can be found at https://design.wikimedia.org/style-guide/
Its source code is located in wikimedia/WikimediaUI-StyleGuide at GitHub.
When you use OOUI components within MediaWiki, they use its WikimediaUI theme which has its roots in mediawiki.UI.
Implementation edit
OOUI library live demos edit
This OOUI library features a live demo environment with all JS & PHP components and their JavaScript code snippets.
See also edit
- Tasks and bug reports in Wikimedia Phabricator
- Historical discussions to move to one single Design style guide: task T151117