katex.less (12405B)
1 @import "fonts.less"; 2 3 // The mu unit is defined as 1/18 em 4 @mu: 1.0/18.0em; 5 6 .katex-display { 7 display: block; 8 margin: 1em 0; 9 text-align: center; 10 11 > .katex { 12 display: inline-block; 13 text-align: initial; 14 } 15 } 16 17 .katex { 18 font: normal 1.21em KaTeX_Main, Times New Roman, serif; 19 line-height: 1.2; 20 white-space: nowrap; 21 22 // Protect elements inside .katex from inheriting text-indent. 23 text-indent: 0; 24 25 .katex-html { 26 // Making .katex inline-block allows line breaks before and after, 27 // which is undesireable ("to $x$,"). Instead, adjust the .katex-html 28 // style and put nowrap on the inline .katex element. 29 display: inline-block; 30 } 31 32 .katex-mathml { 33 // Accessibility hack to only show to screen readers 34 // Found at: http://a11yproject.com/posts/how-to-hide-content/ 35 position: absolute; 36 clip: rect(1px, 1px, 1px, 1px); 37 padding: 0; 38 border: 0; 39 height: 1px; 40 width: 1px; 41 overflow: hidden; 42 } 43 44 .base { 45 display: inline-block; 46 } 47 48 .strut { 49 display: inline-block; 50 } 51 52 .mathrm { 53 font-style: normal; 54 } 55 56 .textit { 57 font-style: italic; 58 } 59 60 .mathit { 61 font-family: KaTeX_Math; 62 font-style: italic; 63 } 64 65 .mathbf { 66 font-family: KaTeX_Main; 67 font-weight: bold; 68 } 69 70 .amsrm { 71 font-family: KaTeX_AMS; 72 } 73 74 .mathbb { 75 font-family: KaTeX_AMS; 76 } 77 78 .mathcal { 79 font-family: KaTeX_Caligraphic; 80 } 81 82 .mathfrak { 83 font-family: KaTeX_Fraktur; 84 } 85 86 .mathtt { 87 font-family: KaTeX_Typewriter; 88 } 89 90 .mathscr { 91 font-family: KaTeX_Script; 92 } 93 94 .mathsf { 95 font-family: KaTeX_SansSerif; 96 } 97 98 .mainit { 99 font-family: KaTeX_Main; 100 font-style: italic; 101 } 102 103 // This value is also used in fontMetrics.js, if you change it make sure the 104 // values match. 105 @ptperem: 10.0; 106 @nulldelimiterspace: 1.2em / @ptperem; 107 108 @thinspace: 0.16667em; // 3mu 109 @mediumspace: 0.22222em; // 4mu 110 @thickspace: 0.27778em; // 5mu 111 112 // These spacings apply in textstyle and displaystyle. 113 .mord { 114 & + .mord {} 115 & + .mop { margin-left: @thinspace; } 116 & + .mbin { margin-left: @mediumspace; } 117 & + .mrel { margin-left: @thickspace; } 118 & + .mopen {} 119 & + .mclose {} 120 & + .mpunct {} 121 & + .minner { margin-left: @thinspace; } 122 } 123 124 .mop { 125 & + .mord { margin-left: @thinspace; } 126 & + .mop { margin-left: @thinspace; } 127 & + .mbin {} 128 & + .mrel { margin-left: @thickspace; } 129 & + .mopen {} 130 & + .mclose {} 131 & + .mpunct {} 132 & + .minner { margin-left: @thinspace; } 133 } 134 135 .mbin { 136 & + .mord { margin-left: @mediumspace; } 137 & + .mop { margin-left: @mediumspace; } 138 & + .mbin {} 139 & + .mrel {} 140 & + .mopen { margin-left: @mediumspace; } 141 & + .mclose {} 142 & + .mpunct {} 143 & + .minner { margin-left: @mediumspace; } 144 } 145 146 .mrel { 147 & + .mord { margin-left: @thickspace; } 148 & + .mop { margin-left: @thickspace; } 149 & + .mbin {} 150 & + .mrel {} 151 & + .mopen { margin-left: @thickspace; } 152 & + .mclose {} 153 & + .mpunct {} 154 & + .minner { margin-left: @thickspace; } 155 } 156 157 .mopen { 158 & + .mord {} 159 & + .mop {} 160 & + .mbin {} 161 & + .mrel {} 162 & + .mopen {} 163 & + .mclose {} 164 & + .mpunct {} 165 & + .minner {} 166 } 167 168 .mclose { 169 & + .mord {} 170 & + .mop { margin-left: @thinspace; } 171 & + .mbin { margin-left: @mediumspace; } 172 & + .mrel { margin-left: @thickspace; } 173 & + .mopen {} 174 & + .mclose {} 175 & + .mpunct {} 176 & + .minner { margin-left: @thinspace; } 177 } 178 179 .mpunct { 180 & + .mord { margin-left: @thinspace; } 181 & + .mop { margin-left: @thinspace; } 182 & + .mbin {} 183 & + .mrel { margin-left: @thinspace; } 184 & + .mopen { margin-left: @thinspace; } 185 & + .mclose { margin-left: @thinspace; } 186 & + .mpunct { margin-left: @thinspace; } 187 & + .minner { margin-left: @thinspace; } 188 } 189 190 .minner { 191 & + .mord { margin-left: @thinspace; } 192 & + .mop { margin-left: @thinspace; } 193 & + .mbin { margin-left: @mediumspace; } 194 & + .mrel { margin-left: @thickspace; } 195 & + .mopen { margin-left: @thinspace; } 196 & + .mclose {} 197 & + .mpunct { margin-left: @thinspace; } 198 & + .minner { margin-left: @thinspace; } 199 } 200 201 // These tighter spacings apply in scriptstyle and scriptscriptstyle. 202 .mord.mtight { margin-left: 0; } 203 .mop.mtight { margin-left: 0; } 204 .mbin.mtight { margin-left: 0; } 205 .mrel.mtight { margin-left: 0; } 206 .mopen.mtight { margin-left: 0; } 207 .mclose.mtight { margin-left: 0; } 208 .mpunct.mtight { margin-left: 0; } 209 .minner.mtight { margin-left: 0; } 210 211 .mord { 212 & + .mop.mtight { margin-left: @thinspace; } 213 } 214 215 .mop { 216 & + .mord.mtight { margin-left: @thinspace; } 217 & + .mop.mtight { margin-left: @thinspace; } 218 } 219 220 .mclose { 221 & + .mop.mtight { margin-left: @thinspace; } 222 } 223 224 .minner { 225 & + .mop.mtight { margin-left: @thinspace; } 226 } 227 228 .reset-textstyle.textstyle { font-size: 1em; } 229 .reset-textstyle.scriptstyle { font-size: 0.7em; } 230 .reset-textstyle.scriptscriptstyle { font-size: 0.5em; } 231 232 .reset-scriptstyle.textstyle { font-size: 1.42857em; } 233 .reset-scriptstyle.scriptstyle { font-size: 1em; } 234 .reset-scriptstyle.scriptscriptstyle { font-size: 0.71429em; } 235 236 .reset-scriptscriptstyle.textstyle { font-size: 2em; } 237 .reset-scriptscriptstyle.scriptstyle { font-size: 1.4em; } 238 .reset-scriptscriptstyle.scriptscriptstyle { font-size: 1em; } 239 240 .style-wrap { 241 position: relative; 242 } 243 244 .vlist { 245 display: inline-block; 246 247 > span { 248 display: block; 249 height: 0; 250 position: relative; 251 252 > span { 253 display: inline-block; 254 } 255 } 256 257 .baseline-fix { 258 display: inline-table; 259 table-layout: fixed; 260 } 261 } 262 263 .msupsub { 264 text-align: left; 265 } 266 267 .mfrac { 268 > span > span { 269 text-align: center; 270 } 271 272 .frac-line { 273 width: 100%; 274 275 &:before { 276 border-bottom-style: solid; 277 border-bottom-width: 1px; 278 content: ""; 279 display: block; 280 } 281 282 &:after { 283 border-bottom-style: solid; 284 border-bottom-width: 0.04em; 285 content: ""; 286 display: block; 287 margin-top: -1px; 288 } 289 } 290 } 291 292 .mspace { 293 display: inline-block; 294 295 &.negativethinspace { 296 margin-left: -@thinspace; 297 } 298 299 &.thinspace { 300 width: @thinspace; 301 } 302 303 &.negativemediumspace { 304 margin-left: -@mediumspace; 305 } 306 307 &.mediumspace { 308 width: @mediumspace; 309 } 310 311 &.thickspace { 312 width: @thickspace; 313 } 314 315 &.sixmuspace { 316 width: 0.333333em; 317 } 318 319 &.eightmuspace { 320 width: 0.444444em; 321 } 322 323 &.enspace { 324 width: 0.5em; 325 } 326 327 &.twelvemuspace { 328 width: 0.666667em; 329 } 330 331 &.quad { 332 width: 1em; 333 } 334 335 &.qquad { 336 width: 2em; 337 } 338 } 339 340 .llap, 341 .rlap { 342 width: 0; 343 position: relative; 344 345 > .inner { 346 position: absolute; 347 } 348 349 > .fix { 350 display: inline-block; 351 } 352 } 353 354 .llap > .inner { 355 right: 0; 356 } 357 358 .rlap > .inner { 359 left: 0; 360 } 361 362 .katex-logo { 363 .a { 364 font-size: 0.75em; 365 margin-left: -0.32em; 366 position: relative; 367 top: -0.2em; 368 } 369 .t { 370 margin-left: -0.23em; 371 } 372 .e { 373 margin-left: -0.1667em; 374 position: relative; 375 top: 0.2155em; 376 } 377 .x { 378 margin-left: -0.125em; 379 } 380 } 381 382 .rule { 383 display: inline-block; 384 border: solid 0; 385 position: relative; 386 } 387 388 .overline .overline-line, 389 .underline .underline-line { 390 width: 100%; 391 392 &:before { 393 border-bottom-style: solid; 394 border-bottom-width: 1px; 395 content: ""; 396 display: block; 397 } 398 399 &:after { 400 border-bottom-style: solid; 401 border-bottom-width: 0.04em; 402 content: ""; 403 display: block; 404 margin-top: -1px; 405 } 406 } 407 408 .sqrt { 409 > .sqrt-sign { 410 position: relative; 411 } 412 413 .sqrt-line { 414 width: 100%; 415 416 &:before { 417 border-bottom-style: solid; 418 border-bottom-width: 1px; 419 content: ""; 420 display: block; 421 } 422 423 &:after { 424 border-bottom-style: solid; 425 border-bottom-width: 0.04em; 426 content: ""; 427 display: block; 428 margin-top: -1px; 429 } 430 } 431 432 > .root { 433 // These values are taken from the definition of `\r@@t`, 434 // `\mkern 5mu` and `\mkern -10mu`. 435 margin-left: 5*@mu; 436 margin-right: -10*@mu; 437 } 438 } 439 440 .sizing, .fontsize-ensurer { 441 display: inline-block; 442 443 @size1: 0.5; 444 @size2: 0.7; 445 @size3: 0.8; 446 @size4: 0.9; 447 @size5: 1.0; 448 @size6: 1.2; 449 @size7: 1.44; 450 @size8: 1.73; 451 @size9: 2.07; 452 @size10: 2.49; 453 454 .generate-size-change(@from, @to) { 455 &.reset-size@{from}.size@{to} { 456 @sizeFromVariable: ~"size@{from}"; 457 @sizeToVariable: ~"size@{to}"; 458 font-size: (@@sizeToVariable / @@sizeFromVariable) * 1em; 459 } 460 } 461 462 .generate-to-size-change(@from, @currTo) when (@currTo =< 10) { 463 .generate-size-change(@from, @currTo); 464 465 .generate-to-size-change(@from, (@currTo + 1)); 466 } 467 468 .generate-from-size-change(@currFrom) when (@currFrom =< 10) { 469 .generate-to-size-change(@currFrom, 1); 470 471 .generate-from-size-change((@currFrom + 1)); 472 } 473 474 .generate-from-size-change(1); 475 } 476 477 .delimsizing { 478 &.size1 { font-family: KaTeX_Size1; } 479 &.size2 { font-family: KaTeX_Size2; } 480 &.size3 { font-family: KaTeX_Size3; } 481 &.size4 { font-family: KaTeX_Size4; } 482 483 &.mult { 484 .delim-size1 > span { 485 font-family: KaTeX_Size1; 486 } 487 .delim-size4 > span { 488 font-family: KaTeX_Size4; 489 } 490 } 491 } 492 493 .nulldelimiter { 494 display: inline-block; 495 width: @nulldelimiterspace; 496 } 497 498 .op-symbol { 499 position: relative; 500 501 &.small-op { 502 font-family: KaTeX_Size1; 503 } 504 &.large-op { 505 font-family: KaTeX_Size2; 506 } 507 } 508 509 .op-limits { 510 > .vlist > span { 511 text-align: center; 512 } 513 } 514 515 .accent { 516 > .vlist > span { 517 text-align: center; 518 } 519 520 .accent-body > span { 521 width: 0; 522 } 523 524 .accent-body.accent-vec > span { 525 position: relative; 526 // This value is half of the value that the MathJax's makeFF shifts 527 // it left. We center it by shifting it half way right again. 528 left: 0.326em; 529 } 530 } 531 532 .mtable { 533 .vertical-separator { 534 display: inline-block; 535 margin: 0 -0.025em; 536 border-right: 0.05em solid black; 537 } 538 539 .arraycolsep { 540 display: inline-block; 541 } 542 543 .col-align-c > .vlist { 544 text-align: center; 545 } 546 547 .col-align-l > .vlist { 548 text-align: left; 549 } 550 551 .col-align-r > .vlist { 552 text-align: right; 553 } 554 } 555 556 }