Extension:Agora

The Agora extension adds skin-agnostic CSS styles to MediaWiki, following the Wikimedia Foundation Design principles. The CSS defines various mw-ui-* classes including
 * with many variations
 * for a container with a vertical "stacked" layout
 * several utility classes such as

Its test subdirectory has some static HTML pages illustrating their use.

Also in 1.22 core
If sticks, the same CSS will be available in core MediaWiki in release 1.22 in the mediawiki.ui module, and you don't need this extension. You can use context to ensure the CSS is loaded.

Installation
Consult its README file to decide how to enable the extension in pages on your wiki and set its globals accordingly in LocalSettings.php

Verifying the installation
On a page where the extension should provide its CSS according to your configuration, create a submit button and give it the styles 'mw-ui-button blue'.

To see if the extension is sent down on the current page, in a browser console enter mw.loader.state( 'ext.agora.base' ) ; it should return "ready".

Compass
The extension's CSS was generated from Sass .sccs files using Compass. You don't need Compass to use the CSS files in modules/css.