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

Svcale fixes

Browse Source
This commit is contained in:
Reece 2025-07-02 12:12:41 +01:00
parent ceacdefa3e
commit f538632a08
2 changed files with 25 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
stirling-pdf/src/main/resources/static/css/footer.css
View File

@ -11,6 +11,7 @@
align-items: center; /* Center children horizontally */ align-items: center; /* Center children horizontally */
flex-grow: 1; flex-grow: 1;
flex-direction: column; flex-direction: column;
margin-top: 1rem;;
} }
.footer-powered-by { .footer-powered-by {

26
stirling-pdf/src/main/resources/templates/home.html
View File

@ -7,9 +7,9 @@
</head> </head>
<body> <body>
<div class="page-container" style="min-height:98vh; overflow-x:hidden; display:flex; flex-direction:column;"> <div class="page-container" style="height:98vh; max-height:98vh; overflow-x:hidden;">
<th:block th:insert="~{fragments/navbar.html :: navbar}"></th:block> <th:block th:insert="~{fragments/navbar.html :: navbar}"></th:block>
<div class="main-content " style="transform-origin: center top; zoom:68%; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-start;" > <div style="transform-origin: center top; flex:0 1 auto; display:flex; flex-direction:column; align-items:center; justify-content:flex-start;" id="scale-wrap">
<br class="d-md-none"> <br class="d-md-none">
<!-- Features --> <!-- Features -->
<script th:src="@{'/js/homecard.js'}"></script> <script th:src="@{'/js/homecard.js'}"></script>
@ -68,7 +68,7 @@
</select> </select>
</div> </div>
<div <div
style="display: flex; align-items: center; flex-wrap: wrap; align-content: flex-start; width: fit-content; max-width: 100%; gap:2rem; justify-content: center;"> style="display: flex; align-items: center; flex-wrap: wrap; align-content: flex-start; width: fit-content; max-width: 100%; gap:2rem; justify-content: center;" >
<div th:title="#{home.setFavorites}" style="display: flex; align-items: center; cursor: pointer;" <div th:title="#{home.setFavorites}" style="display: flex; align-items: center; cursor: pointer;"
onclick="toggleFavoritesMode()"> onclick="toggleFavoritesMode()">
<span class="material-symbols-rounded toggle-favourites" <span class="material-symbols-rounded toggle-favourites"
@ -117,8 +117,6 @@
</div> </div>
</div> </div>
</div>
<div style="scale:70%" >
<th:block th:insert="~{fragments/footer.html :: footer}"></th:block> <th:block th:insert="~{fragments/footer.html :: footer}"></th:block>
</div> </div>
</div> </div>
@ -217,7 +215,25 @@
window.showSurvey = /*[[${showSurveyFromDocker}]]*/ true window.showSurvey = /*[[${showSurveyFromDocker}]]*/ true
</script> </script>
<script th:src="@{'/js/pages/home.js'}" th:inline="javascript"></script> <script th:src="@{'/js/pages/home.js'}" th:inline="javascript"></script>
<script>
function applyScale() {
const baseWidth = 1440;
const baseHeight = 1000;
const scaleX = window.innerWidth / baseWidth;
const scaleY = window.innerHeight / baseHeight;
const scale = Math.max(0.9, Math.min(scaleX, scaleY)); // keep aspect ratio, honor minScale
const ui = document.getElementById('scale-wrap');
const finalScale = scale * 0.74;
const originalHeight = ui.scrollHeight;
ui.style.transform = `scale(${finalScale})`;
ui.style.transformOrigin = 'top center';
ui.style.height = `${originalHeight * finalScale}px`;
}
applyScale();
setTimeout(applyScale, 100);
</script>
</body> </body>
</html> </html>