Fix alignment of empty icon

This commit is contained in:
Henrik Giesel 2021-08-07 22:23:18 +02:00
parent de056fbd89
commit af556c391d
3 changed files with 16 additions and 8 deletions

View file

@ -15,12 +15,14 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
const nightMode = getContext<boolean>(nightModeKey);
$: [converted, title] = convertMathjax(mathjax, nightMode, fontSize);
$: empty = title === "MathJax";
$: encoded = encodeURIComponent(converted);
</script>
<img
src="data:image/svg+xml,{encoded}"
class:block
class:empty
alt="Mathjax"
{title}
data-anki="mathjax"
@ -32,4 +34,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
display: block;
margin: auto;
}
.empty {
vertical-align: sub;
}
</style>

View file

@ -11,10 +11,6 @@ function getCSS(nightMode: boolean, fontSize: number): string {
return `svg { color: ${color}; fill: ${color}; font-size: ${fontSize}px; }`;
}
function getErrorCSS(fontSize: number): string {
return `svg { color: yellow; font-size: ${fontSize}px; }`;
}
function getStyle(css: string): HTMLStyleElement {
const style = document.createElement("style") as HTMLStyleElement;
style.appendChild(document.createTextNode(css));
@ -26,7 +22,7 @@ function getEmptyIcon(style: HTMLStyleElement): [string, string] {
const svg = icon.children[0];
svg.insertBefore(style, svg.children[0]);
return [svg.outerHTML, ""];
return [svg.outerHTML, "MathJax"];
}
export function convertMathjax(

View file

@ -101,7 +101,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
let:shortcutLabel
>
<DropdownItem
on:click={() => wrapCurrent("<anki-mathjax>", "</anki-mathjax>")}
on:click={() =>
wrapCurrent("<anki-mathjax>", "</anki-mathjax>")}
on:mount={withButton(createShortcut)}
>
{tr.editingMathjaxInline()}
@ -115,7 +116,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
let:shortcutLabel
>
<DropdownItem
on:click={() => wrapCurrent("<anki-mathjax block=\"true\">", "</anki-matjax>")}
on:click={() =>
wrapCurrent(
'<anki-mathjax block="true">',
"</anki-matjax>"
)}
on:mount={withButton(createShortcut)}
>
{tr.editingMathjaxBlock()}
@ -129,7 +134,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
let:shortcutLabel
>
<DropdownItem
on:click={() => wrapCurrent("<anki-mathjax>\\ce{", "}</anki-mathjax>")}
on:click={() =>
wrapCurrent("<anki-mathjax>\\ce{", "}</anki-mathjax>")}
on:mount={withButton(createShortcut)}
>
{tr.editingMathjaxChemistry()}