First shot at porting Monobook to Vector. The only non-straightforward part is moving...

* No longer including rtl.css, instead relying on Janused main.css
* Renamed external.png to external-ltr.png so Janus will pick up on external-rtl.png (already exists)
* Added @embed to all images, add @noflip where needed (may not have covered all cases)
* Pulled some things from rtl.css into main.css such that they're no-ops in LTR but are needed in RTL. Example: body { direction:ltr;
* Killed some RTL-specific rules in main.css that were superseded in main.css
* Changed padding: 0 foo; to padding-right: foo; so it gets Janused right
* Commented out loading of IE*Fixes.css. Still need to incorporate these into main.css somehow

diff --git a/resources/Resources.php b/resources/Resources.php
index add824b..c08795b 100644 (file)
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -14,6 +14,14 @@ return array(
        'vector' => new ResourceLoaderFileModule(
                array( 'styles' => array( 'skins/vector/screen.css' => array( 'media' => 'screen' ) ) )
        ),
+       'monobook' => new ResourceLoaderFileModule(
+               array( 'styles' => array(
+                               'skins/monobook/main.css' => array( 'media' => 'screen' ),
+                               // Honor $wgHandheldStyle. This is kind of evil
+                               $GLOBALS['wgHandheldStyle'] => array( 'media' => 'handheld' )
+                       )
+               )
+       ),
        
        /* jQuery */
        

diff --git a/skins/MonoBook.php b/skins/MonoBook.php
index 6376635..60fc0f2 100644 (file)
--- a/skins/MonoBook.php
+++ b/skins/MonoBook.php
@@ -28,19 +28,16 @@ class SkinMonoBook extends SkinTemplate {
 
                parent::setupSkinUserCss( $out );
 
-               // Append to the default screen common & print styles...
-               $out->addStyle( 'monobook/main.css', 'screen' );
-               if( $wgHandheldStyle ) {
-                       // Currently in testing... try 'chick/main.css'
-                       $out->addStyle( $wgHandheldStyle, 'handheld' );
-               }
-
-               $out->addStyle( 'monobook/IE50Fixes.css', 'screen', 'lt IE 5.5000' );
-               $out->addStyle( 'monobook/IE55Fixes.css', 'screen', 'IE 5.5000' );
-               $out->addStyle( 'monobook/IE60Fixes.css', 'screen', 'IE 6' );
-               $out->addStyle( 'monobook/IE70Fixes.css', 'screen', 'IE 7' );
+               $out->addModuleStyles( 'monobook' );
+               
+               // TODO: Migrate all of these
+               //$out->addStyle( 'monobook/IE50Fixes.css', 'screen', 'lt IE 5.5000' );
+               //$out->addStyle( 'monobook/IE55Fixes.css', 'screen', 'IE 5.5000' );
+               //$out->addStyle( 'monobook/IE60Fixes.css', 'screen', 'IE 6' );
+               //$out->addStyle( 'monobook/IE70Fixes.css', 'screen', 'IE 7' );
 
-               $out->addStyle( 'monobook/rtl.css', 'screen', '', 'rtl' );
+               // TODO: migrate
+               //$out->addStyle( 'monobook/rtl.css', 'screen', '', 'rtl' );
 
        }
 }

diff --git a/skins/monobook/external-ltr.png b/skins/monobook/external-ltr.png
new file mode 100644 (file)
index 0000000..419c06f
Binary files /dev/null and b/skins/monobook/external-ltr.png differ

diff --git a/skins/monobook/external.png b/skins/monobook/external.png
deleted file mode 100644 (file)
index 419c06f..0000000
Binary files a/skins/monobook/external.png and /dev/null differ

diff --git a/skins/monobook/main.css b/skins/monobook/main.css
index b9e258e..ab73edb 100644 (file)
--- a/skins/monobook/main.css
+++ b/skins/monobook/main.css
@@ -41,10 +41,13 @@ div#content {
 
 body {
        font: x-small sans-serif;
+       /* @embed */
        background: #f9f9f9 url(headbg.jpg) 0 0 no-repeat;
        color: black;
        margin: 0;
        padding: 0;
+       direction: ltr; /* Needed for RTL flipping */
+       unicode-bidi: embed;
 }
 
 /* scale back up to a sane default */
