diff --git a/static/css/style.css b/static/css/style.css index 0e5b643..9551db2 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -182,6 +182,11 @@ body { background-color: #229954; } +button:disabled { + opacity: 0.5; + cursor: not-allowed; +} + .error-message { color: #e74c3c; margin-bottom: 1rem; diff --git a/static/js/tasks.js b/static/js/tasks.js index 6b6f0fc..6b7ed26 100644 --- a/static/js/tasks.js +++ b/static/js/tasks.js @@ -235,6 +235,7 @@ function selectTask(taskId) { document.getElementById("edit-task-title").value = task.title; document.getElementById("edit-task-desc").value = task.desc || ""; document.getElementById("side-panel-error").textContent = ""; + updateSaveButton(); document.querySelectorAll(".status-btn").forEach(btn => { btn.classList.toggle("active", btn.dataset.status === task.status); @@ -246,6 +247,17 @@ function selectTask(taskId) { } } +function updateSaveButton() { + const task = tasks.find(t => t.id === selectedTaskId); + if (!task) return; + + const title = document.getElementById("edit-task-title").value.trim(); + const desc = document.getElementById("edit-task-desc").value; + + const changed = title !== task.title || desc !== (task.desc || ""); + document.getElementById("save-task-btn").disabled = !changed; +} + function closeSidePanel() { if (isLandscapeMode()) return; document.getElementById("side-panel").classList.remove("active"); @@ -392,8 +404,12 @@ document.addEventListener("DOMContentLoaded", () => { document.getElementById("side-panel-close").addEventListener("click", closeSidePanel); document.getElementById("save-task-btn").addEventListener("click", saveTask); + document.getElementById("save-task-btn").disabled = true; document.getElementById("delete-task-btn").addEventListener("click", deleteTask); + document.getElementById("edit-task-title").addEventListener("input", updateSaveButton); + document.getElementById("edit-task-desc").addEventListener("input", updateSaveButton); + initWheelScroll(); loadGoals(); });