chris/toadstoolTally
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move rename pencil next to title and support 3-column grid on wide screens

Browse Source
This commit is contained in:
chris 2025-12-09 11:46:13 -05:00
parent 554072e9dd
commit 710b32191a
2 changed files with 9 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
assets/app.js
View File

@ -407,12 +407,12 @@ function render() {
projectContainer.style = `--project-color: ${project.color}`; projectContainer.style = `--project-color: ${project.color}`;
projectContainer.innerHTML = ` projectContainer.innerHTML = `
<div class="project-header"> <div class="project-header">
<div class="project-title-group" onclick="toggleProjectCollapse(${project.id})"> <div class="project-title-group">
<button class="btn-toggle-project">▼</button> <button class="btn-toggle-project" onclick="toggleProjectCollapse(${project.id})">▼</button>
<span class="project-title">${project.name}</span> <span class="project-title">${project.name}</span>
<button class="btn-rename-project" onclick="renameProject(${project.id})" title="Rename project"><span class="icon-pencil">✎</span></button>
</div> </div>
<div class="project-actions"> <div class="project-actions">
<button class="btn-rename-project" onclick="renameProject(${project.id})" title="Rename project"><span class="icon-pencil">✎</span></button>
<button class="btn-add-part" onclick="openModal('addPart', ${project.id})">+ Part</button> <button class="btn-add-part" onclick="openModal('addPart', ${project.id})">+ Part</button>
<button class="btn-delete-project" onclick="deleteProject(${project.id})">×</button> <button class="btn-delete-project" onclick="deleteProject(${project.id})">×</button>
</div> </div>

6
assets/style.css
View File

@ -133,6 +133,12 @@ h1 {
gap: 20px; gap: 20px;
} }
@media (min-width: 1280px) {
.projects-grid {
grid-template-columns: repeat(3, minmax(320px, 1fr));
}
}
/* --- PROJECT CONTAINER --- */ /* --- PROJECT CONTAINER --- */
.project-container { .project-container {
background: var(--card-bg); background: var(--card-bg);