mirror of
https://github.com/zoldar/jenot.git
synced 2026-01-03 14:32:54 +00:00
Improve task list rendering when readonly
This commit is contained in:
parent
23a1929ddd
commit
10fc27e13d
2 changed files with 13 additions and 1 deletions
|
|
@ -185,10 +185,15 @@ function renderNote(note) {
|
|||
|
||||
note.content.forEach((task) => {
|
||||
const item = document.createElement("li");
|
||||
if (task.checked) {
|
||||
item.classList.add("checked");
|
||||
}
|
||||
const check = document.createElement("p");
|
||||
check.classList.add("checkbox");
|
||||
check.textContent = task.checked ? "☑" : "☐";
|
||||
item.appendChild(check);
|
||||
const itemContent = document.createElement("p");
|
||||
itemContent.classList.add("content");
|
||||
itemContent.replaceChildren(...renderText(task.content));
|
||||
item.appendChild(itemContent);
|
||||
list.append(item);
|
||||
|
|
|
|||
|
|
@ -280,6 +280,8 @@ button {
|
|||
}
|
||||
|
||||
.note.readonly ul {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
wdith: 100%;
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
|
|
@ -293,10 +295,15 @@ button {
|
|||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
task-list li:has(.checkbox input:checked) {
|
||||
.note.readonly ul li.checked {
|
||||
order: 1;
|
||||
}
|
||||
|
||||
.note.readonly ul li.checked .content {
|
||||
text-decoration: line-through;
|
||||
color: var(--inactive-color);
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue