diff --git a/index.html b/index.html
index a91cade..5f926c6 100644
--- a/index.html
+++ b/index.html
@@ -127,7 +127,7 @@
Sudah dibaca 📚
diff --git a/main.js b/main.js
index b176ffa..005cd55 100644
--- a/main.js
+++ b/main.js
@@ -13,6 +13,7 @@ const clearSearch = document.getElementById("clearSearch");
const bookSubmit = document.getElementById("bookSubmit");
const formInput = document.getElementById("inputBook");
const inputSection = document.getElementById("input_section");
+const bookItems = document.getElementsByClassName("book_item");
/**
*
@@ -32,6 +33,9 @@ clearSearch.addEventListener("click", function () {
clearSearch.style.display = "none";
inputSection.classList.remove("hidden");
inputSection.classList.add("flex");
+ for (const bookItem of bookItems) {
+ bookItem.style.display = "block";
+ }
});
/**
@@ -153,8 +157,7 @@ const filterByName = (title) => {
};
function findBookByName(searchValue) {
- const bookItem = document.getElementsByClassName("book_item");
- for (const book of bookItem) {
+ for (const book of bookItems) {
const itemTitle = book.querySelector(".item-title");
if (
itemTitle.textContent
@@ -215,7 +218,7 @@ function renderBook(book, selector) {
book.isComplete ? "Tandai sedang dibaca" : "Tandai sudah dibaca"
}
-
diff --git a/style.css b/style.css
index 43a10b0..7de9d2e 100644
--- a/style.css
+++ b/style.css
@@ -3,6 +3,7 @@
--main-text-color: #636363;
--second-text-color: #1B263B;
--box-color: #D9D9D9;
+ --danger: #e83023;
--text-box-color: #868686;
--has-read: #84DD63;
--in-read: #A2D8E4;
@@ -194,6 +195,11 @@ color: var(--second-text-color);
.incompleted {
background-color: var(--in-read);
}
+.deleteBook {
+ color: var(--danger);
+ border: 1px solid var(--danger) !important;
+}
+
#searchBookTitle {
background-color: var(--box-color);
@@ -214,6 +220,7 @@ color: var(--second-text-color);
margin-right: 14px;
margin-top: 8px;
cursor: pointer;
+ display: none;
}
footer {