Physikerwelt has submitted this change and it was merged. Change subject: Rename fallback-svg and fallback-png to fallback-image ......................................................................
Rename fallback-svg and fallback-png to fallback-image - Merge fallback-svg and fallback-png into one fallback-image class. - Move the vertical centering of PNG to MathTexvc and ext.math.js. - Remove "img" from ext.math.css to reduce CSS specificity and make style easier to override by user stylesheets. - Add a comment about the !important rules for centering in display mode. - Only load ext.math.scripts in MathML mode. Bug: 71955 Change-Id: If8ee1cf6453257a0a2f6aa186d4007954a8e5d8e --- M Math.hooks.php M MathMathML.php M MathTexvc.php M modules/ext.math.css M modules/ext.math.js 5 files changed, 20 insertions(+), 17 deletions(-) Approvals: Physikerwelt: Verified; Looks good to me, approved diff --git a/Math.hooks.php b/Math.hooks.php index 47bdf0c..e2ef1db 100644 --- a/Math.hooks.php +++ b/Math.hooks.php @@ -134,8 +134,9 @@ $parser->getOutput()->addModules( array( 'ext.math.mathjax.enabler' ) ); } $parser->getOutput()->addModuleStyles( array( 'ext.math.styles' ) ); - $parser->getOutput()->addModules( array( 'ext.math.scripts' ) ); - + if ( $mode == MW_MATH_MATHML ) { + $parser->getOutput()->addModules( array( 'ext.math.scripts' ) ); + } // Writes cache if rendering was successful $renderer->writeCache(); wfProfileOut( __METHOD__ ); diff --git a/MathMathML.php b/MathMathML.php index 08b7bf2..789bc2e 100644 --- a/MathMathML.php +++ b/MathMathML.php @@ -399,7 +399,7 @@ private function getClassName( $fallback = false ) { $class = "mwe-math-"; if ( $fallback ) { - $class .= 'fallback-svg-'; + $class .= 'fallback-image-'; } else { $class .= 'mathml-'; } diff --git a/MathTexvc.php b/MathTexvc.php index 057007c..fe2004d 100644 --- a/MathTexvc.php +++ b/MathTexvc.php @@ -135,12 +135,15 @@ $attributes = array( // the former class name was 'tex' // for backwards compatibility we keep that classname - 'class' => 'mwe-math-fallback-png-inline tex', + 'class' => 'mwe-math-fallback-image-inline tex', 'alt' => $this->getTex() ); if ( $this->getMathStyle() === MW_MATHSTYLE_DISPLAY ){ // if DisplayStyle is true, the equation will be centered in a new line - $attributes[ 'class' ] = 'mwe-math-fallback-png-display tex'; + $attributes[ 'class' ] = 'mwe-math-fallback-image-display tex'; + } else { + // Otherwise, do the vertical alignment. + $attributes[ 'style' ] = 'vertical-align: middle;'; } return Xml::element( 'img', $this->getAttributes( diff --git a/modules/ext.math.css b/modules/ext.math.css index 68574f5..670953e 100644 --- a/modules/ext.math.css +++ b/modules/ext.math.css @@ -33,13 +33,11 @@ src: url(./LatinModern/latinmodern-math.woff); } -/* Default style for the SVG fallback. */ -img.mwe-math-fallback-svg-inline { display: inline; } -img.mwe-math-fallback-svg-display { display: block; margin-left: auto !important; margin-right: auto !important; } - -/* Default style for the PNG fallback. */ -img.mwe-math-fallback-png-inline { display: inline; vertical-align: middle; } -img.mwe-math-fallback-png-display { display: block; margin-left: auto; margin-right: auto; } +/* Default style for the image fallback. */ +/* Note: We had to use !important rules because of conflicts with the style + generated by Mathoid. See https://gerrit.wikimedia.org/r/#/c/166213/ */ +.mwe-math-fallback-image-inline { display: inline; } +.mwe-math-fallback-image-display { display: block; margin-left: auto !important; margin-right: auto !important; } /* Default style for the source fallback. */ .mwe-math-fallback-source-inline { display: inline; vertical-align: middle; } @@ -60,6 +58,6 @@ height: auto; opacity: 1; } - .mwe-math-mathml-inline + img.mwe-math-fallback-svg-inline, - .mwe-math-mathml-display + img.mwe-math-fallback-svg-display { display: none !important; } + .mwe-math-mathml-inline + .mwe-math-fallback-image-inline, + .mwe-math-mathml-display + .mwe-math-fallback-image-display { display: none !important; } } diff --git a/modules/ext.math.js b/modules/ext.math.js index 2f6e5d1..5a88a0c 100644 --- a/modules/ext.math.js +++ b/modules/ext.math.js @@ -6,18 +6,19 @@ // If MathPlayer is installed we show the MathML rendering. if (navigator.userAgent.indexOf('MathPlayer') > -1) { $( '.mwe-math-mathml-a11y' ).removeClass( 'mwe-math-mathml-a11y' ); - $( 'img.mwe-math-fallback-svg-inline, img.mwe-math-fallback-svg-display' ).css( 'display', 'none' ); + $( '.mwe-math-fallback-image-inline, .mwe-math-fallback-image-display' ).css( 'display', 'none' ); return; } // We verify whether SVG as <img> is supported and otherwise use the // PNG fallback. See https://github.com/Modernizr/Modernizr/blob/master/feature-detects/svg/asimg.js if (!document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#Image', '1.1')) { - $( 'img.mwe-math-fallback-svg-inline, img.mwe-math-fallback-svg-display' ).each(function() { + $( '.mwe-math-fallback-image-inline, .mwe-math-fallback-image-display' ).each(function() { // Create a new PNG image to use as the fallback. img = document.createElement('img'); img.setAttribute( 'src', this.src.replace('mode=' + MW_MATH_MATHML, 'mode=' + MW_MATH_PNG) ); - img.setAttribute( 'class', 'tex mwe-math-fallback-png-' + ($( this ).hasClass('mwe-math-fallback-svg-inline') ? 'inline' : 'display') ); + img.setAttribute( 'class', 'tex mwe-math-fallback-image-' + ($( this ).hasClass('mwe-math-fallback-image-inline') ? 'inline' : 'display') ); + img.setAttribute( 'style', 'vertical-align: center;' ); img.setAttribute( 'aria-hidden', 'true' ); this.parentNode.insertBefore( img, this ); -- To view, visit https://gerrit.wikimedia.org/r/166280 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: If8ee1cf6453257a0a2f6aa186d4007954a8e5d8e Gerrit-PatchSet: 2 Gerrit-Project: mediawiki/extensions/Math Gerrit-Branch: master Gerrit-Owner: Frédéric Wang <fred.w...@free.fr> Gerrit-Reviewer: Frédéric Wang <fred.w...@free.fr> Gerrit-Reviewer: GWicke <gwi...@wikimedia.org> Gerrit-Reviewer: Physikerwelt <w...@physikerwelt.de> Gerrit-Reviewer: TheDJ <hartman.w...@gmail.com> Gerrit-Reviewer: jenkins-bot <> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits