@xingwangzhe/stalux 1.2.0

package/src/styles/base/math.css

@@ -0,0 +1,411 @@
+/*
+ * Latin Modern Math 字体 + Temml 数学渲染样式
+ * 仅作用于 <math> 元素，不影响全局字体。
+ *
+ * Latin Modern Math 基于 GUST Font License (LPPL equivalent)
+ * Temml.woff2 是 KaTeX_Script-Regular 的克隆，用于 \mathscr{} 和 Chromium prime 对齐
+ */
+
+/* ===== @font-face 声明 ===== */
+
+@font-face {
+    font-family: "Temml";
+    src: url("/fonts/Temml.woff2") format("woff2");
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: Latin Modern Math;
+    src: url("/fonts/latinmodern-math.woff2") format("woff2");
+    font-display: swap;
+}
+
+/* ===== 数学公式核心样式（仅作用于 <math>） ===== */
+
+math {
+    font-style: normal;
+    font-weight: normal;
+    line-height: normal;
+    font-size-adjust: none;
+    text-indent: 0;
+    text-transform: none;
+    letter-spacing: normal;
+    word-wrap: normal;
+    direction: ltr;
+    /* Prevent Firefox from omitting the dot on i or j. */
+    font-feature-settings: "dtls" off;
+    font-family: "Latin Modern Math", math;
+}
+
+math * {
+    border-color: currentColor;
+}
+
+/* display: block is necessary in Firefox and Safari.
+ * Not in Chromium, which recognizes display: "block math" written inline. */
+math.tml-display {
+    display: block;
+    width: 100%;
+}
+
+*.mathscr {
+    font-family: "Temml";
+}
+
+/* Cramped superscripts in WebKit */
+mfrac > :nth-child(2),
+msqrt,
+mover > :first-child {
+    math-shift: compact;
+}
+
+.menclose {
+    display: inline-block;
+    position: relative;
+    padding: 0.5ex 0ex;
+}
+
+.tml-cancelto {
+    display: inline-block;
+    position: absolute;
+    top: 0;
+    left: 0;
+    padding: 0.5ex 0ex;
+    background-color: currentColor;
+    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><defs><marker id='a' markerHeight='5' markerUnits='strokeWidth' markerWidth='7' orient='auto' refX='7' refY='2.5'><path fill='black' d='m0 0 7 2.5L0 5z'/></marker></defs><line x2='100%25' y1='100%25' stroke='black' stroke-width='.06em' marker-end='url(%23a)' vector-effect='non-scaling-stroke'/></svg>");
+    mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><defs><marker id='a' markerHeight='5' markerUnits='strokeWidth' markerWidth='7' orient='auto' refX='7' refY='2.5'><path fill='black' d='m0 0 7 2.5L0 5z'/></marker></defs><line x2='100%25' y1='100%25' stroke='black' stroke-width='.06em' marker-end='url(%23a)' vector-effect='non-scaling-stroke'/></svg>");
+    -webkit-mask-repeat: no-repeat;
+    mask-repeat: no-repeat;
+    -webkit-mask-size: 100% 100%;
+    mask-size: 100% 100%;
+    -webkit-mask-position: 0 0;
+    mask-position: 0 0;
+}
+
+/* ===== Firefox fixes ===== */
+
+@-moz-document url-prefix() {
+    /* Prevent flex-wrap */
+    math {
+        display: inline;
+    }
+    math > mrow {
+        padding: 0;
+    }
+    /* Adjust Firefox spacing between array rows */
+    mtd,
+    mtable.tml-small mtd {
+        padding-top: 0;
+        padding-bottom: 0;
+    }
+    mtable.tml-jot mtd {
+        padding-top: 0.2ex;
+        padding-bottom: 0ex;
+    }
+
+    /* \vec w/o italic correction for Firefox */
+    .tml-vec {
+        transform: scale(0.75);
+    }
+    /* Fix \cancelto in Firefox */
+    .ff-narrow {
+        width: 0em;
+    }
+    .ff-nudge-left {
+        margin-left: -0.2em;
+    }
+    /* Squash hidden mrows in \bordermatrix */
+    .ff-squash mtd {
+        display: block;
+        height: 0;
+    }
+}
+
+/* ===== Chromium & WebKit fixes ===== */
+
+@supports (not (-moz-appearance: none)) {
+    /* prime vertical alignment */
+    mo.tml-prime {
+        font-family: Temml;
+    }
+    /* Italic correction on superscripts */
+    .tml-sml-pad {
+        padding-left: 0.05em;
+    }
+    .tml-med-pad {
+        padding-left: 0.1em;
+    }
+    .tml-lrg-pad {
+        padding-left: 0.15em;
+    }
+}
+
+/* ===== WebKit-specific fixes ===== */
+
+@supports (-webkit-backdrop-filter: blur(1px)) {
+    /* WebKit vertical & italic correction on accents */
+    .wbk-acc {
+        transform: translate(0em, 0.431em);
+    }
+    .wbk-sml {
+        transform: translate(0.07em, 0);
+    }
+    .wbk-sml-acc {
+        transform: translate(0.07em, 0.431em);
+    }
+    .wbk-sml-vec {
+        transform: scale(0.75) translate(0.07em, 0);
+    }
+    .wbk-med {
+        transform: translate(0.14em, 0);
+    }
+    .wbk-med-acc {
+        transform: translate(0.14em, 0.431em);
+    }
+    .wbk-med-vec {
+        transform: scale(0.75) translate(0.14em, 0);
+    }
+    .wbk-lrg {
+        transform: translate(0.21em, 0);
+    }
+    .wbk-lrg-acc {
+        transform: translate(0.21em, 0.431em);
+    }
+    .wbk-lrg-vec {
+        transform: scale(0.75) translate(0.21em, 0);
+    }
+}
+
+/* ===== Chromium-only fixes ===== */
+
+@supports (not (-webkit-backdrop-filter: blur(1px))) and (not (-moz-appearance: none)) {
+    /* Italic correction on accents */
+    .chr-sml {
+        transform: translate(0.07em, 0);
+    }
+    .chr-sml-vec {
+        transform: scale(0.75) translate(0.07em, 0);
+    }
+    .chr-med {
+        transform: translate(0.14em, 0);
+    }
+    .chr-med-vec {
+        transform: scale(0.75) translate(0.14em, 0);
+    }
+    .chr-lrg {
+        transform: translate(0.21em, 0);
+    }
+    .chr-lrg-vec {
+        transform: scale(0.75) translate(0.21em, 0);
+    }
+
+    /* For CD labels that grow to the left */
+    .tml-shift-left {
+        margin-left: -100%;
+    }
+
+    /* MathML Core & Chromium do not support <menclose> attributes */
+    menclose {
+        position: relative;
+        padding: 0.5ex 0ex;
+    }
+
+    .tml-overline {
+        padding: 0.1em 0 0 0;
+        border-top: 0.065em solid;
+    }
+    .tml-underline {
+        padding: 0 0 0.1em 0;
+        border-bottom: 0.065em solid;
+    }
+
+    .tml-cancel {
+        display: inline-block;
+        position: absolute;
+        left: 0.5px;
+        bottom: 0;
+        width: 100%;
+        height: 100%;
+        background-color: currentColor;
+    }
+    .upstrike {
+        clip-path: polygon(
+            0.05em 100%,
+            0em calc(100% - 0.05em),
+            calc(100% - 0.05em) 0em,
+            100% 0.05em
+        );
+    }
+    .downstrike {
+        clip-path: polygon(
+            0em 0.05em,
+            0.05em 0em,
+            100% calc(100% - 0.05em),
+            calc(100% - 0.05em) 100%
+        );
+    }
+    .sout {
+        clip-path: polygon(
+            0em calc(55% + 0.0333em),
+            0em calc(55% - 0.0333em),
+            100% calc(55% - 0.0333em),
+            100% calc(55% + 0.0333em)
+        );
+    }
+    .tml-xcancel {
+        clip-path: polygon(
+            0.05em 0em,
+            0em 0.05em,
+            calc(50% - 0.05em) 50%,
+            0em calc(100% - 0.05em),
+            0.05em 100%,
+            50% calc(50% + 0.05em),
+            calc(100% - 0.05em) 100%,
+            100% calc(100% - 0.05em),
+            calc(50% + 0.05em) 50%,
+            100% 0.05em,
+            calc(100% - 0.05em) 0%,
+            50% calc(50% - 0.05em)
+        );
+    }
+
+    .longdiv-top {
+        border-top: 0.067em solid;
+        padding: 0.1em 0.2em 0.2em 0.433em;
+    }
+    .longdiv-arc {
+        position: absolute;
+        top: 0;
+        bottom: 0.1em;
+        left: -0.4em;
+        width: 0.7em;
+        border: 0.067em solid;
+        transform: translateY(-0.067em);
+        border-radius: 70%;
+        clip-path: inset(0 0 0 0.4em);
+        box-sizing: border-box;
+    }
+    .menclose {
+        display: inline-block;
+        text-align: left;
+        position: relative;
+    }
+
+    .phasor-bottom {
+        border-bottom: 0.067em solid;
+        padding: 0.2em 0.2em 0.1em 0.6em;
+    }
+    .phasor-angle {
+        display: inline-block;
+        position: absolute;
+        left: 0.5px;
+        bottom: -0.04em;
+        height: 100%;
+        aspect-ratio: 0.5;
+        background-color: currentColor;
+        clip-path: polygon(
+            0.05em 100%,
+            0em calc(100% - 0.05em),
+            calc(100% - 0.05em) 0em,
+            100% 0.05em
+        );
+    }
+
+    .tml-fbox {
+        padding: 3pt;
+        border: 1px solid;
+    }
+    .circle-pad {
+        padding: 0.267em;
+    }
+    .textcircle {
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        right: 0;
+        left: 0;
+        border: 0.067em solid;
+        border-radius: 50%;
+    }
+    .actuarial {
+        padding: 0.03889em 0.03889em 0 0.03889em;
+        border-width: 0.08em 0.08em 0em 0em;
+        border-style: solid;
+        margin-right: 0.03889em;
+    }
+
+    /* Stretch \widetilde */
+    .tml-crooked-2 {
+        transform: scale(2, 1.1);
+    }
+    .tml-crooked-3 {
+        transform: scale(3, 1.3);
+    }
+    .tml-crooked-4 {
+        transform: scale(4, 1.4);
+    }
+
+    /* array cell justification */
+    .tml-right {
+        text-align: -webkit-right;
+    }
+    .tml-left {
+        text-align: -webkit-left;
+    }
+}
+
+/* ===== 通用样式 ===== */
+
+/* \cancel & \phase 打印时显示背景图 */
+menclose {
+    -webkit-print-color-adjust: exact;
+    print-color-adjust: exact;
+}
+
+/* Array cell justification in Firefox & WebKit */
+.tml-right {
+    text-align: right;
+}
+.tml-left {
+    text-align: left;
+}
+
+/* 特殊分数字体回退 */
+.special-fraction {
+    font-family: "Times New Roman", Times, "STIX TWO", Tinos, serif;
+}
+
+/* flex-wrap for line-breaking in Chromium */
+math {
+    display: inline-flex;
+    flex-wrap: wrap;
+    align-items: baseline;
+}
+math > mrow {
+    padding: 0.5ex 0ex;
+}
+
+/* mtd top padding is 0.5ex per MathML-Core. Adjust for jot and small. */
+mtable.tml-jot mtd {
+    padding-top: 0.7ex;
+    padding-bottom: 0.7ex;
+}
+mtable.tml-small mtd {
+    padding-top: 0.35ex;
+    padding-bottom: 0.35ex;
+}
+
+/* CD labels that grow to the left in Firefox and WebKit */
+.tml-shift-left {
+    margin-left: -200%;
+}
+
+/* ===== AMS 环境自动编号 ===== */
+.tml-eqn::before {
+    counter-increment: tmlEqnNo;
+    content: "(" counter(tmlEqnNo) ")";
+}
+body {
+    counter-reset: tmlEqnNo;
+}