Add CSS class .mw-code (matching <pre>)
authorTimo Tijhof <ttijhof@wikimedia.org>
Sat, 14 Apr 2012 03:23:16 +0000 (05:23 +0200)
committerTimo Tijhof <ttijhof@wikimedia.org>
Wed, 9 May 2012 14:38:36 +0000 (16:38 +0200)
commit7c9b2273c9cbdae90c9f4e3890a13619f769c5d0
treea3857ae036413ab7553cbbdcd81a93245a15ed25
parent26eae98f7f7fc543088c2a36d070687571ab89b6
Add CSS class .mw-code (matching <pre>)

- Add CSS class .mw-code.
  All skins that stye <pre> now also style .mw-code.
  This is because there are situations where a <pre> element is not
  allowed (e.g. when the child code contains <div>) by Tidy and W3C, but
  should still be styled as such.

- Required for fixing bug 19416 and bug 35875.
  SyntaxHighlighter Geshi has it's own custom markup that can't be relied on
  for both consistency (it can change over time) and due to its own
  over "!important"-ized css reset on it's own classes, so although it
  (sometimes!) does use a <pre>, that <pre> is completely reset so the skins
  css doesn't (and frankly shouldn't) apply to that.

  Up until last year this extension wrapped all of Geshi's internal output in
  a <div class="mw-geshi" />. Leaving all wmf wikis to have to create a hack
  in their local css (for every skins!) to reproduce the skins's <pre> style
  on .mw-geshi.

  Previously this was attempted to be fixed inside Geshi itself by wrapping
  all of Geshi's internal output in a <PRE class="mw-geshi"> instead of a
  <DIV class="mw-geshi">. That worked fine because that element didn't have
  any of geshi's internal classes on it so it was outside the scope of the
  reset and the skins' css applied fine.

  However when Tidy is enabled this got messed up badly and (part) of the
  Geshi output was ripped out of the containing <pre> by Tidy because the W3C
  doesn't allow a <div> to be inside a <pre>.

  Now fixed in a different way by instead providing a css class in all skins
  that when given to any element will give it the same styling that it does
  to <pre>. Separation of content and styling.

  Tested in all core skins, works great. The style of the geshi output is
  preserved and the container looks like any other <pre> in that skin.

Change-Id: I4ff5d0197ba8dc0dad3cafd03f2b120bc22e75cb
skins/chick/main.css
skins/cologneblue/screen.css
skins/common/commonElements.css
skins/common/commonPrint.css
skins/modern/main.css
skins/monobook/main.css
skins/simple/main.css
skins/vector/screen.css