diff --git a/assets/scripts/script.js b/assets/scripts/script.js
index ee0891b..9833bdf 100644
--- a/assets/scripts/script.js
+++ b/assets/scripts/script.js
@@ -4,31 +4,33 @@ const noteBody = document.querySelector(".__body textarea");
const selectAllButton = document.querySelector("._select-all");
const deleteAllButton = document.querySelector("._delete-all");
+const confirmDeleteButton = document.querySelector("._delete-confirm");
const saveToLocalButton = document.querySelector("._save-to-local");
function selectAll() {
noteBody.select();
};
-function deleteAll() {
- deleteChoices.classList.toggle("hidden");
+function showDeleteConfirm() {
+ confirmDeleteButton.style.display = "inline";
+ deleteAllButton.style.display = "none";
- let yesDelete = document.querySelector(".yes-delete");
- let noDelete = document.querySelector(".no-delete");
+ // setTimeout is leaving a little bug, but I will fix it later (maybe).
+ setTimeout(() => {
+ confirmDeleteButton.style.display = "none";
+ deleteAllButton.style.display = "inline";
+ }, 2500);
+};
- yesDelete.addEventListener("click", () => {
- deleteChoices.classList.add("hidden");
+function confirmDelete() {
+ confirmDeleteButton.style.display = "none";
+ deleteAllButton.style.display = "inline";
- noteTitle.value = "";
- noteBody.value = "";
+ noteTitle.value = "";
+ noteBody.value = "";
- storage.saveData.saveTitle();
- storage.saveData.saveText();
- });
-
- noDelete.addEventListener("click", () => {
- deleteChoices.classList.add("hidden");
- });
+ saveText();
+ saveTitle();
};
function downloadNote() {
@@ -72,7 +74,8 @@ noteTitle.addEventListener("input", saveTitle);
noteBody.addEventListener("input", saveText);
selectAllButton.addEventListener("click", selectAll);
-deleteAllButton.addEventListener("click", deleteAll);
+deleteAllButton.addEventListener("click", showDeleteConfirm);
+confirmDeleteButton.addEventListener("click", confirmDelete);
saveToLocalButton.addEventListener("click", downloadNote);
document.addEventListener("DOMContentLoaded", () => {
diff --git a/assets/styles/style.css b/assets/styles/style.css
index 4e062b8..e13e6cb 100644
--- a/assets/styles/style.css
+++ b/assets/styles/style.css
@@ -93,17 +93,21 @@ main {
border-right: var(--border-shorthand);
}
-.__function button:hover,
-.__function button:focus {
+.__function button:hover {
color: var(--button-hover-color);
background: var(--button-hover-backround);
}
-._delete-all {
+._delete-all,
+._delete-confirm {
color: #fff;
background: #fd6060;
}
+._delete-confirm {
+ display: none;
+}
+
._save-to-local {
border-left: var(--border-shorthand) !important;
margin-left: auto;
diff --git a/index.html b/index.html
index 63bc1ab..4158392 100644
--- a/index.html
+++ b/index.html
@@ -25,10 +25,7 @@
-
- Are you sure?
-
-
+