webview/katex: Add hack so \frac lines don't disappear.

KaTeX `.frac-line`s don't show up on some of our Android test devices
and emulators. (This seems to be a perennial problem for KaTeX. See
the commit-internal comments for references.)

Resolve this by forcing all such lines to be 1px wide, disregarding
the TeXbook spec.

src/webview/css/css.js

@@ -1,9 +1,27 @@
 /* @flow strict-local */
+import { Platform } from 'react-native';
 import type { ThemeName } from '../../types';
 import cssPygments from './cssPygments';
 import cssEmojis from './cssEmojis';
 import cssNight from './cssNight';
 
+/**
+ * Fix KaTeX frac-line elements disappearing.
+ *
+ * This is a hack, but it's probably better than not having fraction lines on
+ * low-resolution phones. It's only known to be useful under Chrome and Android,
+ * so we only include it there.
+ *
+ * See, among others:
+ *   https://github.com/KaTeX/KaTeX/issues/824
+ *   https://github.com/KaTeX/KaTeX/issues/916
+ *   https://github.com/KaTeX/KaTeX/pull/1249
+ *   https://github.com/KaTeX/KaTeX/issues/1775
+ */
+const katexFraclineHackStyle = `<style id="katex-frac-line-hack">
+.katex .mfrac .frac-line { border-bottom-width: 1px !important; }
+</style>`;
+
 export default (theme: ThemeName) => `
 <link rel='stylesheet' type='text/css' href='./base.css'>
 <link rel='stylesheet' type='text/css' href='./katex/katex.min.css'>
@@ -17,5 +35,6 @@ ${cssEmojis}
   display: none;
 }
 </style>
+${Platform.OS === 'android' ? katexFraclineHackStyle : '<!-- Safari -->'}
 <style id="generated-styles"></style>
 `;