'common/commonElements.css' => array( 'media' => 'screen' ),
'common/commonContent.css' => array( 'media' => 'screen' ),
'common/commonInterface.css' => array( 'media' => 'screen' ),
- 'vector/screen.less' => array( 'media' => 'screen' ),
- 'vector/externalLinks.less' => array( 'media' => 'screen' ),
- 'vector/screen-hd.css' => array( 'media' => 'screen and (min-width: 982px)' ),
+ 'vector/styles.less',
+ ),
+ 'remoteBasePath' => $GLOBALS['wgStylePath'],
+ 'localBasePath' => $GLOBALS['wgStyleDirectory'],
+ ),
+ 'skins.vector.beta' => array(
+ // Keep in sync with skins.vector
+ 'styles' => array(
+ 'common/commonElements.css' => array( 'media' => 'screen' ),
+ 'common/commonContent.css' => array( 'media' => 'screen' ),
+ 'common/commonInterface.css' => array( 'media' => 'screen' ),
+ 'vector/styles-beta.less' => array( 'media' => 'screen' ),
),
'remoteBasePath' => $GLOBALS['wgStylePath'],
'localBasePath' => $GLOBALS['wgStyleDirectory'],
'localBasePath' => $GLOBALS['wgStyleDirectory'],
),
'skins.vector.collapsibleNav' => array(
- 'styles' => array(
- 'vector/collapsibleNav.less',
- ),
'scripts' => array(
'vector/collapsibleNav.js',
),
),
'jquery.byteLength' => array(
'scripts' => 'resources/jquery/jquery.byteLength.js',
+ 'targets' => array( 'desktop', 'mobile' ),
),
'jquery.byteLimit' => array(
'scripts' => 'resources/jquery/jquery.byteLimit.js',
'mediawiki.inspect' => array(
'scripts' => 'resources/mediawiki/mediawiki.inspect.js',
'dependencies' => 'jquery.byteLength',
+ 'targets' => array( 'desktop', 'mobile' ),
),
'mediawiki.feedback' => array(
'scripts' => 'resources/mediawiki/mediawiki.feedback.js',
/*
* Any rules which should not be flipped automatically in right-to-left situations should be
- * prepended with @noflip in a comment block. Images that should be embedded as base64 data-URLs
- * should be prepended with @embed in a comment block.
+ * prepended with @noflip in a comment block.
*
- * This style-sheet employs a few CSS trick to accomplish compatibility with a wide range of web
+ * This stylesheet employs a few CSS trick to accomplish compatibility with a wide range of web
* browsers. The most common trick is to use some styles in IE6 only. This is accomplished by using
* a rule that makes things work in IE6, and then following it with a rule that begins with
* "html > body" or use a child selector ">", which is ignored by IE6 because it does not support
* the child selector. You can spot this by looking for the "OVERRIDDEN BY COMPLIANT BROWSERS" and
* "IGNORED BY IE6" comments.
*/
-@import "mediawiki.mixins.less";
+@import "mediawiki.mixins";
/* Framework */
+ html {
+ font-size: @html-font-size;
+ }
html,
body {
height: 100%;
margin: 0;
padding: 0;
- font-family: sans-serif;
- font-size: 1em;
+ font-family: @content-font-family;
}
body {
background-color: #f6f6f6;
+ font-size: @body-font-size;
}
/* Content */
div#content {
+ line-height: @content-line-height;
margin-left: 10em;
- padding: 1em;
+ padding: @content-padding;
/* Border on top, left, and bottom side */
border: 1px solid #a7d7f9;
border-right-width: 0;
/* Merge the border with tabs' one (in their background image) */
margin-top: -1px;
background-color: white;
- color: black;
+ color: @body-font-color;
direction: ltr;
}
/* Hide, but keep accessible for screen-readers */
#p-personal li {
margin-left: 0.75em;
margin-top: 0.5em;
- font-size: 0.75em;
+ font-size: @menu-personal-font-size;
white-space: nowrap;
}
/* Navigation Containers */
height: 1.9em;
padding-left: 0.5em;
padding-right: 0.5em;
- color: #0645ad;
+ color: @menu-link-color;
cursor: pointer;
font-size: 0.8em;
}
display: inline-block;
padding: 0.5em;
white-space: nowrap;
- color: #0645ad;
+ color: @menu-link-color;
cursor: pointer;
font-size: 0.8em;
}
}
/* Panel */
div#mw-panel {
+ font-size: @menu-main-font-size;
position: absolute;
top: 160px;
padding-top: 1em;
div#mw-panel div.portal h3 {
font-weight: normal;
color: #444;
- padding: 0.25em;
- padding-top: 0;
- padding-left: 1.75em;
+ padding: @menu-main-heading-padding;
cursor: default;
border: none;
- font-size: 0.75em;
+ font-size: @menu-main-heading-font-size;
}
div#mw-panel div.portal div.body {
- margin: 0;
padding-top: 0.5em;
- margin-left: 1.25em;
+ margin: @menu-main-body-margin;
+
.background-image('images/portal-break.png');
background-repeat: no-repeat;
background-position: top left;
div#mw-panel div.portal div.body ul {
list-style-type: none;
list-style-image: none;
- padding: 0;
+ padding: @menu-main-body-padding;
margin: 0;
}
div#mw-panel div.portal div.body ul li {
padding: 0;
padding-bottom: 0.5em;
margin: 0;
- font-size: 0.75em;
+ font-size: @menu-main-body-font-size;
word-wrap: break-word;
}
div#mw-panel div.portal div.body ul li a {
- color: #0645ad;
- }
- div#mw-panel div.portal div.body ul li a:visited {
- color: #0b0080;
+ color: @menu-main-body-link-color;
+ &:visited {
+ color: @menu-main-body-link-visited-color;
+ }
}
+
/* Footer */
div#footer {
margin-left: 10em;
#preftoc a:active {
display: inline-block;
position: relative;
- color: #0645ad;
+ color: @menu-link-color;
padding: 0.5em;
text-decoration: none;
background-image: none;
margin-right: 0.25em;
}
- /**
- * The following code is slightly modified from monobook
- */
- div#content {
- line-height: 1.5em;
- }
- #bodyContent {
- font-size: 0.8em;
- }
-
ul {
list-style-type: disc;
.list-style-image('images/bullet-icon.png');
#firstHeading {
padding-top: 0;
margin-top: 0;
- font-size: 1.6em;
+ font-size: @content-heading-font-size;
}
/* Icon for Usernames */
#bodyContent {
position: relative;
width: 100%;
- }
- div#bodyContent {
- line-height: 1.5em;
+
+ // FIXME: Seems overly specific. Not sure why this is needed.
+ &div {
+ line-height: 1.5em;
+ font-size: @content-font-size;
+ }
}
/* mediawiki.notification */
div#content,
div#footer,
#left-navigation {
- .transition( margin-left 250ms, padding 250ms; );
+ .transition(margin-left 250ms, padding 250ms;);
}
+
#p-logo {
- .transition( left 250ms );
+ .transition(left 250ms);
}
+
#mw-panel {
- .transition( padding-right 250ms );
+ .transition(padding-right 250ms);
}
+
#p-search {
- .transition( margin-right 250ms );
+ .transition(margin-right 250ms);
}
+
#p-personal {
- .transition( right 250ms );
+ .transition(right 250ms);
}
+
#mw-head-base {
- .transition( margin-left 250ms );
+ .transition(margin-left 250ms);
}
}