saulteafarmer/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Stirling-Tools/Stirling-PDF.git synced 2025-08-27 06:39:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix manual scaling issues for nav

Browse Source
This commit is contained in:
Reece 2025-07-02 23:26:18 +01:00
parent 94246990bb
commit 037e4da5c6
1 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
stirling-pdf/src/main/resources/templates/fragments/common.html
View File

@ -27,13 +27,12 @@
function scaleNav() { function scaleNav() {
const currentDPR = window.devicePixelRatio || 1; const currentDPR = window.devicePixelRatio || 1;
if (currentDPR <= 1) { // Always counter the scaling
return; // No scaling needed at normal zoom
}
const navScale = 1 / currentDPR; const navScale = 1 / currentDPR;
const dropdownScale = 1 / Math.sqrt(currentDPR); const dropdownScale = 1 / Math.sqrt(currentDPR);
console.log('DPR:', currentDPR, 'navScale:', navScale, 'will apply scaling');
const navbar = document.querySelector('.navbar'); const navbar = document.querySelector('.navbar');
if (navbar) { if (navbar) {
@ -41,6 +40,8 @@
navbar.style.transformOrigin = 'top center'; navbar.style.transformOrigin = 'top center';
navbar.style.width = `${100 / navScale}%`; navbar.style.width = `${100 / navScale}%`;
navbar.style.left = '50%'; navbar.style.left = '50%';
console.log('Applied navbar scale:', navScale); console.log('Applied navbar scale:', navScale);
} }
@ -53,7 +54,18 @@
}, 100); }, 100);
} }
let lastDPR = window.devicePixelRatio;
document.addEventListener('DOMContentLoaded', scaleNav); document.addEventListener('DOMContentLoaded', scaleNav);
// Poll for DPR changes every 200ms
setInterval(() => {
const currentDPR = window.devicePixelRatio;
if (Math.abs(currentDPR - lastDPR) > 0.01) {
lastDPR = currentDPR;
scaleNav();
}
}, 200);
</script> </script>
<script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script> <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script>
<script th:src="@{'/js/fetch-utils.js'}"></script> <script th:src="@{'/js/fetch-utils.js'}"></script>