Hover tools tooltips (#2290)

* 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>

src/main/resources/messages_ar_AR.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=هذه الميزة متوفرة في <a href="{0}">صفحة الأدوات المتعددة</a> لدينا. اطلع عليها للحصول على واجهة مستخدم محسّنة لكل صفحة وميزات إضافية!

src/main/resources/messages_bg_BG.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_ca_CA.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_cs_CZ.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_da_DK.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_de_DE.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=Diese Funktion ist auch auf unserer <a href="{0}">PDF-Multitool-Seite</a> verfügbar. Probieren Sie sie aus, denn sie bietet eine verbesserte Benutzeroberfläche und zusätzliche Funktionen!

src/main/resources/messages_el_GR.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_en_GB.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_en_US.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_es_ES.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_eu_ES.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_fr_FR.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_ga_IE.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_hi_IN.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_hr_HR.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_hu_HU.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_id_ID.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_it_IT.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=Questa funzione è disponibile anche nella nostra <a href="{0}">pagina multi-strumento</a>. Scoprila per un'interfaccia utente pagina per pagina migliorata e funzionalità aggiuntive!

src/main/resources/messages_ja_JP.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_ko_KR.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_nl_NL.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_no_NB.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_pl_PL.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_pt_BR.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_pt_PT.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_ro_RO.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_ru_RU.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_sk_SK.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_sr_LATN_RS.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_sv_SE.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_th_TH.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_tr_TR.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_uk_UA.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_vi_VN.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_zh_CN.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/messages_zh_TW.properties

@@ -949,6 +949,9 @@ multiTool.addFile=Add File
 multiTool.rotateLeft=Rotate Left
 multiTool.rotateRight=Rotate Right
 multiTool.split=Split
+multiTool.moveLeft=Move Left
+multiTool.moveRight=Move Right
+multiTool.delete=Delete
 
 #multiTool-advert
 multiTool-advert.message=This feature is also available in our <a href="{0}">multi-tool page</a>. Check it out for enhanced page-by-page UI and additional features!

src/main/resources/static/css/multi-tool.css

@@ -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;

src/main/resources/static/css/pdfActions.css

@@ -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;
 }

src/main/resources/static/js/multitool/PdfActionsManager.js

@@ -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);
 

src/main/resources/templates/multi-tool.html

@@ -136,6 +136,20 @@
     window.selectedPages = [];
     window.selectPage = false;
     window.selectAll = false;
+
+    window.translations = {
+        rotateLeft: '[[#{multiTool.rotateLeft}]]',
+        rotateRight: '[[#{multiTool.rotateRight}]]',
+        moveLeft: '[[#{multiTool.moveLeft}]]',
+        moveRight: '[[#{multiTool.moveRight}]]',
+        delete: '[[#{multiTool.delete}]]',
+        split: '[[#{multiTool.split}]]',
+        addFile: '[[#{multiTool.addFile}]]',
+        insertPageBreak:'[[#{multiTool.insertPageBreak}]]'
+    };
+
+
+
     const csvInput = document.getElementById("csv-input");
     csvInput.addEventListener("keydown", function (event) {
       if (event.key === "Enter") {
@@ -177,4 +191,4 @@
   </script>
 </body>
 
-</html>
+</html>