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

Further tweaks to easy days

Browse source 
The previous commit added word-wrap, but it was not working after I'd
removed some other tweaks I'd made in testing, that I thought were not
required. I ended up switching to standard table columns and a fixed
layout, so that both the column and row headers will wrap properly.
This commit is contained in:
Damien Elmes 2025-02-11 17:04:58 +07:00
parent 348822a14b
commit 038d85b1d9
1 changed files with 23 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -47,19 +47,21 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<thead>
<tr>
<th></th>
<th colspan="3">
<div class="header">
<span>{tr.deckConfigEasyDaysMinimum()}</span>
<span>{tr.deckConfigEasyDaysReduced()}</span>
<span>{tr.deckConfigEasyDaysNormal()}</span>
</div>
<th class="header min-col">
<span>{tr.deckConfigEasyDaysMinimum()}</span>
</th>
<th class="header text-center">
<span>{tr.deckConfigEasyDaysReduced()}</span>
</th>
<th class="header normal-col">
<span>{tr.deckConfigEasyDaysNormal()}</span>
</th>
</tr>
</thead>
<tbody>
{#each easyDays as day, index}
<tr>
<td>{day}</td>
<td class="day">{day}</td>
<td colspan="3">
<input
type="range"
@ -86,26 +88,31 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
.easy-days-settings table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
.easy-days-settings th,
.easy-days-settings td {
padding: 8px;
text-align: center;
border-bottom: var(--border) solid 1px;
}
.header {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
word-wrap: break-word;
font-size: smaller;
}
.header span:nth-child(1) {
text-align: left;
}
.header span:nth-child(3) {
text-align: right;
}
.easy-days-settings input[type="range"] {
width: 100%;
}
.day {
word-wrap: break-word;
font-size: smaller;
}
.min-col {
text-align: start;
}
.normal-col {
text-align: end;
}
</style>