Frédéric Wang has uploaded a new change for review.
https://gerrit.wikimedia.org/r/166280
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.
Bug: 71955
Change-Id: If8ee1cf6453257a0a2f6aa186d4007954a8e5d8e
---
M MathMathML.php
M MathTexvc.php
M modules/ext.math.css
M modules/ext.math.js
4 files changed, 17 insertions(+), 15 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Math
refs/changes/80/166280/1
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: newchange
Gerrit-Change-Id: If8ee1cf6453257a0a2f6aa186d4007954a8e5d8e
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Math
Gerrit-Branch: master
Gerrit-Owner: Frédéric Wang <fred.w...@free.fr>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
