GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-24 16:56:36 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Slider easy day gui (#3605)

Browse source 
* Slider easy day gui

* Removed: Borders

* Added: Bottom borders
This commit is contained in:
Luc Mcgrady 2024-12-06 13:34:56 +00:00 committed by GitHub
parent d897b4588e
commit 6524a24a89
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 32 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

60
ts/routes/deck-options/EasyDays.svelte
View file

@ -36,6 +36,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
]; ];
</script> </script>
<datalist id="easy_day_steplist">
<option>0.5</option>
</datalist>
<TitledContainer title={tr.deckConfigEasyDaysTitle()}> <TitledContainer title={tr.deckConfigEasyDaysTitle()}>
<DynamicallySlottable slotHost={Item} {api}> <DynamicallySlottable slotHost={Item} {api}>
<Item> <Item>
@ -44,40 +48,27 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<thead> <thead>
<tr> <tr>
<th></th> <th></th>
<th>{tr.deckConfigEasyDaysNormal()}</th> <th colspan="3">
<th>{tr.deckConfigEasyDaysReduced()}</th> <div class="header">
<th>{tr.deckConfigEasyDaysMinimum()}</th> <span>{tr.deckConfigEasyDaysMinimum()}</span>
<span>{tr.deckConfigEasyDaysReduced()}</span>
<span>{tr.deckConfigEasyDaysNormal()}</span>
</div>
</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{#each easyDays as day, index} {#each easyDays as day, index}
<tr> <tr>
<td>{day}</td> <td>{day}</td>
<td> <td colspan="3">
<input <input
type="radio" type="range"
bind:group={$config.easyDaysPercentages[index]} bind:value={$config.easyDaysPercentages[index]}
value={1.0} step={0.5}
checked={$config.easyDaysPercentages[index] === max={1.0}
1.0} min={0.0}
/> list="easy_day_steplist"
</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> </td>
</tr> </tr>
@ -101,6 +92,19 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
.easy-days-settings td { .easy-days-settings td {
padding: 8px; padding: 8px;
text-align: center; text-align: center;
border: 1px solid #ddd; border-bottom: var(--border) solid 1px;
}
.header {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.header span:nth-child(1) {
text-align: left;
}
.header span:nth-child(3) {
text-align: right;
}
.easy-days-settings input[type="range"] {
width: 100%;
} }
</style> </style>