Skip to content

Programmatically globally load KaTeX fonts

Tomas Vik (OOO back on 2025-01-02) requested to merge 2190-katex-fonts-outside-of-less into develop

Part of #2190 (closed)

Extracted from !1482 (merged)

We've got a way of including the CDN fonts in fonts.hbs and fonts.js. I added all KaTeX fonts there.

I would like to delete all unused KaTeX fonts. (KaTeX fonts not matching glob /public/repo/katex/fonts-0.10.0/*.{woff2,woff}). But I'll do it in a separate MR because the 350+ deletions would make this MR unreadable.

Generated output

@font-face {
      font-family: 'SourceSansLocal';
      font-style: normal;
      font-weight: bold;
      src: local("SourceSansPro-Bold");
    }
    @font-face {
      font-family: 'SourceSansLocal';
      font-style: italic;
      font-weight: bold;
      src: local("SourceSansPro-BoldIt");
    }
    @font-face {
      font-family: 'SourceSansLocal';
      font-style: normal;
      font-weight: 200;
      src: local("SourceSansPro-ExtraLight");
    }
    @font-face {
      font-family: 'SourceSansLocal';
      font-style: italic;
      font-weight: normal;
      src: local("SourceSansPro-It");
    }
    @font-face {
      font-family: 'SourceSansLocal';
      font-style: normal;
      font-weight: 300;
      src: local("SourceSansPro-Light");
    }
    @font-face {
      font-family: 'SourceSansLocal';
      font-style: normal;
      font-weight: normal;
      src: local("SourceSansPro-Regular");
    }
    @font-face {
      font-family: 'SourceSansLocal';
      font-style: normal;
      font-weight: 600;
      src: local("SourceSansPro-Semibold");
    }
    @font-face {
      font-family: "source-sans-pro";
        src: url("//localhost:5001/_s/l/fonts/sourcesans/SourceSansPro-Regular.otf.woff") format('woff');
      font-weight: normal;
      font-style: normal
    }
    @font-face {
      font-family: "source-sans-pro";
        src: url("//localhost:5001/_s/l/fonts/sourcesans/SourceSansPro-It.otf.woff") format('woff');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "source-sans-pro";
        src: url("//localhost:5001/_s/l/fonts/sourcesans/SourceSansPro-Bold.otf.woff") format('woff');
      font-weight: bold;
      font-style: normal
    }
    @font-face {
      font-family: "source-sans-pro";
        src: url("//localhost:5001/_s/l/fonts/sourcesans/SourceSansPro-Semibold.otf.woff") format('woff');
      font-weight: 600;
      font-style: normal
    }
    @font-face {
      font-family: "source-sans-pro";
        src: url("//localhost:5001/_s/l/fonts/sourcesans/SourceSansPro-BoldIt.otf.woff") format('woff');
      font-weight: bold;
      font-style: italic
    }
    @font-face {
      font-family: "source-sans-pro";
        src: url("//localhost:5001/_s/l/fonts/sourcesans/SourceSansPro-Light.otf.woff") format('woff');
      font-weight: 300;
      font-style: normal
    }
    @font-face {
      font-family: "source-sans-pro";
        src: url("//localhost:5001/_s/l/fonts/sourcesans/SourceSansPro-ExtraLight.otf.woff") format('woff');
      font-weight: 200;
      font-style: normal
    }
    @font-face {
      font-family: "KaTeX_AMS";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_AMS-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_AMS-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Caligraphic";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Caligraphic-Bold.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Caligraphic-Bold.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Caligraphic";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Caligraphic-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Caligraphic-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Fraktur";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Fraktur-Bold.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Fraktur-Bold.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Fraktur";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Fraktur-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Fraktur-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Main";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-Bold.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-Bold.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Main";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-BoldItalic.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-BoldItalic.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Main";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-Italic.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-Italic.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Main";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Main-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Math";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Math-BoldItalic.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Math-BoldItalic.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Math";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Math-Italic.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Math-Italic.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_SansSerif";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_SansSerif-Bold.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_SansSerif-Bold.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_SansSerif";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_SansSerif-Italic.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_SansSerif-Italic.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_SansSerif";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_SansSerif-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_SansSerif-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Script";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Script-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Script-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Size1";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size1-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size1-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Size2";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size2-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size2-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Size3";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size3-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size3-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Size4";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size4-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Size4-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
    @font-face {
      font-family: "KaTeX_Typewriter";
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Typewriter-Regular.woff") format('woff');
        src: url("//localhost:5001/_s/l/repo/katex/fonts-0.10.0/KaTeX_Typewriter-Regular.woff2") format('woff2');
      font-weight: normal;
      font-style: italic
    }
Edited by Tomas Vik (OOO back on 2025-01-02)

Merge request reports