diff --git a/src/static/style.css b/src/static/style.css index f1b7707..59b401f 100644 --- a/src/static/style.css +++ b/src/static/style.css @@ -174,3 +174,43 @@ tr:hover:not(.selected) { #database-nutrition-table tr.selected { background-color: #f0e68c; } + + +#password-prompt { + margin-top: 10px; + display: flex; + align-items: center; + justify-content: center; +} + +#password-prompt input[type="password"] { + padding: 8px; + margin-right: 10px; + border: 1px solid #ddd; + border-radius: 4px; +} + +#password-prompt button { + padding: 8px 15px; + margin-right: 10px; + border: none; + border-radius: 4px; + cursor: pointer; + color: white; +} + +#password-prompt button[type="submit"] { + background-color: #008C50; /* Helles Grün */ +} + +#password-prompt button[type="submit"]:hover { + background-color: #007344; /* Dunkleres Grün */ +} + +#password-prompt button[type="button"] { + background-color: #640000; /* Helles Rot */ +} + +#password-prompt button[type="button"]:hover { + background-color: #490000; /* Dunkleres Rot */ +} diff --git a/src/templates/nutrition.html b/src/templates/nutrition.html index 56ae965..faf34a2 100644 --- a/src/templates/nutrition.html +++ b/src/templates/nutrition.html @@ -61,8 +61,10 @@ table.addEventListener('click', function(e) { if (e.target.tagName === 'TD') { e.target.parentNode.classList.toggle('selected'); + updateDeleteButtonState(); } }); + updateDeleteButtonState(); }); function deleteSelectedRows() { @@ -95,6 +97,15 @@ } } + function updateDeleteButtonState() { + const selectedRows = document.querySelectorAll('#nutrition-table .selected').length; + const deleteButton = document.getElementById('delete-row-button'); + deleteButton.disabled = selectedRows === 0; + if (selectedRows === 0) { + hidePasswordPrompt(); // Versteckt die Passwort-Eingabe, falls keine Zeile ausgewählt ist + } + } + function loadDatabaseEntries() { fetch('/get_database_entries') // Pfad zur entsprechenden Flask-Route