Jump to: navigation, search

A mediawiki theme built for the tolabaki hackerspace. Based on the strapping theme. Uses bootstrap extensively. You can use it now by setting your theme as labstrap in your appearance preferences. Note that this is still very much work in progress and things might look strange and/or break. Please send your feedback to saloni.

Code and Building[edit]

The code is hosted on code.tolabaki.gr.

Dependencies[edit]

  • Node.js
  • npm
  • grunt-cli

Build[edit]

Run npm install to install the node modules needed to build labstrap

  • run grunt or grunt dist-mediawiki to build labstrap inside the dist-mediawiki folder
  • run grunt dist-bootstrap to build a standalone bootstrap redistributable using labstrap inside the dist-bootstrap folder

Other build targets[edit]

  • watch watches labstrap php scripts, less stylesheets and javascript scripts for modifications and runs the applicable build targets
  • clean cleans up dist-mediawiki and dist-bootstrap

Known issues[edit]

  • Search autocompletion works but not as good as with the vector theme + vector extensions. See this for more details. (mediawiki upgraded to v1.23.0)
  • Tables styled with .wikitable look a little alien. A workaround is to replace the .wikitable class with bootstrap table classes (ex. .table, .table-striped, .table-bordered) and remove border="1". Aside from being a pain it also breaks (visual) compatibility with the other themes
  • Some wiki elements (buttons, textboxes etc.) might still not be properly styled
  • Pages that may need a custom layout (such as then main page) need to include a div with class .labstrap_custom_layout
  • Some responsive elements need tweaking
  • LESS stylesheets need some renaming and/or reorganization

Layout Mockups
[edit]


Got the theme i liked most and changed colors. Sorry my text keeps floating all wrong, can't find how to make the image's attribute block! magstina (talk)

Mock up v3.png


Thoughts on the UI[edit]

  • Move toolbox from the article header to the space next to the user menu (upper right corner)

bibe

  • Create a History button next to the Edit button (like MDN)
Mdn history button.png