diff --git a/doerg/resources/net/deertopia/doerg/Temml-Plex.css b/doerg/resources/net/deertopia/doerg/Temml-Plex.css new file mode 100644 index 0000000..e4c46c0 --- /dev/null +++ b/doerg/resources/net/deertopia/doerg/Temml-Plex.css @@ -0,0 +1,343 @@ +/* Based on Temml-local.css. */ +math { + font-family: "IBM Plex Math", "Cambria Math", 'STIXTwoMath-Regular', 'NotoSansMath-Regular', 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; +} + +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%; +} + +*.mathcal { + /* NotoSans */ + font-feature-settings: 'ss01'; +} + +math .mathscr { + font-family: "IBM Plex Math"; +} + +mo.tml-prime { + font-family: "IBM Plex Math"; +} + +/* 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-image: url("data:image/svg+xml,"); +} + +@supports (-moz-appearance: none) { + /* \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; + } +} + +@supports (not (-moz-appearance: none)) { + /* Chromium and WebKit */ + /* prime vertical alignment */ + mo.tml-prime { + font-family: "IBM Plex Math"; + } + /* Italic correction on superscripts */ + .tml-sml-pad { + padding-left: 0.05em; + } + .tml-med-pad { + padding-left: 0.10em; + } + .tml-lrg-pad { + padding-left: 0.15em; + } +} + +@supports (-webkit-backdrop-filter: blur(1px)) { + /* WebKit vertical & italic correction on accents */ + .wbk-acc { + /* lower by x-height distance */ + 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); + } +} + +/* \cancel & \phase use background images. Get them to print. */ +menclose { + -webkit-print-color-adjust: exact; /* Chrome & Edge */ + print-color-adjust: exact; +} + +/* Array cell justification in Firefox & WebKit */ +.tml-right { + text-align: right; +} +.tml-left { + text-align: left; +} + +/* For CD labels that grow to the left in Firefox and WebKit */ +.tml-shift-left { margin-left:-200% } + +/* Styles for Chromium only */ +@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 the MathML 3.0 element attributes. */ + /* So use styles. */ + 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 { + background: linear-gradient(to top left, + rgba(0,0,0,0) 0%, + rgba(0,0,0,0) calc(50% - 0.06em), + rgba(0,0,0,1) 50%, + rgba(0,0,0,0) calc(50% + 0.06em), + rgba(0,0,0,0) 100%), + linear-gradient(to top right, + rgba(0,0,0,0) 0%, + rgba(0,0,0,0) calc(50% - 0.06em), + rgba(0,0,0,1) 50%, + rgba(0,0,0,0) calc(50% + 0.06em), + rgba(0,0,0,0) 100%) + } + + .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.0, 1.1) + } + .tml-crooked-3 { + transform: scale(3.0, 1.3) + } + .tml-crooked-4 { + transform: scale(4.0, 1.4) + } + /* set array cell justification */ + .tml-right { + text-align: -webkit-right; + } + .tml-left { + text-align: -webkit-left; + } +} + +.special-fraction { + font-family: "IBM Plex Math", 'STIX TWO', 'Times New Roman', Times, 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; +} + +/* Default mtd top padding is 0.5ex per MathML-Core and user-agent CSS */ +/* We 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; +} + +/* Firefox */ +@-moz-document url-prefix() { + /* Avoid 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: 0.ex; } +} + +/* AMS environment auto-numbering via CSS counter. */ +.tml-eqn::before { + counter-increment: tmlEqnNo; + content: "(" counter(tmlEqnNo) ")"; +} + +body { + counter-reset: tmlEqnNo; +} diff --git a/doerg/src/net/deertopia/doerg/html.clj b/doerg/src/net/deertopia/doerg/html.clj index 76cf513..0a17511 100644 --- a/doerg/src/net/deertopia/doerg/html.clj +++ b/doerg/src/net/deertopia/doerg/html.clj @@ -31,28 +31,17 @@ [:link {:rel "stylesheet" :type "text/css" :href href}]) (def ibm-plex - (for [family ["serif" "sans-kr" "math"]] - #_ - [:style (-> cfg/*cfg* ::cfg/ibm-plex-web - (fs/file (format "css/ibm-plex-%s-default.min.css" family)) - slurp)] - (external-stylesheet - (format "ibm-plex-web/css/ibm-plex-%s-all.min.css" family)))) + (concat + (for [family ["serif" "sans-kr" "math"]] + (external-stylesheet + (format "ibm-plex-web/css/ibm-plex-%s-all.min.css" family))) + [(external-stylesheet "Temml-Plex.css")])) (def deerstar - (external-stylesheet "deerstar.css") - #_ - [:style (slurp (io/resource "net/deertopia/doerg/deerstar.css"))]) + (external-stylesheet "deerstar.css")) (def tuftesque - (external-stylesheet "tuftesque.css") - #_ - [:link {:rel "stylesheet" - :type "text/css" - :href "/resources/tuftesque.css"}] - #_ - [:style - (slurp (io/resource "net/deertopia/doerg/tuftesque.css"))]) + (external-stylesheet "tuftesque.css")) (def head (list viewport charset ibm-plex deerstar tuftesque)) diff --git a/doerg/src/net/deertopia/doerg/repl.clj b/doerg/src/net/deertopia/doerg/repl.clj index eaddc35..613032b 100644 --- a/doerg/src/net/deertopia/doerg/repl.clj +++ b/doerg/src/net/deertopia/doerg/repl.clj @@ -34,6 +34,8 @@ (io/resource "net/deertopia/doerg/deerstar.css")) (force-create-sym-link (fs/file dest "tuftesque.css") (io/resource "net/deertopia/doerg/tuftesque.css")) + (force-create-sym-link (fs/file dest "Temml-Plex.css") + (io/resource "net/deertopia/doerg/Temml-Plex.css")) (fs/delete-if-exists (fs/file dest "index.html")) (->> (h/html (-> src slurp element/read-string render/org-document)) str (spit (fs/file dest "index.html"))))