randogoth/kanban-todo.txt
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added checkbox for setting card as checked/unchecked.

Browse source
This commit is contained in:
Chris McCormick 2025-12-30 20:19:22 +08:00
parent f430ad11ee
commit e3f16e914d
2 changed files with 35 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

18
TODO.md
View file

@ -2,19 +2,21 @@
## TODO
- [ ] Minimize the number of times the user is asked for access. If possible ask for all the access required at one time.
- [ ] When dragging between columns we should show the insertion point and insert the card at that point.
- [ ] When moving between columns don't insert an extra newline before, unless moving to an empty column.
- [x] Give each column a max width of 450px and have them stretch to fill the area up to that.
- [x] Don't put carriage returns between individual TODO list items. As far as possible try to preserve original formatting, just moving individual lines around without disturbing other lines.
- [ ] Ability to create, move, remove columns.
- [ ] Make it look more the makesprite/concrete.css theme.
- [ ] Check mark type of UI for marking items complete/uncomplete.
- [ ] Ability to create a project on the projects select page, including if TODO.md is empty.
- [ ] Plus button in the columns to add a new item, with text input.
- [ ] Ability to create, move, remove columns.
- [ ] Ability to create a project on the projects select page, including if TODO.md is empty.
- [ ] Minimize the number of times the user is asked for access. If possible ask for all the access required at one time.
## In progress
## Done
- [x] Dropdown for setting the card as checked/unchecked.
- [x] Make it look more the makesprite/concrete.css theme.
- [x] When moving between columns don't insert an extra newline before, unless moving to an empty column.
- [x] Give each column a max width of 450px and have them stretch to fill the area up to that.
- [x] Don't put carriage returns between individual TODO list items. As far as possible try to preserve original formatting, just moving individual lines around without disturbing other lines.

27
index.html
View file

@ -155,6 +155,7 @@
cursor: grab;
user-select: none;
word-wrap: break-word;
position: relative;
}
.card:hover {
@ -175,6 +176,21 @@
border: .1rem dashed var(--fg);
}
.card-checkbox {
float: right;
width: 1em;
height: 1em;
border: .1rem solid var(--fg);
border-radius: 2px;
cursor: pointer;
background: transparent;
margin-left: 0.5em;
}
.card-checkbox.checked {
background: var(--fg);
}
/* Section Picker */
.section-list {
list-style: none;
@ -581,7 +597,6 @@
const cardDiv = document.createElement('div');
cardDiv.className = `card ${card.completed ? 'completed' : ''}`;
cardDiv.textContent = card.text;
cardDiv.draggable = true;
cardDiv.dataset.lineNumber = card.lineNumber;
@ -589,7 +604,10 @@
cardDiv.dataset.colIndex = colIndex;
cardDiv.dataset.cardIndex = cardIndex;
cardDiv.onclick = async () => {
const checkbox = document.createElement('div');
checkbox.className = `card-checkbox ${card.completed ? 'checked' : ''}`;
checkbox.onclick = async (e) => {
e.stopPropagation();
const lineNum = parseInt(cardDiv.dataset.lineNumber);
const originalLine = cardDiv.dataset.originalLine;
@ -599,6 +617,11 @@
await updateLineInFile(lineNum, newLine);
};
cardDiv.appendChild(checkbox);
const textSpan = document.createElement('span');
textSpan.textContent = card.text;
cardDiv.appendChild(textSpan);
cardDiv.ondragstart = (e) => handleDragStart(e, cardDiv);
cardDiv.ondragend = handleDragEnd;