KaTeX/static/katex.less
2016-12-31 20:51:20 -05:00

557 lines
12 KiB
Plaintext

@import "fonts.less";
// The mu unit is defined as 1/18 em
@mu: 1.0/18.0em;
.katex-display {
display: block;
margin: 1em 0;
text-align: center;
> .katex {
display: inline-block;
text-align: initial;
}
}
.katex {
font: normal 1.21em KaTeX_Main, Times New Roman, serif;
line-height: 1.2;
white-space: nowrap;
// Protect elements inside .katex from inheriting text-indent.
text-indent: 0;
.katex-html {
// Making .katex inline-block allows line breaks before and after,
// which is undesireable ("to $x$,"). Instead, adjust the .katex-html
// style and put nowrap on the inline .katex element.
display: inline-block;
}
.katex-mathml {
// Accessibility hack to only show to screen readers
// Found at: http://a11yproject.com/posts/how-to-hide-content/
position: absolute;
clip: rect(1px, 1px, 1px, 1px);
padding: 0;
border: 0;
height: 1px;
width: 1px;
overflow: hidden;
}
.base {
display: inline-block;
}
.strut {
display: inline-block;
}
.mathrm {
font-style: normal;
}
.textit {
font-style: italic;
}
.mathit {
font-family: KaTeX_Math;
font-style: italic;
}
.mathbf {
font-family: KaTeX_Main;
font-weight: bold;
}
.amsrm {
font-family: KaTeX_AMS;
}
.mathbb {
font-family: KaTeX_AMS;
}
.mathcal {
font-family: KaTeX_Caligraphic;
}
.mathfrak {
font-family: KaTeX_Fraktur;
}
.mathtt {
font-family: KaTeX_Typewriter;
}
.mathscr {
font-family: KaTeX_Script;
}
.mathsf {
font-family: KaTeX_SansSerif;
}
.mainit {
font-family: KaTeX_Main;
font-style: italic;
}
// This value is also used in fontMetrics.js, if you change it make sure the
// values match.
@ptperem: 10.0;
@nulldelimiterspace: 1.2em / @ptperem;
@thinspace: 0.16667em; // 3mu
@mediumspace: 0.22222em; // 4mu
@thickspace: 0.27778em; // 5mu
// These spacings apply in textstyle and displaystyle.
.mord {
& + .mord {}
& + .mop { margin-left: @thinspace; }
& + .mbin { margin-left: @mediumspace; }
& + .mrel { margin-left: @thickspace; }
& + .mopen {}
& + .mclose {}
& + .mpunct {}
& + .minner { margin-left: @thinspace; }
}
.mop {
& + .mord { margin-left: @thinspace; }
& + .mop { margin-left: @thinspace; }
& + .mbin {}
& + .mrel { margin-left: @thickspace; }
& + .mopen {}
& + .mclose {}
& + .mpunct {}
& + .minner { margin-left: @thinspace; }
}
.mbin {
& + .mord { margin-left: @mediumspace; }
& + .mop { margin-left: @mediumspace; }
& + .mbin {}
& + .mrel {}
& + .mopen { margin-left: @mediumspace; }
& + .mclose {}
& + .mpunct {}
& + .minner { margin-left: @mediumspace; }
}
.mrel {
& + .mord { margin-left: @thickspace; }
& + .mop { margin-left: @thickspace; }
& + .mbin {}
& + .mrel {}
& + .mopen { margin-left: @thickspace; }
& + .mclose {}
& + .mpunct {}
& + .minner { margin-left: @thickspace; }
}
.mopen {
& + .mord {}
& + .mop {}
& + .mbin {}
& + .mrel {}
& + .mopen {}
& + .mclose {}
& + .mpunct {}
& + .minner {}
}
.mclose {
& + .mord {}
& + .mop { margin-left: @thinspace; }
& + .mbin { margin-left: @mediumspace; }
& + .mrel { margin-left: @thickspace; }
& + .mopen {}
& + .mclose {}
& + .mpunct {}
& + .minner { margin-left: @thinspace; }
}
.mpunct {
& + .mord { margin-left: @thinspace; }
& + .mop { margin-left: @thinspace; }
& + .mbin {}
& + .mrel { margin-left: @thinspace; }
& + .mopen { margin-left: @thinspace; }
& + .mclose { margin-left: @thinspace; }
& + .mpunct { margin-left: @thinspace; }
& + .minner { margin-left: @thinspace; }
}
.minner {
& + .mord { margin-left: @thinspace; }
& + .mop { margin-left: @thinspace; }
& + .mbin { margin-left: @mediumspace; }
& + .mrel { margin-left: @thickspace; }
& + .mopen { margin-left: @thinspace; }
& + .mclose {}
& + .mpunct { margin-left: @thinspace; }
& + .minner { margin-left: @thinspace; }
}
// These tighter spacings apply in scriptstyle and scriptscriptstyle.
.mord.mtight { margin-left: 0; }
.mop.mtight { margin-left: 0; }
.mbin.mtight { margin-left: 0; }
.mrel.mtight { margin-left: 0; }
.mopen.mtight { margin-left: 0; }
.mclose.mtight { margin-left: 0; }
.mpunct.mtight { margin-left: 0; }
.minner.mtight { margin-left: 0; }
.mord {
& + .mop.mtight { margin-left: @thinspace; }
}
.mop {
& + .mord.mtight { margin-left: @thinspace; }
& + .mop.mtight { margin-left: @thinspace; }
}
.mclose {
& + .mop.mtight { margin-left: @thinspace; }
}
.minner {
& + .mop.mtight { margin-left: @thinspace; }
}
.reset-textstyle.textstyle { font-size: 1em; }
.reset-textstyle.scriptstyle { font-size: 0.7em; }
.reset-textstyle.scriptscriptstyle { font-size: 0.5em; }
.reset-scriptstyle.textstyle { font-size: 1.42857em; }
.reset-scriptstyle.scriptstyle { font-size: 1em; }
.reset-scriptstyle.scriptscriptstyle { font-size: 0.71429em; }
.reset-scriptscriptstyle.textstyle { font-size: 2em; }
.reset-scriptscriptstyle.scriptstyle { font-size: 1.4em; }
.reset-scriptscriptstyle.scriptscriptstyle { font-size: 1em; }
.style-wrap {
position: relative;
}
.vlist {
display: inline-block;
> span {
display: block;
height: 0;
position: relative;
> span {
display: inline-block;
}
}
.baseline-fix {
display: inline-table;
table-layout: fixed;
}
}
.msupsub {
text-align: left;
}
.mfrac {
> span > span {
text-align: center;
}
.frac-line {
width: 100%;
&:before {
border-bottom-style: solid;
border-bottom-width: 1px;
content: "";
display: block;
}
&:after {
border-bottom-style: solid;
border-bottom-width: 0.04em;
content: "";
display: block;
margin-top: -1px;
}
}
}
.mspace {
display: inline-block;
&.negativethinspace {
margin-left: -@thinspace;
}
&.thinspace {
width: @thinspace;
}
&.negativemediumspace {
margin-left: -@mediumspace;
}
&.mediumspace {
width: @mediumspace;
}
&.thickspace {
width: @thickspace;
}
&.sixmuspace {
width: 0.333333em;
}
&.eightmuspace {
width: 0.444444em;
}
&.enspace {
width: 0.5em;
}
&.twelvemuspace {
width: 0.666667em;
}
&.quad {
width: 1em;
}
&.qquad {
width: 2em;
}
}
.llap,
.rlap {
width: 0;
position: relative;
> .inner {
position: absolute;
}
> .fix {
display: inline-block;
}
}
.llap > .inner {
right: 0;
}
.rlap > .inner {
left: 0;
}
.katex-logo {
.a {
font-size: 0.75em;
margin-left: -0.32em;
position: relative;
top: -0.2em;
}
.t {
margin-left: -0.23em;
}
.e {
margin-left: -0.1667em;
position: relative;
top: 0.2155em;
}
.x {
margin-left: -0.125em;
}
}
.rule {
display: inline-block;
border: solid 0;
position: relative;
}
.overline .overline-line,
.underline .underline-line {
width: 100%;
&:before {
border-bottom-style: solid;
border-bottom-width: 1px;
content: "";
display: block;
}
&:after {
border-bottom-style: solid;
border-bottom-width: 0.04em;
content: "";
display: block;
margin-top: -1px;
}
}
.sqrt {
> .sqrt-sign {
position: relative;
}
.sqrt-line {
width: 100%;
&:before {
border-bottom-style: solid;
border-bottom-width: 1px;
content: "";
display: block;
}
&:after {
border-bottom-style: solid;
border-bottom-width: 0.04em;
content: "";
display: block;
margin-top: -1px;
}
}
> .root {
// These values are taken from the definition of `\r@@t`,
// `\mkern 5mu` and `\mkern -10mu`.
margin-left: 5*@mu;
margin-right: -10*@mu;
}
}
.sizing, .fontsize-ensurer {
display: inline-block;
@size1: 0.5;
@size2: 0.7;
@size3: 0.8;
@size4: 0.9;
@size5: 1.0;
@size6: 1.2;
@size7: 1.44;
@size8: 1.73;
@size9: 2.07;
@size10: 2.49;
.generate-size-change(@from, @to) {
&.reset-size@{from}.size@{to} {
@sizeFromVariable: ~"size@{from}";
@sizeToVariable: ~"size@{to}";
font-size: (@@sizeToVariable / @@sizeFromVariable) * 1em;
}
}
.generate-to-size-change(@from, @currTo) when (@currTo =< 10) {
.generate-size-change(@from, @currTo);
.generate-to-size-change(@from, (@currTo + 1));
}
.generate-from-size-change(@currFrom) when (@currFrom =< 10) {
.generate-to-size-change(@currFrom, 1);
.generate-from-size-change((@currFrom + 1));
}
.generate-from-size-change(1);
}
.delimsizing {
&.size1 { font-family: KaTeX_Size1; }
&.size2 { font-family: KaTeX_Size2; }
&.size3 { font-family: KaTeX_Size3; }
&.size4 { font-family: KaTeX_Size4; }
&.mult {
.delim-size1 > span {
font-family: KaTeX_Size1;
}
.delim-size4 > span {
font-family: KaTeX_Size4;
}
}
}
.nulldelimiter {
display: inline-block;
width: @nulldelimiterspace;
}
.op-symbol {
position: relative;
&.small-op {
font-family: KaTeX_Size1;
}
&.large-op {
font-family: KaTeX_Size2;
}
}
.op-limits {
> .vlist > span {
text-align: center;
}
}
.accent {
> .vlist > span {
text-align: center;
}
.accent-body > span {
width: 0;
}
.accent-body.accent-vec > span {
position: relative;
// This value is half of the value that the MathJax's makeFF shifts
// it left. We center it by shifting it half way right again.
left: 0.326em;
}
}
.mtable {
.vertical-separator {
display: inline-block;
margin: 0 -0.025em;
border-right: 0.05em solid black;
}
.arraycolsep {
display: inline-block;
}
.col-align-c > .vlist {
text-align: center;
}
.col-align-l > .vlist {
text-align: left;
}
.col-align-r > .vlist {
text-align: right;
}
}
}