This is an automated email from the ASF dual-hosted git repository.
sbp pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/tooling-trusted-release.git
The following commit(s) were added to refs/heads/main by this push:
new 2d2445e Improve the style of the file movement form
2d2445e is described below
commit 2d2445ed4d8a31879327cfc12fc98d81a5ee969e
Author: Sean B. Palmer <[email protected]>
AuthorDate: Wed May 21 14:26:17 2025 +0100
Improve the style of the file movement form
---
atr/static/js/finish-selected-move.js | 33 +++++++++++++++++---------------
atr/static/ts/finish-selected-move.ts | 36 +++++++++++++++++++----------------
atr/templates/finish-selected.html | 4 ++++
3 files changed, 42 insertions(+), 31 deletions(-)
diff --git a/atr/static/js/finish-selected-move.js
b/atr/static/js/finish-selected-move.js
index 6f96fc6..b871fcc 100644
--- a/atr/static/js/finish-selected-move.js
+++ b/atr/static/js/finish-selected-move.js
@@ -90,32 +90,35 @@ function renderListItems(tbodyElement, items, config) {
itemsToShow.forEach(item => {
const itemPathString = config.itemType === ItemType.Dir && !item ? "."
: String(item || "");
const row = document.createElement("tr");
+ row.className = "atr-table-row-interactive";
const buttonCell = row.insertCell();
- buttonCell.className = "page-table-button-cell";
+ buttonCell.className = "page-table-button-cell text-end";
const pathCell = row.insertCell();
pathCell.className = "page-table-path-cell";
- const button = document.createElement("button");
- button.type = "button";
- button.className = `btn btn-sm m-1 ${config.buttonClassBase}
${config.buttonClassOutline}`;
- button.dataset[config.itemType === ItemType.File ? "filePath" :
"dirPath"] = itemPathString;
+ const span = document.createElement("span");
+ span.className = "page-file-select-text";
+ span.textContent = itemPathString;
if (itemPathString === config.selectedItem) {
row.classList.add("page-item-selected");
row.setAttribute("aria-selected", "true");
- button.textContent = config.buttonTextSelected;
- button.classList.remove(config.buttonClassOutline);
- button.classList.add(config.buttonClassActive);
+ span.classList.add("fw-bold");
+ const arrowSpan = document.createElement("span");
+ arrowSpan.className = "text-success fs-3";
+ arrowSpan.textContent = "→";
+ buttonCell.appendChild(arrowSpan);
}
else {
row.setAttribute("aria-selected", "false");
+ const button = document.createElement("button");
+ button.type = "button";
+ button.className = `btn btn-sm ${config.buttonClassBase}
${config.buttonClassOutline}`;
+ button.dataset[config.itemType === ItemType.File ? "filePath" :
"dirPath"] = itemPathString;
button.textContent = config.buttonTextDefault;
+ if (config.disableCondition(itemPathString,
uiState.currentlySelectedFilePath, uiState.currentlyChosenDirectoryPath,
getParentPath)) {
+ button.disabled = true;
+ }
+ buttonCell.appendChild(button);
}
- if (config.disableCondition(itemPathString,
uiState.currentlySelectedFilePath, uiState.currentlyChosenDirectoryPath,
getParentPath)) {
- button.disabled = true;
- }
- const span = document.createElement("span");
- span.className = "page-file-select-text";
- span.textContent = itemPathString;
- buttonCell.appendChild(button);
pathCell.appendChild(span);
fragment.appendChild(row);
});
diff --git a/atr/static/ts/finish-selected-move.ts
b/atr/static/ts/finish-selected-move.ts
index f969642..e5e89ea 100644
--- a/atr/static/ts/finish-selected-move.ts
+++ b/atr/static/ts/finish-selected-move.ts
@@ -136,37 +136,41 @@ function renderListItems(
itemsToShow.forEach(item => {
const itemPathString = config.itemType === ItemType.Dir && !item ? "."
: String(item || "");
const row = document.createElement("tr");
+ row.className = "atr-table-row-interactive";
const buttonCell = row.insertCell();
- buttonCell.className = "page-table-button-cell";
+ buttonCell.className = "page-table-button-cell text-end";
const pathCell = row.insertCell();
pathCell.className = "page-table-path-cell";
- const button = document.createElement("button") as HTMLButtonElement &
{ dataset: ButtonDataset };
- button.type = "button";
- button.className = `btn btn-sm m-1 ${config.buttonClassBase}
${config.buttonClassOutline}`;
- button.dataset[config.itemType === ItemType.File ? "filePath" :
"dirPath"] = itemPathString;
+ const span = document.createElement("span");
+ span.className = "page-file-select-text";
+ span.textContent = itemPathString;
if (itemPathString === config.selectedItem) {
row.classList.add("page-item-selected");
row.setAttribute("aria-selected", "true");
- button.textContent = config.buttonTextSelected;
- button.classList.remove(config.buttonClassOutline);
- button.classList.add(config.buttonClassActive);
+ span.classList.add("fw-bold");
+
+ const arrowSpan = document.createElement("span");
+ arrowSpan.className = "text-success fs-3";
+ arrowSpan.textContent = "→";
+ buttonCell.appendChild(arrowSpan);
} else {
row.setAttribute("aria-selected", "false");
+
+ const button = document.createElement("button") as
HTMLButtonElement & { dataset: ButtonDataset };
+ button.type = "button";
+ button.className = `btn btn-sm ${config.buttonClassBase}
${config.buttonClassOutline}`;
+ button.dataset[config.itemType === ItemType.File ? "filePath" :
"dirPath"] = itemPathString;
button.textContent = config.buttonTextDefault;
- }
- if (config.disableCondition(itemPathString,
uiState.currentlySelectedFilePath, uiState.currentlyChosenDirectoryPath,
getParentPath)) {
- button.disabled = true;
+ if (config.disableCondition(itemPathString,
uiState.currentlySelectedFilePath, uiState.currentlyChosenDirectoryPath,
getParentPath)) {
+ button.disabled = true;
+ }
+ buttonCell.appendChild(button);
}
- const span = document.createElement("span");
- span.className = "page-file-select-text";
- span.textContent = itemPathString;
-
- buttonCell.appendChild(button);
pathCell.appendChild(span);
fragment.appendChild(row);
});
diff --git a/atr/templates/finish-selected.html
b/atr/templates/finish-selected.html
index b8d28fc..b1af3d8 100644
--- a/atr/templates/finish-selected.html
+++ b/atr/templates/finish-selected.html
@@ -30,6 +30,10 @@
background-color: #e9ecef;
font-weight: 500;
}
+
+ .atr-table-row-interactive {
+ height: 52px;
+ }
</style>
{% endblock stylesheets %}
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
