Phuedx has uploaded a new change for review. https://gerrit.wikimedia.org/r/188813
Change subject: Promote alpha page styles to beta ...................................................................... Promote alpha page styles to beta Additionally: * update edit and watch icons * promote Wikidata page description to beta * change the Wikidata description font size to 13 pt * promote the BannerImage module to beta * if it is large enough, then move the banner image up by one fifth of its height Change-Id: I00ee006ba67e8a5974799bde1f502f421048f8e1 --- A images/icons/beta/edit.svg A images/icons/beta/editLocked.svg A images/icons/beta/watch.svg A images/icons/beta/watched.svg M includes/Resources.php M includes/skins/SkinMinervaAlpha.php M includes/skins/SkinMinervaBeta.php M javascripts/modules/bannerImage/BannerImage.js M javascripts/modules/bannerImage/init.js R less/content/links.beta.less R less/footer.beta.less M less/modules/bannerImage.less R less/pageactions.beta.less 13 files changed, 113 insertions(+), 45 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend refs/changes/13/188813/1 diff --git a/images/icons/beta/edit.svg b/images/icons/beta/edit.svg new file mode 100644 index 0000000..e21a14e --- /dev/null +++ b/images/icons/beta/edit.svg @@ -0,0 +1,12 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";> +<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org/1999/xlink"; x="0px" y="0px" + viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"> +<g id="Layer_2"> +</g> +<g id="Layer_3"> + <path fill="#676767" d="M16.1,2L1.2,16.8L0,23l6.2-1.2L21,6.9C21,4.4,18.5,2,16.1,2z M4,18.7c-0.4-0.4-0.9-0.7-1.2-1 + c2.8-2.8,14-14.1,14-14.1c0.5,0.1,0.9,0.4,1.2,0.9L4,18.7z"/> +</g> +</svg> diff --git a/images/icons/beta/editLocked.svg b/images/icons/beta/editLocked.svg new file mode 100644 index 0000000..24032bc --- /dev/null +++ b/images/icons/beta/editLocked.svg @@ -0,0 +1,16 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";> +<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org/1999/xlink"; x="0px" y="0px" + viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"> +<g id="Layer_2"> +</g> +<g id="Layer_2_1_"> + <g> + <path fill="#999999" d="M20.7,4.6V3.5c0,0,0-3.5-3.5-3.5s-3.5,3.5-3.5,3.5v1.2h-1.2v6.9h9.2V4.6H20.7z M19,4.6h-3.5V3.5 + c0,0,0-1.7,1.7-1.7C19,1.7,19,3.5,19,3.5V4.6z"/> + <path fill="#999999" d="M11.5,11.1l-7.8,8c-0.3-0.3-0.8-0.7-1.2-0.9c1.6-1.6,5.8-5.8,9-9.1V6.9L1.2,17.3L0,23l5.8-1.1l9.2-9.2 + h-3.5V11.1z"/> + </g> +</g> +</svg> diff --git a/images/icons/beta/watch.svg b/images/icons/beta/watch.svg new file mode 100644 index 0000000..f088d9d --- /dev/null +++ b/images/icons/beta/watch.svg @@ -0,0 +1,8 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";> +<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org/1999/xlink"; x="0px" y="0px" + viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"> +<path fill="#666666" d="M11.5,5.5l2.2,4.6l5.1,0.6l-3.4,3.6l0.6,5l-4.5-2.2l-4.6,2.2l0.8-5l-3.5-3.5l5-0.6L11.5,5.5 M11.5,1.2 + L7.9,8.3L0,9.5l5.7,5.6l-1.4,7.8l7.1-3.8l7,3.8l-1.3-7.9l5.7-5.6l-8-1.2L11.5,1.2L11.5,1.2z"/> +</svg> diff --git a/images/icons/beta/watched.svg b/images/icons/beta/watched.svg new file mode 100644 index 0000000..f088d9d --- /dev/null +++ b/images/icons/beta/watched.svg @@ -0,0 +1,8 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";> +<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org/1999/xlink"; x="0px" y="0px" + viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"> +<path fill="#666666" d="M11.5,5.5l2.2,4.6l5.1,0.6l-3.4,3.6l0.6,5l-4.5-2.2l-4.6,2.2l0.8-5l-3.5-3.5l5-0.6L11.5,5.5 M11.5,1.2 + L7.9,8.3L0,9.5l5.7,5.6l-1.4,7.8l7.1-3.8l7,3.8l-1.3-7.9l5.7-5.6l-8-1.2L11.5,1.2L11.5,1.2z"/> +</svg> diff --git a/includes/Resources.php b/includes/Resources.php index f98c0a7..b1a9d90 100644 --- a/includes/Resources.php +++ b/includes/Resources.php @@ -123,11 +123,24 @@ ), ), ), - 'skins.minerva.alpha.styles' => $wgMFResourceFileModuleBoilerplate + array( + 'skins.minerva.beta.styles' => $wgMFResourceFileModuleBoilerplate + array( 'styles' => array( - 'less/content/links.alpha.less', - 'less/pageactions.alpha.less', - 'less/footer.alpha.less', + 'less/content/links.beta.less', + 'less/pageactions.beta.less', + 'less/footer.beta.less', + ), + ), + 'skins.minerva.beta.images' => $wgMFResourceFileModuleBoilerplate + array( + 'class' => 'ResourceLoaderImageModule', + 'prefix' => 'mw-ui', + 'images' => array( + 'icon' => array( + // page actions + 'watch:before' => 'images/icons/beta/watch.svg', + 'watched:before' => 'images/icons/beta/watched.svg', + 'edit:before' => 'images/icons/beta/editLocked.svg', + 'edit-enabled:before' => 'images/icons/beta/edit.svg', + ), ), ), ); @@ -1657,6 +1670,10 @@ // load code under certain conditions. 'mobile.preferredLanguages', 'mobile.references.beta', + 'mobile.bannerImage', + ), + 'scripts' => array( + 'javascripts/modules/bannerImage/init.js', ), ), 'mobile.alpha' => $wgMFResourceFileModuleBoilerplate + array( @@ -1664,7 +1681,6 @@ 'mobile.beta', // Feature modules that should be loaded in alpha should be listed below here. 'mobile.infobox', - 'mobile.bannerImage', 'mobile.fontchanger', 'mobile.wikigrok.roulette', 'mobile.errorReport', @@ -1673,7 +1689,6 @@ 'scripts' => array( 'javascripts/modules/commonsCategory/init.js', 'javascripts/modules/infobox/init.js', - 'javascripts/modules/bannerImage/init.js', 'javascripts/modules/projects/init.js', ) ), diff --git a/includes/skins/SkinMinervaAlpha.php b/includes/skins/SkinMinervaAlpha.php index 103e95e..72095e7 100644 --- a/includes/skins/SkinMinervaAlpha.php +++ b/includes/skins/SkinMinervaAlpha.php @@ -12,30 +12,6 @@ /** @var string Describes 'stability' of the skin - alpha, beta, stable */ protected $mode = 'alpha'; - /** @inheritdoc **/ - protected function getHeaderHtml() { - $html = parent::getHeaderHtml(); - $vars = $this->getSkinConfigVariables(); - $description = $vars['wgMFDescription']; - if ( $description && !$this->getTitle()->isSpecialPage() ) { - $html .= Html::element( 'div', - array( - 'class' => 'tagline', - ), $description ); - } - return $html; - } - - /** - * Get the needed styles for this skin - * @return array - */ - protected function getSkinStyles() { - $styles = parent::getSkinStyles(); - $styles[] = 'skins.minerva.alpha.styles'; - return $styles; - } - /** * Returns the javascript modules to load. * @return array @@ -75,12 +51,10 @@ * @return array */ public function getSkinConfigVariables() { - global $wgWikiBasePropertyConfig, $wgMFInfoboxConfig; + global $wgMFInfoboxConfig; $vars = parent::getSkinConfigVariables(); $vars['wgMFEditorOptions']['anonymousEditing'] = true; - $vars['wgMFDescription'] = $this->getOutput()->getProperty( 'wgMFDescription' ); - $vars['wgWikiBasePropertyConfig'] = $wgWikiBasePropertyConfig; $vars['wgMFInfoboxConfig'] = $wgMFInfoboxConfig; $vars['wgMFShowRedLinks'] = true; diff --git a/includes/skins/SkinMinervaBeta.php b/includes/skins/SkinMinervaBeta.php index e33c037..40094b3 100644 --- a/includes/skins/SkinMinervaBeta.php +++ b/includes/skins/SkinMinervaBeta.php @@ -12,6 +12,30 @@ /** @var string $mode Describes 'stability' of the skin - alpha, beta, stable */ protected $mode = 'beta'; + /** @inheritdoc **/ + protected function getHeaderHtml() { + $html = parent::getHeaderHtml(); + $vars = $this->getSkinConfigVariables(); + $description = $vars['wgMFDescription']; + if ( $description && !$this->getTitle()->isSpecialPage() ) { + $html .= Html::element( 'div', + array( + 'class' => 'tagline', + ), $description ); + } + return $html; + } + + public function getSkinConfigVariables() { + global $wgWikiBasePropertyConfig; + + $vars = parent::getSkinConfigVariables(); + $vars['wgMFDescription'] = $this->getOutput()->getProperty( 'wgMFDescription' ); + $vars['wgWikiBasePropertyConfig'] = $wgWikiBasePropertyConfig; + + return $vars; + } + /** * initialize various variables and generate the template * @param OutputPage $out optional parameter: The OutputPage Obj. @@ -109,6 +133,9 @@ $styles[] = 'mediawiki.ui.icon'; $styles[] = 'skins.minerva.icons.styles'; $styles[] = 'skins.minerva.icons.images'; + $styles[] = 'skins.minerva.beta.styles'; + $styles[] = 'skins.minerva.beta.images'; + return $styles; } diff --git a/javascripts/modules/bannerImage/BannerImage.js b/javascripts/modules/bannerImage/BannerImage.js index adae706..d5deeb4 100644 --- a/javascripts/modules/bannerImage/BannerImage.js +++ b/javascripts/modules/bannerImage/BannerImage.js @@ -278,11 +278,16 @@ * Resize image to maintain aspect ratio */ resizeImage: function () { + + // Maintain 16:9 ratio + // Max height is enforced with CSS + var height = this.$el.width() * ( 1 / ratio ), + yOffset = -( height / 5 ); + this.$el .css( { - // Maintain 16:9 ratio - // Max height is enforced with CSS - height: this.$el.width() * ( 1 / ratio ) + height: height, + 'background-position-y': yOffset + 'px' } ); } } ); diff --git a/javascripts/modules/bannerImage/init.js b/javascripts/modules/bannerImage/init.js index 289c41d..2978f57 100644 --- a/javascripts/modules/bannerImage/init.js +++ b/javascripts/modules/bannerImage/init.js @@ -1,5 +1,5 @@ ( function ( M ) { - M.require( 'context' ).assertMode( [ 'alpha' ] ); + M.require( 'context' ).assertMode( [ 'alpha', 'beta' ] ); var bannerImage, page = M.getCurrentPage(), browser = M.require( 'browser' ), diff --git a/less/content/links.alpha.less b/less/content/links.beta.less similarity index 95% rename from less/content/links.alpha.less rename to less/content/links.beta.less index d983409..34ee5b7 100644 --- a/less/content/links.alpha.less +++ b/less/content/links.beta.less @@ -1,4 +1,4 @@ -.alpha { +.beta { // the last modified bar is at the bottom of the page .last-modified-bar { margin-top: 2em; @@ -10,4 +10,3 @@ } } } - diff --git a/less/footer.alpha.less b/less/footer.beta.less similarity index 94% rename from less/footer.alpha.less rename to less/footer.beta.less index 6b08603..f3ede6c 100644 --- a/less/footer.alpha.less +++ b/less/footer.beta.less @@ -1,6 +1,7 @@ @import "minerva.variables"; -.alpha { +.alpha, +.beta { #footer { margin-top: 0; border-top: none; diff --git a/less/modules/bannerImage.less b/less/modules/bannerImage.less index 3484fa5..c9d69d7 100644 --- a/less/modules/bannerImage.less +++ b/less/modules/bannerImage.less @@ -7,7 +7,7 @@ height: 360px; max-height: 360px; display: none; - background-position: 50% 50%; + background-position-x: center; background-repeat: no-repeat; .background-size( e(''), cover); position: relative; diff --git a/less/pageactions.alpha.less b/less/pageactions.beta.less similarity index 92% rename from less/pageactions.alpha.less rename to less/pageactions.beta.less index 04dc5d8..f5eb690 100644 --- a/less/pageactions.alpha.less +++ b/less/pageactions.beta.less @@ -4,13 +4,14 @@ @titleSectionSpacingTop: 20px; @titleSectionSpacingBottom: 25px; -.alpha { +.alpha, +.beta { .pre-content { padding: @titleSectionSpacingTop @contentMargin @titleSectionSpacingBottom; .tagline { color: @colorGray5; - font-size: 1.1em; + font-size: 1.05em; margin: 10px 0; &:first-letter { @@ -44,7 +45,8 @@ } @media all and (max-width: @wgMFDeviceWidthTablet) { - .alpha { + .alpha, + .beta { #page-actions { padding-top: 0; } @@ -52,7 +54,8 @@ } @media all and (min-width: @wgMFDeviceWidthTablet) { - .alpha { + .alpha, + .beta { #page-actions { width: auto; padding-right: 0; -- To view, visit https://gerrit.wikimedia.org/r/188813 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I00ee006ba67e8a5974799bde1f502f421048f8e1 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/MobileFrontend Gerrit-Branch: master Gerrit-Owner: Phuedx <[email protected]> _______________________________________________ MediaWiki-commits mailing list [email protected] https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
