Feature/ux improvements (#2288)

* 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

---------

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 17:34:50 +00:00
committed by GitHub
parent b92bcfe915
commit b4b005bc2e
40 changed files with 309 additions and 43 deletions

View File

@@ -31,64 +31,79 @@
<span class="material-symbols-rounded">
add
</span>
<span class="btn-tooltip" th:text="#{multiTool.addFile}"></span>
</button>
<button class="btn btn-secondary enable-on-file" onclick="rotateAll(-90)" disabled>
<span class="material-symbols-rounded">
rotate_left
</span>
<span class="btn-tooltip" th:text="#{multiTool.rotateLeft}"></span>
</button>
<button class="btn btn-secondary enable-on-file" onclick="rotateAll(90)" disabled>
<span class="material-symbols-rounded">
rotate_right
</span>
<span class="btn-tooltip" th:text="#{multiTool.rotateRight}"></span>
</button>
<button class="btn btn-secondary enable-on-file" onclick="splitAll()" disabled>
<span class="material-symbols-rounded">
cut
</span>
</button>
<button id="select-pages-container" class="btn btn-secondary enable-on-file"
th:title="#{multiTool.selectPages}" onclick="toggleSelectPageVisibility()" disabled>
<span id="select-pages-button" class="material-symbols-rounded">
event_list
</span>
</button>
<button id="select-All-Container" class="btn btn-secondary enable-on-file hidden"
onclick="toggleSelectAll()" disabled>
<span th:title="#{multiTool.selectAll}" class="material-symbols-rounded"
id="select-icon">select_all</span>
<span th:title="#{multiTool.deselectAll}" class="material-symbols-rounded" style="display: none;"
id="deselect-icon">deselect</span>
</button>
<div class=" button-container">
<button th:title="#{multiTool.deleteSelected}" id="delete-button" class="btn btn-danger hidden"
onclick="deleteSelected()">
<span class="material-symbols-rounded">delete</span>
</button>
</div>
<button id="export-selected-button" class="btn btn-primary enable-on-file hidden"
onclick="exportPdf(true)" disabled>
<span th:title="#{multiTool.downloadSelected}" class="material-symbols-rounded">
file_save
</span>
<span class="btn-tooltip" th:text="#{multiTool.split}"></span>
</button>
<button class="btn btn-secondary enable-on-file" onclick="addFilesBlankAll()" disabled>
<span class="material-symbols-rounded">
insert_page_break
</span>
<span class="btn-tooltip" th:text="#{multiTool.insertPageBreak}"></span>
</button>
<button id="export-button" class="btn btn-primary enable-on-file" onclick="exportPdf(false)" disabled>
<span th:title="#{multiTool.downloadAll}" class="material-symbols-rounded">
download
<button id="select-pages-container" class="btn btn-secondary enable-on-file"
onclick="toggleSelectPageVisibility()" disabled>
<span id="select-pages-button" class="material-symbols-rounded">
event_list
</span>
<span class="btn-tooltip" th:text="#{multiTool.selectPages}"></span>
</button>
<button id="deselect-All-Container" class="btn btn-secondary enable-on-file hidden"
onclick="toggleSelectAll()" disabled>
<span class="material-symbols-rounded" id="deselect-icon">deselect</span>
<span class="btn-tooltip" th:text="#{multiTool.deselectAll}"></span>
</button>
<button id="select-All-Container" class="btn btn-secondary enable-on-file hidden"
onclick="toggleSelectAll()" disabled>
<span class="material-symbols-rounded"
id="select-icon">select_all</span>
<span class="btn-tooltip" th:text="#{multiTool.selectAll}"></span>
</button>
<div class="button-container">
<button id="delete-button" class="btn btn-danger delete hidden" onclick="deleteSelected()">
<span class="material-symbols-rounded">delete</span>
<span class="btn-tooltip" th:text="#{multiTool.deleteSelected}"></span>
</button>
</div>
<div style="margin-left:auto">
<button id="export-selected-button" class="btn btn-primary enable-on-file hidden"
onclick="exportPdf(true)" disabled>
<span class="btn-tooltip" th:text="#{multiTool.downloadSelected}"></span>
<span class="material-symbols-rounded">
file_save
</span>
</button>
<button id="export-button" class="btn btn-primary enable-on-file" onclick="exportPdf(false)"
disabled>
<span class="material-symbols-rounded">
download
</span>
<span class="btn-tooltip" th:text="#{multiTool.downloadAll}"></span>
</button>
</div>
</div>
<div id="selected-pages-display" class="selected-pages-container hidden">
<div style="display:flex; height:3rem; margin-right:1rem">
<h5 th:text="#{multiTool.selectedPages}" style="white-space: nowrap; margin-right: 1rem;">Selected
Pages</h5>
<input type="text" id="csv-input" class="form-control" style="height:2.5rem" placeholder="1,3,5-10"
value="">
<input type="text" id="csv-input" class="form-control" style="height:2.5rem" placeholder="1,3,5-10" value="">
</div>
<ul id="selected-pages-list" class="pages-list"></ul>
</div>