OOUI

OOUI allows developers to create responsive web user-interfaces and applications.

It is internationalization ready with full support of right-to-left languages, is accessible complying to Web Content Accessibility Guidelines and operates consistently across a multitude of browsers.

The OOUI library contains:


 * ready-to-use widgets, layouts, and windows that can be instantiated directly or easily extended,


 * a PHP server-side compatible output for cases where JavaScript is not supported,


 * elements that can be easily mixed and matched to create custom user interfaces.

OOUI is available in core>Core|MediaWiki Core, as well as on [https://www.npmjs.com/package/oojs-ui npm], [https://packagist.org/packages/oojs/oojs-ui Composer], and through [https://cdnjs.com/libraries/oojs-ui cdnjs]. OOUI implements a "wui>Wikimedia User Interface|WikimediaUI" theme – conforming to [https://design.wikimedia.org/style-guide/ Wikimedia Foundation's design style guide]. Interfaces built within MediaWiki use this theme by default, though different MediaWiki skins usetheme>OOUI/Using OOUI in MediaWiki#Using themes|can and do over-ride this. See oouimw>OOUI/Using OOUI in MediaWiki|documentation about using OOUI in MediaWiki. It is successfully in use in 40+ web products by Wikimedia Foundation and volunteer developers. Note, that the library was originally created for entire user interface of VisualEditor, on top of the OOjs primer (Object-Oriented JavaScript, hence OOUI's former name "OOjs UI"). It has later been extended to serve MediaWiki Core with PHP implemented widgets or responsive interfaces in project Advanced Mobile Contributions.

geoojsui>git:oojs/ui/|The source code is hosted on gerrittutorial>Gerrit/Tutorial|Gerrit and [https://github.com/wikimedia/oojs-ui mirrored on GitHub].

Documentation
See the sidebar for a full list of documentation subpages.

See also:


 * [<tvar|api>https://doc.wikimedia.org/oojs-ui/master/js/</> API documentation] generated from the source code on doc.wikimedia.org


 * [<tvar|demo>https://doc.wikimedia.org/oojs-ui/master/demos/</> Interactive demos online] and in the project's <tvar|1> </> directory


 * [<tvar|tut>https://doc.wikimedia.org/oojs-ui/master/demos/tutorials/index.html</> A tutorial on building a Todo list application using OOUI step by step]