GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-18 22:12:21 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Add .dropdown-menu class to DropdownMenu

Browse source
This commit is contained in:
Henrik Giesel 2021-04-28 23:31:45 +02:00
parent 9d9df2a04b
commit c1adebf2da
4 changed files with 75 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ts/components/DropdownMenu.svelte
View file

@ -18,6 +18,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
}
</style>
<div {id}>
<div {id} class={`dropdown-menu`}>
<slot />
</div>

1
ts/editor/EditorToolbar.svelte
View file

@ -59,5 +59,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<FormatInlineButtons />
<FormatBlockButtons />
<ColorButtons />
<TemplateButtons />
</StickyBar>
</WithTheming>

115
ts/editor/TemplateButtons.svelte
View file

@ -15,6 +15,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import ClozeButton from "./ClozeButton.svelte";
import { wrap } from "./wrap";
import { appendInParentheses } from "./helpers";
import { paperclipIcon, micIcon, functionIcon, xmlIcon } from "./icons";
function onAttachment(): void {
@ -28,72 +29,94 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
function onHtmlEdit(): void {
bridgeCommand("htmlEdit");
}
const mathjaxMenuId = "mathjaxMenu";
</script>
<ButtonGroup id="template">
<WithShortcut shortcut="F3" let:createShortcut let:shortcutLabel>
<IconButton
tooltip={tr.editingAttachPicturesaudiovideo}
tooltip={appendInParentheses(tr.editingAttachPicturesaudiovideo(), shortcutLabel)}
on:click={onAttachment}>
{@html paperclipIcon}
</IconButton>
</WithShortcut>
<WithShortcut shortcut="F5" let:createShortcut let:shortcutLabel>
<IconButton tooltip={tr.editingRecordAudio} on:click={onRecord}>
<IconButton
tooltip={appendInParentheses(tr.editingRecordAudio(), shortcutLabel)}
on:click={onRecord}>
{@html micIcon}
</IconButton>
</WithShortcut>
<ClozeButton />
<IconButton>
{@html functionIcon}
</IconButton>
<WithDropdownMenu let:menuId let:createDropdown>
<IconButton on:mount={createDropdown}>
{@html functionIcon}
</IconButton>
<DropdownMenu id={menuId}>
<WithShortcut
shortcut="Control+KeyM, KeyM"
let:createShortcut
let:shortcutLabel>
<DropdownItem on:click={() => wrap('\\(', '\\)')}>
{tr.editingMathjaxInline()}
</DropdownItem>
</WithShortcut>
<WithShortcut
shortcut="Control+KeyM, KeyE"
let:createShortcut
let:shortcutLabel>
<DropdownItem on:click={() => wrap('\\[', '\\]')}>
{tr.editingMathjaxBlock()}
</DropdownItem>
</WithShortcut>
<WithShortcut
shortcut="Control+KeyM, KeyC"
let:createShortcut
let:shortcutLabel>
<DropdownItem on:click={() => wrap('\\(\\ce{', '}\\)')}>
{tr.editingMathjaxChemistry()}
</DropdownItem>
</WithShortcut>
<WithShortcut
shortcut="Control+KeyT, KeyT"
let:createShortcut
let:shortcutLabel>
<DropdownItem on:click={() => wrap('[latex]', '[/latex]')}>
{tr.editingLatex()}
</DropdownItem>
</WithShortcut>
<WithShortcut
shortcut="Control+KeyT, KeyE"
let:createShortcut
let:shortcutLabel>
<DropdownItem on:click={() => wrap('[$]', '[/$]')}>
{tr.editingLatexEquation()}
</DropdownItem>
</WithShortcut>
<WithShortcut
shortcut="Control+KeyT, KeyM"
let:createShortcut
let:shortcutLabel>
<DropdownItem on:click={() => wrap('[$$]', '[/$$]')}>
{tr.editingLatexMathEnv()}
</DropdownItem>
</WithShortcut>
</DropdownMenu>
</WithDropdownMenu>
<WithShortcut shortcut="Control+Shift+KeyX" let:createShortcut let:shortcutLabel>
<IconButton tooltip={tr.editingHtmlEditor} on:click={onHtmlEdit}>
<IconButton
tooltip={appendInParentheses(tr.editingHtmlEditor(), shortcutLabel)}
on:click={onHtmlEdit}>
{@html xmlIcon}
</IconButton>
</WithShortcut>
</ButtonGroup>
<DropdownMenu id={mathjaxMenuId}>
<WithShortcut shortcut="Control+KeyM, KeyM" let:createShortcut let:shortcutLabel>
<DropdownItem on:click={() => wrap('\\(', '\\)')}>
{tr.editingMathjaxInline}
</DropdownItem>
</WithShortcut>
<WithShortcut shortcut="Control+KeyM, KeyE" let:createShortcut let:shortcutLabel>
<DropdownItem on:click={() => wrap('\\[', '\\]')}>
{tr.editingMathjaxBlock}
</DropdownItem>
</WithShortcut>
<WithShortcut shortcut="Control+KeyM, KeyC" let:createShortcut let:shortcutLabel>
<DropdownItem on:click={() => wrap('\\(\\ce{', '}\\)')}>
{tr.editingMathjaxChemistry}
</DropdownItem>
</WithShortcut>
<WithShortcut shortcut="Control+KeyT, KeyT" let:createShortcut let:shortcutLabel>
<DropdownItem on:click={() => wrap('[latex]', '[/latex]')}>
{tr.editingLatex}
</DropdownItem>
</WithShortcut>
<WithShortcut shortcut="Control+KeyT, KeyE" let:createShortcut let:shortcutLabel>
<DropdownItem on:click={() => wrap('[$]', '[/$]')}>
{tr.editingLatexEquation}
</DropdownItem>
</WithShortcut>
<WithShortcut shortcut="Control+KeyT, KeyM" let:createShortcut let:shortcutLabel>
<DropdownItem on:click={() => wrap('[$$]', '[/$$]')}>
{tr.editingLatexMathEnv}
</DropdownItem>
</WithShortcut>
</DropdownMenu>

4
ts/editor/helpers.ts
View file

@ -110,3 +110,7 @@ const isBlockElement = (
export const getListItem = getAnchorParent(isListItem);
export const getParagraph = getAnchorParent(isParagraph);
export const getBlockElement = getAnchorParent(isBlockElement);
export function appendInParentheses(text: string, appendix: string): string {
return `${text} (${appendix})`;
}