diff --git a/static/scripts/documents-table.js b/static/scripts/documents-table.js index 7bc29c6..ee39b0d 100644 --- a/static/scripts/documents-table.js +++ b/static/scripts/documents-table.js @@ -7,15 +7,16 @@ $(document).ready(function () { documents.forEach((doc) => { const row = document.createElement("tr"); - row.setAttribute( - "onclick", - `window.open('` + API_SERVER + `/` + doc.path + `', '_blank')` - ); const data = document.createElement("td"); const rowContainer = document.createElement("div"); - rowContainer.setAttribute("class", "row-container"); + rowContainer.setAttribute("class", "row-container with-button"); + + rowContainer.setAttribute( + "onclick", + `window.open('` + API_SERVER + `/` + doc.path + `', '_blank')` + ); const rowIcon = document.createElement("div"); rowIcon.setAttribute("class", "row-icon"); @@ -62,6 +63,7 @@ $(document).ready(function () { const documentName = document.createElement("h1"); documentName.textContent = doc.name; + documentName.setAttribute("id", `doc-name-${doc.id}`); rowContent.appendChild(documentName); const documentType = document.createElement("h2"); @@ -74,27 +76,31 @@ $(document).ready(function () { rowContainer.appendChild(rowContent); - // const deleteIcon = document.createElement("div"); - // deleteIcon.setAttribute("class", "row-delete-icon"); - - // let deleteContent = ` - // - // `; - - // deleteIcon.innerHTML = deleteContent; - - // rowContainer.appendChild(deleteIcon); - data.appendChild(rowContainer); + + if (isAdmin && isFull) { + const deleteContainer = document.createElement("div"); + deleteContainer.setAttribute("class", "row-delete-container"); + deleteContainer.setAttribute("onclick", `deleteDoc(${doc.id});`); + + let deleteContent = ` + + `; + + deleteContainer.innerHTML = deleteContent; + + data.appendChild(deleteContainer); + } + row.appendChild(data); tbody.appendChild(row); }); diff --git a/static/styles/main.css b/static/styles/main.css index 29a3cb7..4b62f52 100644 --- a/static/styles/main.css +++ b/static/styles/main.css @@ -1461,21 +1461,47 @@ input::placeholder { border-radius: 8px; } -.project-content td, -.progress-content td { +.project-content td .row-container, +.progress-content td .row-container { border-radius: 8px; cursor: pointer; padding: 0 10px; } -.project-content td:hover, -.progress-content td:hover { +.progress-content td { + display: flex; + flex-direction: row; + flex-grow: 1; + flex-shrink: 1; +} + +.project-content td .row-container:hover, +.progress-content td .row-container:hover { + background: rgba(232, 232, 237, 0.8); +} + +.row-delete-container { + margin: auto 10px; + padding: 9px; + border-radius: 5px; + display: flex; + justify-content: center; + align-items: center; + align-content: center; + justify-items: center; + transition: 0.3s; + cursor: pointer; +} + +.row-delete-container:hover { background: rgba(232, 232, 237, 0.8); } .project-content .row-container, .progress-content .row-container { display: flex; + width: 100%; + box-sizing: border-box; } .project-content .row-icon, diff --git a/static/templates/project/documents.html b/static/templates/project/documents.html index f617b34..c10d861 100644 --- a/static/templates/project/documents.html +++ b/static/templates/project/documents.html @@ -27,6 +27,8 @@ }, {{/each}} ]; + const isAdmin = {{IsAdmin}}; + const isFull = true; @@ -231,6 +233,17 @@ + {{#if IsAdmin}} +