@@ -143,6 +146,7 @@ ul {
        list-style-type: square;
        margin: .3em 0 0 1.5em;
        padding: 0;
+       /* @embed */
        list-style-image: url(bullet.gif);
 }
 ol {
@@ -376,6 +380,7 @@ table.small {
 }
 
 /* images */
+/* @noflip */
 div.floatright, table.floatright {
        clear: right;
        float: right;
@@ -388,6 +393,7 @@ div.floatright, table.floatright {
 */
 }
 div.floatright p { font-style: italic; }
+/* @noflip */
 div.floatleft, table.floatleft {
        float: left;
        clear: left;
@@ -436,11 +442,13 @@ div.magnify a, div.magnify img {
        border: none !important;
        background: none !important;
 }
+/* @noflip */
 div.tright {
        clear: right;
        float: right;
        border-width: .5em 0 .8em 1.4em;
 }
+/* @noflip */
 div.tleft {
        float: left;
        clear: left;
@@ -492,36 +500,38 @@ table.rimage {
 */
 #bodyContent a.external,
 #bodyContent a.external[href ^="gopher://"] {
-       background: url(external.png) center right no-repeat;
-       padding: 0 13px;
-}
-.rtl #bodyContent a.external,
-.rtl #bodyContent a.external[href ^="gopher://"] {
-       background-image: url(external-rtl.png);
+       /* @embed */
+       background: url(external-ltr.png) center right no-repeat;
+       padding-right: 13px;
 }
 #bodyContent a.external[href ^="https://"],
 .link-https {
+       /* @embed */
        background: url(lock_icon.gif) center right no-repeat;
-       padding: 0 16px;
+       padding-right: 16px;
 }
 #bodyContent a.external[href ^="mailto:"],
 .link-mailto {
+       /* @embed */
        background: url(mail_icon.gif) center right no-repeat;
-       padding: 0 18px;
+       padding-right: 18px;
 }
 #bodyContent a.external[href ^="news://"] {
+       /* @embed */
        background: url(news_icon.png) center right no-repeat;
-       padding: 0 18px;
+       padding-right: 18px;
 }
 #bodyContent a.external[href ^="ftp://"],
 .link-ftp {
+       /* @embed */
        background: url(file_icon.gif) center right no-repeat;
-       padding: 0 18px;
+       padding-right: 18px;
 }
 #bodyContent a.external[href ^="irc://"],
 .link-irc {
+       /* @embed */
        background: url(discussionitem_icon.gif) center right no-repeat;
-       padding: 0 18px;
+       padding-right: 18px;
 }
 #bodyContent a.external[href $=".ogg"], #bodyContent a.external[href $=".OGG"],
 #bodyContent a.external[href $=".mid"], #bodyContent a.external[href $=".MID"],
@@ -530,39 +540,26 @@ table.rimage {
 #bodyContent a.external[href $=".wav"], #bodyContent a.external[href $=".WAV"],
 #bodyContent a.external[href $=".wma"], #bodyContent a.external[href $=".WMA"],
 .link-audio {
+       /* @embed */
        background: url("audio.png") center right no-repeat;
-       padding: 0 13px;
+       padding-right: 13px;
 }
 #bodyContent a.external[href $=".ogm"], #bodyContent a.external[href $=".OGM"],
 #bodyContent a.external[href $=".avi"], #bodyContent a.external[href $=".AVI"],
 #bodyContent a.external[href $=".mpeg"], #bodyContent a.external[href $=".MPEG"],
 #bodyContent a.external[href $=".mpg"], #bodyContent a.external[href $=".MPG"],
 .link-video {
+       /* @embed */
        background: url("video.png") center right no-repeat;
-       padding: 0 13px;
+       padding-right: 13px;
 }
 #bodyContent a.external[href $=".pdf"], #bodyContent a.external[href $=".PDF"],
 #bodyContent a.external[href *=".pdf#"], #bodyContent a.external[href *=".PDF#"],
 #bodyContent a.external[href *=".pdf?"], #bodyContent a.external[href *=".PDF?"],
 .link-document {
+       /* @embed */
        background: url("document.png") center right no-repeat;
-       padding: 0 12px;
-}
-
-/* for rtl wikis */
-.rtl #bodyContent a.external {
-       background-position: left;
-       padding-right: 0;
-}
-.rtl a.feedlink {
-       background-position: right;
-       padding-right: 16px;
-       padding-left: 0;
-}
-
-/* correction for ltr wikis */
-.ltr #bodyContent a.external {
-       padding-left: 0;
+       padding-right: 12px;
 }
 
 /* disable interwiki styling */
@@ -588,6 +585,15 @@ table.rimage {
        width: 11.6em;
        overflow: hidden;
 }
+html > body .portlet {
+       float: left;
+       clear: left;
+}
+/* recover IEMac (might be fine with the float, but usually it's close to IE */
+*>body .portlet {
+       float: none;
+       clear: none;
+}
 .portlet h4 {
        font-size: 95%;
        font-weight: normal;
@@ -633,6 +639,7 @@ table.rimage {
 .portlet ul {
        line-height: 1.5em;
        list-style-type: square;
+       /* @embed */
        list-style-image: url(bullet.gif);
        font-size: 95%;
 }
@@ -769,6 +776,7 @@ in bg url to hide it from iemac */
 li#pt-userpage,
 li#pt-anonuserpage,
 li#pt-login {
+       /* @embed */
        background: url(user.gif) top left no-repeat;
        padding-left: 20px;
        text-transform: none;
@@ -1023,10 +1031,6 @@ div#userlogin form#userlogin2 {
        background-color: #f9f9f9;
        float: left;
 }
-.rtl div#userloginForm form,
-.rtl div#userlogin form#userlogin2 {
-       float: right;
-}
 
 div#userloginForm table,
 div#userlogin form#userlogin2 table {