layout/mathml/content/src/mathml.css

   1 /* ***** BEGIN LICENSE BLOCK *****
   2  * Version: MPL 1.1/GPL 2.0/LGPL 2.1
   3  *
   4  * The contents of this file are subject to the Mozilla Public License Version
   5  * 1.1 (the "License"); you may not use this file except in compliance with
   6  * the License. You may obtain a copy of the License at
   7  * http://www.mozilla.org/MPL/
   8  *
   9  * Software distributed under the License is distributed on an "AS IS" basis,
  10  * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
  11  * for the specific language governing rights and limitations under the
  12  * License.
  13  *
  14  * The Original Code is Mozilla MathML Project.
  15  *
  16  * The Initial Developer of the Original Code is
  17  * The University Of Queensland.
  18  * Portions created by the Initial Developer are Copyright (C) 1999
  19  * the Initial Developer. All Rights Reserved.
  20  *
  21  * Contributor(s):
  22  *   Roger B. Sidje <rbs@maths.uq.edu.au>
  23  *
  24  * Alternatively, the contents of this file may be used under the terms of
  25  * either of the GNU General Public License Version 2 or later (the "GPL"),
  26  * or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
  27  * in which case the provisions of the GPL or the LGPL are applicable instead
  28  * of those above. If you wish to allow use of your version of this file only
  29  * under the terms of either the GPL or the LGPL, and not to allow others to
  30  * use your version of this file under the terms of the MPL, indicate your
  31  * decision by deleting the provisions above and replace them with the notice
  32  * and other provisions required by the GPL or the LGPL. If you do not delete
  33  * the provisions above, a recipient may use your version of this file under
  34  * the terms of any one of the MPL, the GPL or the LGPL.
  35  *
  36  * ***** END LICENSE BLOCK ***** */
  37
  38
  39 /**************************************************************************/
  40 /* namespace for MathML elements                                          */
  41 /**************************************************************************/
  42
  43 @namespace url(http://www.w3.org/1998/Math/MathML);
  44
  45 /**************************************************************************/
  46 /* <math> - outermost math element                                        */
  47 /* Put Cambria before Cambria Math as Cambria Math has neither bold nor   */
  48 /* italic.                                                                */
  49 /**************************************************************************/
  50
  51 math {
  52   direction: ltr;
  53   unicode-bidi: embed;
  54   display: inline;
  55   font-size: inherit;
  56   font-style: normal;
  57   font-family: STIXGeneral, DejaVu Serif, DejaVu Sans, Cambria, Cambria Math, Times, Lucida Sans Unicode, OpenSymbol, Standard Symbols L, serif;
  58   text-rendering: optimizeLegibility;
  59   -moz-float-edge: margin-box;
  60 }
  61 math[mode="display"], math[display="block"] {
  62   display: block;
  63   text-align: -moz-center;
  64 }
  65 math[display="inline"] {
  66   display: inline;
  67 }
  68 ::-moz-math-inline {
  69   display: inline;
  70 }
  71
  72 /**************************************************************************/
  73 /* Style switching during frame construction depending on the context of <mi>:
  74    These rules are not used when mathvariant or fontstyle is specified
  75    explicitly.
  76 /**************************************************************************/
  77
  78 /* If the textual content of an <mi> consists of a single character
  79    with a corresponding mathematical italic alphanumeric character,
  80    then try to emulate that character */
  81 [-moz-math-font-style="italic"] {
  82   font-style: italic;
  83   font-weight: normal;
  84 }
  85 /* If the textual content consists of multiple characters, then the default is
  86    mathvariant=normal.  It seems that mathvariant=normal should be interpreted
  87    to mean non-slanted:
  88
  89    http://www.w3.org/TR/2003/REC-MathML2-20031021/chapter3.html#presm.commatt
  90
  91    "In particular, inheritance of the mathvariant attribute does not follow
  92     the CSS model. The default value for this attribute is "normal"
  93     (non-slanted) for all tokens except mi. ... (The deprecated fontslant
  94     attribute also behaves this way.)"
  95  */
  96 [-moz-math-font-style="normal"] {
  97   font-style: normal;
  98 }
  99 /* A style-invariant character preserves its own style */
 100 [-moz-math-font-style="invariant"] {
 101   font-style: normal;
 102   font-weight: normal;
 103 }
 104
 105 /**************************************************************************/
 106 /* attributes common to all tags                                          */
 107 /**************************************************************************/
 108
 109 /* deprecated attributes from MathML 1.0 */
 110
 111 /* fontstyle */
 112 [fontstyle="normal"] {
 113   font-style: normal;
 114 }
 115 [fontstyle="italic"] {
 116   font-style: italic;
 117 }
 118 /* fontweight */
 119 [fontweight="normal"] {
 120   font-weight: normal;
 121 }
 122 [fontweight="bold"] {
 123   font-weight: bold;
 124 }
 125
 126 /* attributes from MathML 2.0 */
 127
 128 /* These ones are handled in the back-end:
 129    mathcolor (replaces 'color'):
 130      #rgb | #rrggbb | html-color-name
 131    mathbackground (replaces 'background'):
 132      #rgb | #rrggbb | html-color-name
 133 */
 134 /* mathvariant (replaces 'fontstyle' & 'fontweight' & 'fontslant'):
 135      normal | bold | italic | bold-italic | double-struck | bold-fraktur | script |
 136      bold-script | fraktur | sans-serif | bold-sans-serif | sans-serif-italic |
 137      sans-serif-bold-italic | monospace
 138
 139    Note1: Back-end code for these is not yet written (bug 114365):
 140           double-struck, script, fraktur, bold-fraktur, bold-script
 141
 142    Note2: Don't use the 'font' shorthand because it resets the font-size and this
 143           breaks the propagation of the scriptlevel size.
 144
 145    XXX bugs 46622 & 114365: need -moz-math-serif, etc, to only lookup math fonts
 146
 147    The meaning of mathvariant=normal is unclear as there is no interpretation
 148    that "corresponds to SMP Math Alphanumeric Symbol characters"
 149    (http://www.w3.org/TR/2003/REC-MathML2-20031021/chapter3.html#presm.commatt),
 150    but let's assume an explicit mathvariant=normal is an attempt to reset all
 151    style.
 152 */
 153 [mathvariant] { /* shared and same as [mathvariant="normal"] */
 154   /* reset all font properties except those that affect the size */
 155   font-style: normal;
 156   font-variant: normal;
 157   font-weight: normal;
 158 }
 159 [mathvariant="bold-fraktur"],
 160 [mathvariant="bold-script"] {
 161   font-weight: bold;
 162 }
 163 [mathvariant="bold"] {
 164   font-weight: bold;
 165 }
 166 [mathvariant="italic"] {
 167   font-style: italic;
 168 }
 169 [mathvariant="bold-italic"] {
 170   font-weight: bold;
 171   font-style: italic;
 172 }
 173 [mathvariant="sans-serif"] {
 174   font-family: sans-serif;
 175 }
 176 [mathvariant="bold-sans-serif"] {
 177   font-weight: bold;
 178   font-family: sans-serif;
 179 }
 180 [mathvariant="sans-serif-italic"] {
 181   font-family: sans-serif;
 182   font-style: italic;
 183 }
 184 [mathvariant="sans-serif-bold-italic"] {
 185   font-family: sans-serif;
 186   font-weight: bold;
 187   font-style: italic;
 188 }
 189 [mathvariant="monospace"] {
 190   font-family: monospace;
 191 }
 192
 193 /**************************************************************************/
 194 /* tags with generated content                                            */
 195 /**************************************************************************/
 196
 197 ms {
 198   display: inline;
 199 }
 200 ms:before {
 201   content: open-quote;
 202 }
 203 ms:after {
 204   content: close-quote;
 205 }
 206
 207 merror {
 208   display: block;
 209   font-family: sans-serif;
 210   font-weight: bold;
 211   white-space: pre;
 212   margin: 1em;
 213   padding: 1em;
 214   border-width: thin;
 215   border-style: inset;
 216   border-color: red;
 217   font-size: 14pt;
 218   background-color: lightyellow;
 219 }
 220
 221 /**************************************************************************/
 222 /* mtable and its related tags                                            */
 223 /**************************************************************************/
 224
 225 mtable {
 226   display: inline-table;
 227   border-collapse: separate;
 228   border-spacing: 0;
 229   text-indent: 0;
 230 }
 231 mtable[frame="none"] {
 232   border: none;
 233 }
 234 mtable[frame="solid"] {
 235   border: solid thin;
 236 }
 237 mtable[frame="dashed"] {
 238   border: dashed thin;
 239 }
 240
 241 mtr {
 242   display: table-row;
 243   vertical-align: baseline;
 244 }
 245
 246 mtd {
 247   display: table-cell;
 248   vertical-align: inherit;
 249   text-align: -moz-center;
 250   white-space: nowrap;
 251 }
 252
 253 /* Don't support mtr without mtable, nor mtd without mtr */
 254 :not(mtable) > mtr,
 255 :not(mtr) > mtd {
 256   display: none !important;
 257 }
 258
 259 /***********************/
 260 /* -- mtd: columnalign */
 261
 262 mtd[-moz-math-columnalign="left"],
 263 mtd[columnalign="left"] {
 264   text-align: left;
 265 }
 266 mtd[-moz-math-columnalign="right"],
 267 mtd[columnalign="right"] {
 268   text-align: right;
 269 }
 270 mtd[-moz-math-columnalign="center"],
 271 mtd[columnalign="center"] {
 272   text-align: -moz-center;
 273 }
 274
 275 /*************************/
 276 /* -- mtr, mtd: rowalign */
 277
 278 mtr[-moz-math-rowalign="top"],
 279 mtr[rowalign="top"],
 280 mtd[rowalign="top"] {
 281   vertical-align: top;
 282 }
 283 mtr[-moz-math-rowalign="bottom"],
 284 mtr[rowalign="bottom"],
 285 mtd[rowalign="bottom"] {
 286   vertical-align: bottom;
 287 }
 288 mtr[-moz-math-rowalign="center"],
 289 mtr[rowalign="center"],
 290 mtd[rowalign="center"] {
 291   vertical-align: middle;
 292 }
 293 mtr[-moz-math-rowalign="baseline"],
 294 mtr[rowalign="baseline"],
 295 mtd[rowalign="baseline"] {
 296   vertical-align: baseline;
 297 }
 298 /* -- not yet supported --
 299 mtr[-moz-math-rowalign="axis"],
 300 mtr[rowalign="axis"],
 301 mtd[rowalign="axis"] {
 302   vertical-align: mathline;
 303 }
 304 */
 305
 306 /**********************************************************************/
 307 /* rules to achieve the default spacing between cells. The back-end code
 308    will set the internal attributes depending on the cell's position.
 309    These rules are hard-coded, the comments indicate what would be
 310    desirable if the style data could be changed on the fly to pick
 311    the values that users may set with the attributes of <mtable> */
 312 mtd {
 313   padding-right: 0.4em;  /* half of columnspacing[colindex] */
 314   padding-left: 0.4em;   /* half of columnspacing[colindex-1] */
 315   padding-bottom: 0.5ex; /* half of rowspacing[rowindex] */
 316   padding-top: 0.5ex;    /* half of rowspacing[rowindex-1] */
 317 }
 318 /* turn off the spacing at the periphery of boundary cells */
 319 mtr:first-child > mtd {
 320   padding-top: 0ex;
 321 }
 322 mtr:last-child > mtd {
 323   padding-bottom: 0ex;
 324 }
 325 mtd:first-child {
 326   padding-left: 0em;
 327 }
 328 mtd:last-child {
 329   padding-right: 0em;
 330 }
 331 /* re-instate the spacing if the table has a surrounding frame */
 332 mtable[frame="solid"] > mtr:first-child > mtd,
 333 mtable[frame="dashed"] > mtr:first-child > mtd {
 334   padding-top: 0.5ex; /* framespacing.top */
 335 }
 336 mtable[frame="solid"] > mtr:last-child > mtd,
 337 mtable[frame="dashed"] > mtr:last-child > mtd {
 338   padding-bottom: 0.5ex; /* framespacing.bottom */
 339 }
 340 mtable[frame="solid"] > mtr > mtd:first-child,
 341 mtable[frame="dashed"] > mtr > mtd:first-child {
 342   padding-left: 0.4em; /* framespacing.left */
 343 }
 344 mtable[frame="solid"] > mtr > mtd:last-child,
 345 mtable[frame="dashed"] > mtr > mtd:last-child {
 346   padding-right: 0.4em; /* framespacing.right */
 347 }
 348
 349 /**********************************************************************/
 350 /* internal settings to support 'rowlines' and 'columnlines'. To
 351    achieve the recommended behavior, the back-end code will avoid setting
 352    unsuitable rules on the cells on the first row and the first column.
 353    In general, however, authors can use the 'border' property of CSS to
 354    achieve varying effects down to the level of the table cell. */
 355 mtr[-moz-math-rowline="none"] > mtd {
 356   border-top: none;
 357 }
 358 mtr[-moz-math-rowline="solid"] > mtd {
 359   border-top: solid thin;
 360 }
 361 mtr[-moz-math-rowline="dashed"] > mtd {
 362   border-top: dashed thin;
 363 }
 364 mtd[-moz-math-columnline="none"] {
 365   border-left: none;
 366 }
 367 mtd[-moz-math-columnline="solid"] {
 368   border-left: solid thin;
 369 }
 370 mtd[-moz-math-columnline="dashed"] {
 371   border-left: dashed thin;
 372 }
 373
 374
 375 /**************************************************************************/
 376 /* Style used for stretchy symbols *must* be normal to avoid misaligments */
 377 /* By leaving the font-family empty, the MathML engine will use the value
 378    provided by the mathfont-family property in the mathfont.properties file
 379    or the value of the user's pref("font.mathfont-family", "...").
 380
 381    Authors can make elements on a document to be stretched with different
 382    fonts, e.g.,
 383
 384    To request the use of TeX fonts, you can add a <style>...</style> with:
 385    <mo myfonts="tex">...</mo> with the associated CSS declaration
 386    mo[myfonts="tex"]::-moz-math-stretchy {
 387      font-family: CMSY10, CMEX10;
 388    }
 389
 390    To request the use of Mathematica fonts, you can add a <style>...</style> with:
 391    <mo myfonts="mathematica">...</mo> with the associated CSS declaration
 392    mo[myfonts="mathematica"]::-moz-math-stretchy {
 393      font-family: Math1, Math2, Math4;
 394    }
 395
 396    Of course, if you just want all of the stretchy characters in your
 397    document to be stretched with your preferred list, you can just do:
 398    ::-moz-math-stretchy {
 399      font-family: [your-particular-list]
 400    }
 401
 402    Note that like other fonts in the document, users can override this by
 403    clicking the pref to override document fonts.
 404 /**************************************************************************/
 405
 406 ::-moz-math-stretchy {
 407   font-style: normal;
 408   font-family: serif; /* an empty family is ignored as an error and behaves like inherit */
 409 /*  background-color: #3C6; */
 410 }
 411 ::-moz-math-anonymous {
 412 }
 413
 414 /**********************************************************************/
 415 /* Hide embedded semantic MathML content (as opposed to presentational
 416    content, which we render). Ideally, here is the behavior that we want:
 417
 418    if there is an annotation-xml[encoding="MathML-Presentation"]
 419      render that annotation, and ignore the first child of the
 420      <semantics> element and all other annotations,
 421    else
 422      render the first child of <semantics> and ignore all annotations
 423
 424    But this cannot be expressed with CSS. As a stop-gap, just render
 425    the first child to cater for most of the common cases - bug 154931.
 426 */
 427 semantics > :not(:first-child) {
 428   display: none;
 429 }
 430
 431 /**********************************************************************/
 432 /* This is used when wrapping non-MathML inline elements inside math. */
 433 *|*::-moz-mathml-anonymous-block {
 434   display: inline-block !important;
 435   position: static !important;
 436   text-indent: 0;
 437 }
 438
 439 /*****************************************/
 440 /* Controlling scriptlevel               */
 441 /*****************************************/
 442
 443 /* mfrac, munder, mover and munderover change the scriptlevels of their children using
 444    -moz-math-increment-script-level because regular CSS rules are insufficient to
 445    control when the scriptlevel should be incremented */
 446 :-moz-math-increment-script-level { -moz-script-level:+1; }
 447
 448 /* all other cases can be described using regular CSS, so we do it this way because it's
 449    more efficient and less code */
 450 mroot > :not(:first-child) { -moz-script-level:+2; }
 451
 452 msub > :not(:first-child),
 453 msup > :not(:first-child),
 454 msubsup > :not(:first-child),
 455 mmultiscripts > :not(:first-child) { -moz-script-level:+1; }