GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-11-09 06:07:11 -05:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Move alert up and make it collapsible

Browse source
This commit is contained in:
Matthias M 2021-11-17 19:24:23 +01:00
parent cb3df5f1be
commit 515f86eb15
2 changed files with 47 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ftl/core/change-notetype.ftl
View file

@ -2,6 +2,8 @@ change-notetype-current = Current
change-notetype-new = New change-notetype-new = New
change-notetype-will-discard-content = Will discard content on the following fields: change-notetype-will-discard-content = Will discard content on the following fields:
change-notetype-will-discard-cards = Will remove the following cards: change-notetype-will-discard-cards = Will remove the following cards:
change-notetype-collapse = Collapse
change-notetype-expand = Expand
change-notetype-fields = Fields change-notetype-fields = Fields
change-notetype-templates = Templates change-notetype-templates = Templates
change-notetype-to-from-cloze = change-notetype-to-from-cloze =

55
ts/change-notetype/Mapper.svelte
View file

@ -6,9 +6,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import Container from "../components/Container.svelte"; import Container from "../components/Container.svelte";
import Row from "../components/Row.svelte"; import Row from "../components/Row.svelte";
import Col from "../components/Col.svelte"; import Col from "../components/Col.svelte";
import Badge from "../components/Badge.svelte";
import MapperRow from "./MapperRow.svelte"; import MapperRow from "./MapperRow.svelte";
import * as tr from "../lib/ftl"; import * as tr from "../lib/ftl";
import { ChangeNotetypeState, MapContext } from "./lib"; import { ChangeNotetypeState, MapContext } from "./lib";
import { plusIcon, minusIcon } from "./icons";
import { slide } from "svelte/transition"; import { slide } from "svelte/transition";
export let state: ChangeNotetypeState; export let state: ChangeNotetypeState;
@ -21,8 +23,45 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
ctx === MapContext.Field ctx === MapContext.Field
? tr.changeNotetypeWillDiscardContent() ? tr.changeNotetypeWillDiscardContent()
: tr.changeNotetypeWillDiscardCards(); : tr.changeNotetypeWillDiscardCards();
let maxItems: number = 4;
let collapsed: boolean = true;
$: collapseMsg = collapsed
? tr.changeNotetypeExpand()
: tr.changeNotetypeCollapse();
$: icon = collapsed ? plusIcon : minusIcon;
</script> </script>
{#if unused.length > 0}
<div class="alert alert-warning" in:slide out:slide>
{#if unused.length > maxItems}
<div class="clickable" on:click={() => collapsed = !collapsed}>
<Badge iconSize={80}>
{@html icon}
</Badge>
{collapseMsg}
</div>
{/if}
{unusedMsg}
<ul>
{#if collapsed}
{#each unused.slice(0, maxItems) as entry}
<li>{entry}</li>
{/each}
{#if unused.length > maxItems}
<div class="clickable" on:click={() => collapsed = !collapsed}>
+{unused.length - maxItems}
</div>
{/if}
{:else}
{#each unused as entry}
<li>{entry}</li>
{/each}
{/if}
</ul>
</div>
{/if}
<Container --gutter-inline="0.5rem" --gutter-block="0.1rem"> <Container --gutter-inline="0.5rem" --gutter-block="0.1rem">
<Row --cols={2}> <Row --cols={2}>
<Col --col-size={1}><b>{tr.changeNotetypeCurrent()}</b></Col> <Col --col-size={1}><b>{tr.changeNotetypeCurrent()}</b></Col>
@ -34,13 +73,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
{/each} {/each}
</Container> </Container>
{#if unused.length > 0} <style lang="scss">
<div class="alert alert-warning" in:slide out:slide> .clickable {
{unusedMsg} font-weight: bold;
<ul> cursor: pointer;
{#each unused as entry} }
<li>{entry}</li> </style>
{/each}
</ul>
</div>
{/if}