diff --git a/src/main/resources/public/index.html b/src/main/resources/public/index.html index 39c446a..47a4c55 100644 --- a/src/main/resources/public/index.html +++ b/src/main/resources/public/index.html @@ -40,6 +40,10 @@ form input[name="shortUrl"] { text-transform: lowercase; } + + td[name="deleteBtn"] { + text-align: center; + } @@ -48,7 +52,7 @@
- logo Simply + logo Simply Shorten
@@ -65,13 +69,15 @@
- +
+ +
- + diff --git a/src/main/resources/public/js/main.js b/src/main/resources/public/js/main.js index cfa469d..862d045 100644 --- a/src/main/resources/public/js/main.js +++ b/src/main/resources/public/js/main.js @@ -14,10 +14,17 @@ const refreshData = async () => { }; const displayData = (data) => { - const table = document.querySelector("#url-table"); - table.innerHTML = ''; // Clear - data.map(TR) - .forEach(tr => table.appendChild(tr)); + table_box = document.querySelector(".pure-table"); + if (data.length == 0) { + table_box.style.visibility = "hidden"; + } + else { + const table = document.querySelector("#url-table"); + table_box.style.visibility = "visible"; + table.innerHTML = ''; // Clear + data.map(TR) + .forEach(tr => table.appendChild(tr)); + } }; const addErrBox = async () => { @@ -48,6 +55,7 @@ const A = (s) => `${s}`; const A_INT = (s) => `${window.location.host}/${s}`; const deleteButton = (shortUrl) => { + const td = document.createElement("td"); const btn = document.createElement("button"); btn.innerHTML = "×"; @@ -60,8 +68,9 @@ const deleteButton = (shortUrl) => { }).then(_ => refreshData()); } }; - - return btn; + td.setAttribute("name", "deleteBtn"); + td.appendChild(btn); + return td; }; const TD = (s) => {