mirror of
https://github.com/ankitects/anki.git
synced 2025-09-20 06:52:21 -04:00
106 lines
3.9 KiB
Svelte
106 lines
3.9 KiB
Svelte
<!--
|
|
Copyright: Ankitects Pty Ltd and contributors
|
|
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|
-->
|
|
<script lang="ts">
|
|
import * as tr from "@generated/ftl";
|
|
import DynamicallySlottable from "$lib/components/DynamicallySlottable.svelte";
|
|
import Item from "$lib/components/Item.svelte";
|
|
import TitledContainer from "$lib/components/TitledContainer.svelte";
|
|
import type { DeckOptionsState } from "./lib";
|
|
import Warning from "./Warning.svelte";
|
|
|
|
export let state: DeckOptionsState;
|
|
export let api: Record<string, never>;
|
|
|
|
const config = state.currentConfig;
|
|
const defaults = state.defaults;
|
|
|
|
// svelte-ignore reactive_declaration_non_reactive_property
|
|
$: if ($config.easyDaysPercentages.length !== 7) {
|
|
$config.easyDaysPercentages = defaults.easyDaysPercentages;
|
|
}
|
|
|
|
$: noNormalDay = $config.easyDaysPercentages.some((p) => p === 1.0)
|
|
? ""
|
|
: tr.deckConfigEasyDaysNoNormalDays();
|
|
|
|
const easyDays = [
|
|
tr.deckConfigEasyDaysMonday(),
|
|
tr.deckConfigEasyDaysTuesday(),
|
|
tr.deckConfigEasyDaysWednesday(),
|
|
tr.deckConfigEasyDaysThursday(),
|
|
tr.deckConfigEasyDaysFriday(),
|
|
tr.deckConfigEasyDaysSaturday(),
|
|
tr.deckConfigEasyDaysSunday(),
|
|
];
|
|
</script>
|
|
|
|
<TitledContainer title={tr.deckConfigEasyDaysTitle()}>
|
|
<DynamicallySlottable slotHost={Item} {api}>
|
|
<Item>
|
|
<div class="easy-days-settings">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th></th>
|
|
<th>{tr.deckConfigEasyDaysNormal()}</th>
|
|
<th>{tr.deckConfigEasyDaysReduced()}</th>
|
|
<th>{tr.deckConfigEasyDaysMinimum()}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{#each easyDays as day, index}
|
|
<tr>
|
|
<td>{day}</td>
|
|
<td>
|
|
<input
|
|
type="radio"
|
|
bind:group={$config.easyDaysPercentages[index]}
|
|
value={1.0}
|
|
checked={$config.easyDaysPercentages[index] ===
|
|
1.0}
|
|
/>
|
|
</td>
|
|
<td>
|
|
<input
|
|
type="radio"
|
|
bind:group={$config.easyDaysPercentages[index]}
|
|
value={0.5}
|
|
checked={$config.easyDaysPercentages[index] ===
|
|
0.5}
|
|
/>
|
|
</td>
|
|
<td>
|
|
<input
|
|
type="radio"
|
|
bind:group={$config.easyDaysPercentages[index]}
|
|
value={0.0}
|
|
checked={$config.easyDaysPercentages[index] ===
|
|
0.0}
|
|
/>
|
|
</td>
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</Item>
|
|
<Item>
|
|
<Warning warning={noNormalDay} />
|
|
</Item>
|
|
</DynamicallySlottable>
|
|
</TitledContainer>
|
|
|
|
<style>
|
|
.easy-days-settings table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
}
|
|
.easy-days-settings th,
|
|
.easy-days-settings td {
|
|
padding: 8px;
|
|
text-align: center;
|
|
border: 1px solid #ddd;
|
|
}
|
|
</style>
|