javier/Stirling-PDF
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Hover tools tooltips (#2290)

Browse Source 
* Multi-tool advert on pages that share functionality

* Update translation files

Signed-off-by: GitHub Action <action@github.com>

* Rtl CSS

* Upgraded tooltips on multitool. Order selected pages list. Repositionicons. Minor additional tweaks

* restore gb translations

* Update translation files

Signed-off-by: GitHub Action <action@github.com>

* remove blankspace

* Restore hover tooltips

* Update translation files

Signed-off-by: GitHub Action <action@github.com>

---------

Signed-off-by: GitHub Action <action@github.com>
Co-authored-by: GitHub Action <action@github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
This commit is contained in:
reecebrowne
2024-11-21 19:33:19 +00:00
committed by GitHub
parent b4b005bc2e
commit 4ebeedc028
40 changed files with 139 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/resources/static/css/multi-tool.css
View File

@@ -295,7 +295,7 @@ label {
flex-wrap: nowrap;
width: fit-content;
padding: 7px;
background-color: rgba(0, 29, 41, 0.6);
background-color: rgba(0, 29, 41, 0.9);
border-radius: 3px;
font-size: 12px;
color: whitesmoke;

10
src/main/resources/static/css/pdfActions.css
View File

@@ -1,5 +1,5 @@
.pdf-actions_button-container {
z-index: 2;
z-index: 4;
display: flex;
opacity: 0;
transition: opacity 0.1s linear;
@@ -46,7 +46,7 @@
width: 80px;
height: 100%;
z-index: 1;
z-index: 3;
opacity: 0;
transition: opacity 0.2s;
}
@@ -116,6 +116,7 @@ html[dir="rtl"] .pdf-actions_container:last-child>.pdf-actions_insert-file-butto
translate: 50% -50%;
aspect-ratio: 1;
border-radius: 100px;
z-index: 4;
}
.pdf-actions_split-file-button {
@@ -125,9 +126,9 @@ html[dir="rtl"] .pdf-actions_container:last-child>.pdf-actions_insert-file-butto
translate: 0 -50%;
aspect-ratio: 1;
border-radius: 100px;
z-index: 3;
}
.pdf-actions_checkbox {
position: absolute;
top: 5px;
@@ -137,7 +138,7 @@ html[dir="rtl"] .pdf-actions_container:last-child>.pdf-actions_insert-file-butto
padding: 6px 8px;
border-radius: 8px;
font-size: 16px;
z-index: 2;
z-index: 3;
}
.hidden {
@@ -150,4 +151,5 @@ html[dir="rtl"] .pdf-actions_container:last-child>.pdf-actions_insert-file-butto
translate: 0% -50%;
aspect-ratio: 1;
border-radius: 100px;
z-index: 5;
}

17
src/main/resources/static/js/multitool/PdfActionsManager.js
View File

@@ -110,31 +110,32 @@ class PdfActionsManager {
const moveUp = document.createElement("button");
moveUp.classList.add("pdf-actions_move-left-button", "btn", "btn-secondary");
moveUp.innerHTML = `<span class="material-symbols-rounded">arrow_${leftDirection}_alt</span>`;
moveUp.innerHTML = `<span class="material-symbols-rounded">arrow_${leftDirection}_alt</span><span class="btn-tooltip">${window.translations.moveLeft}</span>`;
moveUp.onclick = this.moveUpButtonCallback;
buttonContainer.appendChild(moveUp);
const moveDown = document.createElement("button");
moveDown.classList.add("pdf-actions_move-right-button", "btn", "btn-secondary");
moveDown.innerHTML = `<span class="material-symbols-rounded">arrow_${rightDirection}_alt</span>`;
moveDown.innerHTML = `<span class="material-symbols-rounded">arrow_${rightDirection}_alt</span><span class="btn-tooltip">${window.translations.moveRight}</span>`;
moveDown.onclick = this.moveDownButtonCallback;
buttonContainer.appendChild(moveDown);
const rotateCCW = document.createElement("button");
rotateCCW.classList.add("btn", "btn-secondary");
rotateCCW.innerHTML = `<span class="material-symbols-rounded">rotate_left</span>`;
rotateCCW.innerHTML = `<span class="material-symbols-rounded">rotate_left</span><span class="btn-tooltip">${window.translations.rotateLeft}</span>`;
rotateCCW.onclick = this.rotateCCWButtonCallback;
buttonContainer.appendChild(rotateCCW);
const rotateCW = document.createElement("button");
rotateCW.classList.add("btn", "btn-secondary");
rotateCW.innerHTML = `<span class="material-symbols-rounded">rotate_right</span>`;
rotateCW.innerHTML = `<span class="material-symbols-rounded">rotate_right</span><span class="btn-tooltip">${window.translations.rotateRight}</span>`;
rotateCW.onclick = this.rotateCWButtonCallback;
buttonContainer.appendChild(rotateCW);
const deletePage = document.createElement("button");
deletePage.classList.add("btn", "btn-danger");
deletePage.innerHTML = `<span class="material-symbols-rounded">delete</span>`;
deletePage.innerHTML = `<span class="material-symbols-rounded">delete</span><span class="btn-tooltip"></span><span class="btn-tooltip">${window.translations.delete}</span>`;
deletePage.onclick = this.deletePageButtonCallback;
buttonContainer.appendChild(deletePage);
@@ -189,19 +190,19 @@ class PdfActionsManager {
const insertFileButton = document.createElement("button");
insertFileButton.classList.add("btn", "btn-primary", "pdf-actions_insert-file-button");
insertFileButton.innerHTML = `<span class="material-symbols-rounded">add</span>`;
insertFileButton.innerHTML = `<span class="material-symbols-rounded">add</span></span><span class="btn-tooltip">${window.translations.addFile}</span>`;
insertFileButton.onclick = this.insertFileButtonCallback;
insertFileButtonContainer.appendChild(insertFileButton);
const splitFileButton = document.createElement("button");
splitFileButton.classList.add("btn", "btn-primary", "pdf-actions_split-file-button");
splitFileButton.innerHTML = `<span class="material-symbols-rounded">cut</span>`;
splitFileButton.innerHTML = `<span class="material-symbols-rounded">cut</span></span><span class="btn-tooltip">${window.translations.split}</span>`;
splitFileButton.onclick = this.splitFileButtonCallback;
insertFileButtonContainer.appendChild(splitFileButton);
const insertFileBlankButton = document.createElement("button");
insertFileBlankButton.classList.add("btn", "btn-primary", "pdf-actions_insert-file-blank-button");
insertFileBlankButton.innerHTML = `<span class="material-symbols-rounded">insert_page_break</span>`;
insertFileBlankButton.innerHTML = `<span class="material-symbols-rounded">insert_page_break</span></span><span class="btn-tooltip">${window.translations.insertPageBreak}</span>`;
insertFileBlankButton.onclick = this.insertFileBlankButtonCallback;
insertFileButtonContainer.appendChild(insertFileBlankButton);