further bug fixes when using context path (#1475)

Co-authored-by: Anthony Stirling <77850077+Frooodle@users.noreply.github.com>

src/main/resources/templates/account.html

@@ -329,8 +329,8 @@
                 });
               </script>
               <div class="mb-3 mt-4 text-center">
-                <a href="logout" role="button" class="btn btn-danger" th:text="#{account.signOut}">Sign Out</a>
+                <a th:href="@{'/logout'}" role="button" class="btn btn-danger" th:text="#{account.signOut}">Sign Out</a>
-                <a th:if="${role == 'ROLE_ADMIN'}" class="btn btn-info" href="addUsers" role="button" th:text="#{account.adminSettings}" target="_blank">Admin Settings</a>
+                <a th:if="${role == 'ROLE_ADMIN'}" class="btn btn-info" th:href="@{'/addUsers'}" role="button" th:text="#{account.adminSettings}" target="_blank">Admin Settings</a>
               </div>
             </div>
           </div>

src/main/resources/templates/auto-split-pdf.html

@@ -21,7 +21,7 @@
               <span class="tool-header-text" th:text="#{autoSplitPDF.header}"></span>
             </div>
 
-            <form method="post" enctype="multipart/form-data" th:action="@{api/v1/misc/auto-split-pdf}">
+            <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/misc/auto-split-pdf'}">
               <p th:text="#{autoSplitPDF.formPrompt}"></p>
               <div
                 th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}">
@@ -43,9 +43,9 @@
                   <li th:text="#{autoSplitPDF.selectText.3}"></li>
                   <li th:text="#{autoSplitPDF.selectText.4}"></li>
                 </ul>
-                <p><a th:href="@{files/Auto%20Splitter%20Divider%20(minimal).pdf}" download
+                <p><a th:href="@{'/files/Auto%20Splitter%20Divider%20(minimal).pdf'}" download
                     th:text="#{autoSplitPDF.dividerDownload1}"></a></p>
-                <p><a th:href="@{files/Auto%20Splitter%20Divider%20(with%20instructions).pdf}" download
+                <p><a th:href="@{'/files/Auto%20Splitter%20Divider%20(with%20instructions).pdf'}" download
                     th:text="#{autoSplitPDF.dividerDownload2}"></a></p>
               </div>
 

src/main/resources/templates/convert/book-to-pdf.html

@@ -14,7 +14,7 @@
           <div class="row justify-content-center">
             <div class="col-md-6">
               <h2 th:text="#{BookToPDF.header}"></h2>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/book/pdf}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/book/pdf'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false)}"></div>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{BookToPDF.submit}"></button>
               </form>

src/main/resources/templates/convert/file-to-pdf.html

@@ -20,7 +20,7 @@
               <span class="tool-header-text" th:text="#{fileToPDF.header}"></span>
             </div>
             <p th:text="#{processTimeWarning}"></p>
-            <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/file/pdf}">
+            <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/file/pdf'}">
               <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false)}"></div>
               <a class="btn btn-outline-primary" data-bs-toggle="collapse" href="#info" role="button"
                 aria-expanded="false" aria-controls="info" th:text="#{fileToPDF.supportedFileTypesInfo}"></a>

src/main/resources/templates/convert/html-to-pdf.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon convert">html</span>
                 <span class="tool-header-text" th:text="#{HTMLToPDF.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/html/pdf}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/html/pdf'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='text/html,application/zip' )}"></div>
                 <div class="mb-3">
                   <label for="zoom" th:text="#{HTMLToPDF.zoom}" class="form-label"></label>

src/main/resources/templates/convert/img-to-pdf.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon image">image</span>
                 <span class="tool-header-text" th:text="#{imageToPDF.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/img/pdf}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/img/pdf'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='image/*', inputText=#{imgPrompt})}"></div>
                 <div class="mb-3">
                   <label for="fitOption" th:text="#{imageToPDF.selectLabel}">Fit Options</label>

src/main/resources/templates/convert/markdown-to-pdf.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon convert">markdown</span>
                 <span class="tool-header-text" th:text="#{MarkdownToPDF.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/markdown/pdf}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/markdown/pdf'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='text/markdown')}"></div>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{MarkdownToPDF.submit}"></button>
               </form>

src/main/resources/templates/convert/pdf-to-book.html

@@ -14,7 +14,7 @@
           <div class="row justify-content-center">
             <div class="col-md-6">
               <h2 th:text="#{PDFToBook.header}"></h2>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/book}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/book'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label th:text="#{PDFToBook.selectText.1}"></label>

src/main/resources/templates/convert/pdf-to-csv.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon convert">csv</span>
                 <span class="tool-header-text" th:text="#{PDFToCSV.header}"></span>
               </div>
-              <form id="PDFToCSVForm" th:action="@{api/v1/convert/pdf/csv}" method="post" enctype="multipart/form-data">
+              <form id="PDFToCSVForm" th:action="@{'/api/v1/convert/pdf/csv'}" method="post" enctype="multipart/form-data">
                 <input  id="pageId" type="hidden" name="pageId">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <button type="submit" class="btn btn-primary" th:text="#{PDFToCSV.submit}"></button>

src/main/resources/templates/convert/pdf-to-html.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon convert">html</span>
                 <span class="tool-header-text" th:text="#{PDFToHTML.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/html}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/html'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{PDFToHTML.submit}"></button>

src/main/resources/templates/convert/pdf-to-img.html

@@ -18,7 +18,7 @@
                 <span class="tool-header-text" th:text="#{pdfToImage.header}"></span>
               </div>
               <p th:text="#{processTimeWarning}"></p>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/img}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/img'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label th:text="#{pdfToImage.selectText}"></label>

src/main/resources/templates/convert/pdf-to-pdfa.html

@@ -18,7 +18,7 @@
                 <span class="tool-header-text" th:text="#{pdfToPDFA.header}"></span>
               </div>
               <p th:text="#{pdfToPDFA.tip}"></p>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/pdfa}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/pdfa'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="outputFormat" th:text="#{pdfToPDFA.outputFormat}"></label>

src/main/resources/templates/convert/pdf-to-presentation.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon ppt">slideshow</span>
                 <span class="tool-header-text" th:text="#{PDFToPresentation.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/presentation}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/presentation'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label th:text="#{PDFToPresentation.selectText.1}"></label>

src/main/resources/templates/convert/pdf-to-text.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon convert">text_fields</span>
                 <span class="tool-header-text" th:text="#{PDFToText.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/text}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/text'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label th:text="#{PDFToText.selectText.1}"></label>

src/main/resources/templates/convert/pdf-to-word.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon word">description</span>
                 <span class="tool-header-text" th:text="#{PDFToWord.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/word}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/word'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label th:text="#{PDFToWord.selectText.1}"></label>

src/main/resources/templates/convert/pdf-to-xml.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon convert">code</span>
                 <span class="tool-header-text" th:text="#{PDFToXML.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/pdf/xml}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/pdf/xml'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{PDFToXML.submit}"></button>

src/main/resources/templates/convert/url-to-pdf.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon convert">link</span>
                 <span class="tool-header-text" th:text="#{URLToPDF.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/convert/url/pdf}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/convert/url/pdf'}">
                 <input type="text" class="form-control" id="urlInput" name="urlInput" placeholder="http://">
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{URLToPDF.submit}"></button>

src/main/resources/templates/crop.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon organize">crop</span>
                 <span class="tool-header-text" th:text="#{crop.header}"></span>
               </div>
-              <form id="cropForm" th:action="@{/api/v1/general/crop}" method="post" enctype="multipart/form-data">
+              <form id="cropForm" th:action="@{'/api/v1/general/crop'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <input id="x" type="hidden" name="x">
                 <input id="y" type="hidden" name="y">

src/main/resources/templates/error.html

@@ -21,7 +21,7 @@
               <a href="https://github.com/Stirling-Tools/Stirling-PDF/issues" id="github-button" class="btn btn-primary" target="_blank" th:text="#{error.github}"></a>
               <a href="https://discord.gg/Cn8pWhQRxZ" id="discord-button" class="btn btn-primary" target="_blank" th:text="#{joinDiscord}"></a>
             </div>
-            <a th:href="@{/}" id="home-button" class="home-button btn btn-primary"  th:text="#{goHomepage}"></a>
+            <a th:href="@{'/'}" id="home-button" class="home-button btn btn-primary"  th:text="#{goHomepage}"></a>
           </div>
         </div>
       </div>

src/main/resources/templates/extract-page.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon organize">upload</span>
                 <span class="tool-header-text" th:text="#{pageExtracter.header}"></span>
               </div>
-              <form th:action="@{api/v1/general/rearrange-pages}" method="post" enctype="multipart/form-data">
+              <form th:action="@{'/api/v1/general/rearrange-pages'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <input type="hidden" id="customMode" name="customMode" value="">
                 <div class="mb-3">

src/main/resources/templates/fragments/common.html

@@ -10,67 +10,67 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
     <!-- Icons -->
-    <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
+    <link rel="apple-touch-icon" sizes="180x180" th:href="@{'/apple-touch-icon.png'}">
-    <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="32x32" th:href="@{'/favicon-32x32.png'}">
-    <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
+    <link rel="icon" type="image/png" sizes="16x16" th:href="@{'/favicon-16x16.png'}">
-    <link rel="manifest" href="site.webmanifest">
+    <link rel="manifest" th:href="@{'/site.webmanifest'}">
-    <link rel="mask-icon" href="safari-pinned-tab.svg" color="#ca2b2a">
+    <link rel="mask-icon" th:href="@{'/safari-pinned-tab.svg'}" color="#ca2b2a">
-    <link rel="shortcut icon" href="favicon.ico">
+    <link rel="shortcut icon" th:href="@{'/favicon.ico'}">
     <meta name="apple-mobile-web-app-title" content="Stirling PDF">
     <meta name="application-name" content="Stirling PDF">
     <meta name="msapplication-TileColor" content="#00aba9">
     <meta name="theme-color" content="#ffffff">
 
     <!-- jQuery -->
-    <script src="js/thirdParty/jquery.min.js"></script>
+    <script th:src="@{'/js/thirdParty/jquery.min.js'}"></script>
-    <script src="js/thirdParty/jquery.validate.min.js"></script>
+    <script th:src="@{'/js/thirdParty/jquery.validate.min.js'}"></script>
-    <script src="js/thirdParty/jszip.min.js"></script>
+    <script th:src="@{'/js/thirdParty/jszip.min.js'}"></script>
 
     <!-- Bootstrap -->
-    <script src="js/thirdParty/popper.min.js"></script>
+    <script th:src="@{'/js/thirdParty/popper.min.js'}"></script>
-    <script src="js/thirdParty/bootstrap.min.js"></script>
+    <script th:src="@{'/js/thirdParty/bootstrap.min.js'}"></script>
-    <link rel="stylesheet" href="css/bootstrap.min.css">
+    <link rel="stylesheet" th:href="@{'/css/bootstrap.min.css'}">
 
     <!-- Bootstrap Icons -->
-    <link rel="stylesheet" href="css/bootstrap-icons.min.css">
+    <link rel="stylesheet" th:href="@{'/css/bootstrap-icons.min.css'}">
 
     <!-- PDF.js -->
-    <script type="module" src="./pdfjs-legacy/pdf.mjs"></script>
+    <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
 
     <!-- PDF-Lib -->
-    <script src="js/thirdParty/pdf-lib.min.js"></script>
+    <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script>
 
     <!-- Custom -->
-    <link rel="stylesheet" href="css/general.css">
+    <link rel="stylesheet" th:href="@{'/css/general.css'}">
-    <link rel="stylesheet" href="css/theme/theme.css">
+    <link rel="stylesheet" th:href="@{'/css/theme/theme.css'}">
-    <link rel="stylesheet" href="css/theme/componentes.css">
+    <link rel="stylesheet" th:href="@{'/css/theme/componentes.css'}">
-    <link rel="stylesheet" href="css/theme/theme.light.css" id="light-mode-styles">
+    <link rel="stylesheet" th:href="@{'/css/theme/theme.light.css'}" id="light-mode-styles">
-    <link rel="stylesheet" href="css/theme/theme.dark.css" id="dark-mode-styles">
+    <link rel="stylesheet" th:href="@{'/css/theme/theme.dark.css'}" id="dark-mode-styles">
-    <link rel="stylesheet" href="css/rainbow-mode.css" id="rainbow-mode-styles" disabled>
+    <link rel="stylesheet" th:href="@{'/css/rainbow-mode.css'}" id="rainbow-mode-styles" disabled>
-    <link rel="stylesheet" href="css/tab-container.css">
+    <link rel="stylesheet" th:href="@{'/css/tab-container.css'}">
-    <link rel="stylesheet" href="css/navbar.css">
+    <link rel="stylesheet" th:href="@{'/css/navbar.css'}">
 
-    <link rel="stylesheet" href="css/error.css" th:if="${error}">
+    <link rel="stylesheet" th:href="@{'/css/error.css'}" th:if="${error}">
 
-    <link rel="stylesheet" href="css/home.css" th:if="${currentPage == 'home'}">
+    <link rel="stylesheet" th:href="@{'/css/home.css'}" th:if="${currentPage == 'home'}">
-    <link rel="stylesheet" href="css/account.css" th:if="${currentPage == 'account'}">
+    <link rel="stylesheet" th:href="@{'/css/account.css'}" th:if="${currentPage == 'account'}">
-    <link rel="stylesheet" href="css/licenses.css" th:if="${currentPage == 'licenses'}">
+    <link rel="stylesheet" th:href="@{'/css/licenses.css'}" th:if="${currentPage == 'licenses'}">
-    <link rel="stylesheet" href="css/multi-tool.css" th:if="${currentPage == 'multi-tool'}">
+    <link rel="stylesheet" th:href="@{'/css/multi-tool.css'}" th:if="${currentPage == 'multi-tool'}">
-    <link rel="stylesheet" href="css/rotate-pdf.css" th:if="${currentPage == 'rotate-pdf'}">
+    <link rel="stylesheet" th:href="@{'/css/rotate-pdf.css'}" th:if="${currentPage == 'rotate-pdf'}">
-    <link rel="stylesheet" href="css/stamp.css" th:if="${currentPage == 'stamp'}">
+    <link rel="stylesheet" th:href="@{'/css/stamp.css'}" th:if="${currentPage == 'stamp'}">
-    <link rel="stylesheet" href="css/fileSelect.css">
+    <link rel="stylesheet" th:href="@{'/css/fileSelect.css'}">
-    <link rel="stylesheet" href="css/footer.css">
+    <link rel="stylesheet" th:href="@{'/css/footer.css'}">
-    <script src="js/thirdParty/fontfaceobserver.standalone.js"></script>
+    <script th:src="@{'/js/thirdParty/fontfaceobserver.standalone.js'}"></script>
 
     <!-- Google MD Icons -->
-    <link rel="stylesheet" href="css/theme/font.css">
+    <link rel="stylesheet" th:href="@{'/css/theme/font.css'}">
 
     <!-- Help Modal -->
-    <link rel="stylesheet" href="css/errorBanner.css">
+    <link rel="stylesheet" th:href="@{'/css/errorBanner.css'}">
 
-    <script src="js/cacheFormInputs.js"></script>
+    <script th:src="@{'/js/cacheFormInputs.js'}"></script>
-    <script src="js/tab-container.js"></script>
+    <script th:src="@{'/js/tab-container.js'}"></script>
-    <script src="js/darkmode.js"></script>
+    <script th:src="@{'/js/darkmode.js'}"></script>
   </th:block>
 
 <th:block th:fragment="game">
@@ -138,9 +138,9 @@
         <div id="score">Score: 0</div>
         <div id="high-score">High Score: 0</div>
         <div id="level">Level: 1</div>
-        <img src="favicon.svg" class="player" id="player" alt="favicon">
+        <img th:src="@{'/favicon.svg'}" class="player" id="player" alt="favicon">
       </div>
-      <link rel="stylesheet" href="css/game.css">
+      <link rel="stylesheet" th:href="@{'/css/game.css'}">
     </dialog>
 </th:block>
 
@@ -150,7 +150,7 @@
                   const multiple = [[${multiple}]] || false;
                   const remoteCall = [[${remoteCall}]] || true;
                 </script>
-                <script src="js/downloader.js"></script>
+                <script th:src="@{'/js/downloader.js'}"></script>
 
                 <div class="custom-file-chooser" th:attr="data-bs-unique-id=${name}, data-bs-element-id=${name+'-input'}, data-bs-files-selected=#{filesSelected}, data-bs-pdf-prompt=#{pdfPrompt}">
                   <div class="mb-3">
@@ -166,5 +166,5 @@
                     </div>
                   </div>
                 </div>
-                <script src="js/fileInput.js"></script>
+                <script th:src="@{'/js/fileInput.js'}"></script>
 </th:block>

src/main/resources/templates/fragments/errorBannerPerPage.html

@@ -41,7 +41,7 @@
                         <a href="https://github.com/Stirling-Tools/Stirling-PDF/issues" id="github-button" target="_blank" th:text="#{error.githubSubmit}"></a>
                         <a href="https://discord.gg/Cn8pWhQRxZ" id="discord-button" target="_blank" th:text="#{error.discordSubmit}"></a>
                       </div>
-                      <a href="/" class="home-button" th:text="#{goHomepage}"></a>
+                      <a th:href="@{'/'}" class="home-button" th:text="#{goHomepage}"></a>
                       <a data-bs-dismiss="modal" class="home-button" th:text="#{close}"></a>
                     </div>
                   </div>
@@ -49,5 +49,5 @@
               </div>
             </div>
           </div>
-          <script src="js/errorBanner.js"></script>
+          <script th:src="@{'/js/errorBanner.js'}"></script>
 </th:block>

src/main/resources/templates/fragments/footer.html

@@ -3,7 +3,7 @@
     <div class="footer-powered-by">
       <span th:text="#{poweredBy} + ' Stirling PDF'"></span>
     </div>
-    <a href="licenses" id="licenses" target="_blank" class="mx-1" title="" th:text="#{licenses.nav}">Licenses</a>
+    <a th:href="@{'/licenses'}" id="licenses" target="_blank" class="mx-1" title="" th:text="#{licenses.nav}">Licenses</a>
     <a href="https://stirlingpdf.info/s/clwzgtfw7000gltkmwz1n212m" id="survey" target="_blank" class="mx-1" title="" th:text="#{survey.nav}">Survey</a>
   </div>
 </footer>

src/main/resources/templates/fragments/languages.html

@@ -1,34 +1,34 @@
 <th:block th:fragment="langs">
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="bg_BG"> <img src="images/flags/bg.svg" alt="icon" width="20" height="15"> Български</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="bg_BG"> <img th:src="@{'/images/flags/bg.svg'}" alt="icon" width="20" height="15"> Български</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ar_AR"> <img src="images/flags/sa.svg" alt="icon" width="20" height="15"> العربية</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ar_AR"> <img th:src="@{'/images/flags/sa.svg'}" alt="icon" width="20" height="15"> العربية</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ca_CA"> <img src="images/flags/es-ct.svg" alt="icon" width="20" height="15"> Català</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ca_CA"> <img th:src="@{'/images/flags/es-ct.svg'}" alt="icon" width="20" height="15"> Català</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="zh_CN"> <img src="images/flags/cn.svg" alt="icon" width="20" height="15"> 简体中文</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="zh_CN"> <img th:src="@{'/images/flags/cn.svg'}" alt="icon" width="20" height="15"> 简体中文</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="zh_TW"> <img src="images/flags/tw.svg" alt="icon" width="20" height="15"> 繁體中文</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="zh_TW"> <img th:src="@{'/images/flags/tw.svg'}" alt="icon" width="20" height="15"> 繁體中文</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="de_DE"> <img src="images/flags/de.svg" alt="icon" width="20" height="15"> Deutsch</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="de_DE"> <img th:src="@{'/images/flags/de.svg'}" alt="icon" width="20" height="15"> Deutsch</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="en_GB"> <img src="images/flags/gb.svg" alt="icon" width="20" height="15"> English (GB)</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="en_GB"> <img th:src="@{'/images/flags/gb.svg'}" alt="icon" width="20" height="15"> English (GB)</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="en_US"> <img src="images/flags/us.svg" alt="icon" width="20" height="15"> English (US)</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="en_US"> <img th:src="@{'/images/flags/us.svg'}" alt="icon" width="20" height="15"> English (US)</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="eu_ES"> <img src="images/flags/eu.svg" alt="icon" width="20" height="15"> Euskara</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="eu_ES"> <img th:src="@{'/images/flags/eu.svg'}" alt="icon" width="20" height="15"> Euskara</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="es_ES"> <img src="images/flags/es.svg" alt="icon" width="20" height="15"> Español</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="es_ES"> <img th:src="@{'/images/flags/es.svg'}" alt="icon" width="20" height="15"> Español</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="fr_FR"> <img src="images/flags/fr.svg" alt="icon" width="20" height="15"> Français</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="fr_FR"> <img th:src="@{'/images/flags/fr.svg'}" alt="icon" width="20" height="15"> Français</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="id_ID"> <img src="images/flags/id.svg" alt="icon" width="20" height="15"> Indonesia</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="id_ID"> <img th:src="@{'/images/flags/id.svg'}" alt="icon" width="20" height="15"> Indonesia</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="it_IT"> <img src="images/flags/it.svg" alt="icon" width="20" height="15"> Italiano</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="it_IT"> <img th:src="@{'/images/flags/it.svg'}" alt="icon" width="20" height="15"> Italiano</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="nl_NL"> <img src="images/flags/nl.svg" alt="icon" width="20" height="15"> Nederlands</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="nl_NL"> <img th:src="@{'/images/flags/nl.svg'}" alt="icon" width="20" height="15"> Nederlands</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="pl_PL"> <img src="images/flags/pl.svg" alt="icon" width="20" height="15"> Polski</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="pl_PL"> <img th:src="@{'/images/flags/pl.svg'}" alt="icon" width="20" height="15"> Polski</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="pt_BR"> <img src="images/flags/pt_br.svg" alt="icon" width="20" height="15"> Português (BR)</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="pt_BR"> <img th:src="@{'/images/flags/pt_br.svg'}" alt="icon" width="20" height="15"> Português (BR)</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="pt_PT"> <img src="images/flags/pt_pt.svg" alt="icon" width="20" height="15"> Português (PT)</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="pt_PT"> <img th:src="@{'/images/flags/pt_pt.svg'}" alt="icon" width="20" height="15"> Português (PT)</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ro_RO"> <img src="images/flags/ro.svg" alt="icon" width="20" height="15"> Romanian</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ro_RO"> <img th:src="@{'/images/flags/ro.svg'}" alt="icon" width="20" height="15"> Romanian</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="sk_SK"> <img src="images/flags/sk.svg" alt="icon" width="20" height="15"> Slovensky</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="sk_SK"> <img th:src="@{'/images/flags/sk.svg'}" alt="icon" width="20" height="15"> Slovensky</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="sv_SE"> <img src="images/flags/se.svg" alt="icon" width="20" height="15"> Svenska</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="sv_SE"> <img th:src="@{'/images/flags/se.svg'}" alt="icon" width="20" height="15"> Svenska</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="tr_TR"> <img src="images/flags/tr.svg" alt="icon" width="20" height="15"> Türkçe</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="tr_TR"> <img th:src="@{'/images/flags/tr.svg'}" alt="icon" width="20" height="15"> Türkçe</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ru_RU"> <img src="images/flags/ru.svg" alt="icon" width="20" height="15"> Русский</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ru_RU"> <img th:src="@{'/images/flags/ru.svg'}" alt="icon" width="20" height="15"> Русский</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ko_KR"> <img src="images/flags/kr.svg" alt="icon" width="20" height="15"> 한국어</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ko_KR"> <img th:src="@{'/images/flags/kr.svg'}" alt="icon" width="20" height="15"> 한국어</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ja_JP"> <img src="images/flags/jp.svg" alt="icon" width="20" height="15"> 日本語</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="ja_JP"> <img th:src="@{'/images/flags/jp.svg'}" alt="icon" width="20" height="15"> 日本語</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="el_GR"> <img src="images/flags/gr.svg" alt="icon" width="20" height="15"> Ελληνικά</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="el_GR"> <img th:src="@{'/images/flags/gr.svg'}" alt="icon" width="20" height="15"> Ελληνικά</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="hu_HU"> <img src="images/flags/hu.svg" alt="icon" width="20" height="15"> Hungarian</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="hu_HU"> <img th:src="@{'/images/flags/hu.svg'}" alt="icon" width="20" height="15"> Hungarian</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="hi_IN"> <img src="images/flags/in.svg" alt="icon" width="20" height="15"> हिन्दी</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="hi_IN"> <img th:src="@{'/images/flags/in.svg'}" alt="icon" width="20" height="15"> हिन्दी</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="sr_LATN_RS"> <img src="images/flags/rs.svg" alt="icon" width="20" height="15"> Srpski</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="sr_LATN_RS"> <img th:src="@{'/images/flags/rs.svg'}" alt="icon" width="20" height="15"> Srpski</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="uk_UA"> <img src="images/flags/ua.svg" alt="icon" width="20" height="15"> Українська</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="uk_UA"> <img th:src="@{'/images/flags/ua.svg'}" alt="icon" width="20" height="15"> Українська</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="cs_CZ"> <img src="images/flags/cz.svg" alt="icon" width="20" height="15"> Česky</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="cs_CZ"> <img th:src="@{'/images/flags/cz.svg'}" alt="icon" width="20" height="15"> Česky</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="hr_HR"> <img src="images/flags/hr.svg" alt="icon" width="20" height="15"> Hrvatski</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="hr_HR"> <img th:src="@{'/images/flags/hr.svg'}" alt="icon" width="20" height="15"> Hrvatski</a>
-                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="no_NB"> <img src="images/flags/no.svg" alt="icon" width="20" height="15"> Norsk</a>
+                      <a class="dropdown-item lang_dropdown-item" href="" data-bs-language-code="no_NB"> <img th:src="@{'/images/flags/no.svg'}" alt="icon" width="20" height="15"> Norsk</a>
 </th:block>

src/main/resources/templates/fragments/navbar.html

@@ -1,15 +1,15 @@
 <div th:fragment="navbar" class="mx-auto">
-  <script src="js/languageSelection.js"></script>
+  <script th:src="@{'/js/languageSelection.js'}"></script>
   <script th:inline="javascript">
     const currentVersion = /*[[${@appVersion}]]*/ '';
     const noFavourites = /*[[#{noFavourites}]]*/ '';
     const updateAvailable =  /*[[#{settings.updateAvailable}]]*/ '';
   </script>
-  <script src="js/githubVersion.js"></script>
+  <script th:src="@{'/js/githubVersion.js'}"></script>
   <nav class="navbar navbar-expand-lg">
     <div class="container ">
-      <a class="navbar-brand" th:href="@{/}" style="display: flex;">
+      <a class="navbar-brand" th:href="@{'/'}" style="display: flex;">
-        <img class="main-icon" src="favicon.svg" alt="icon">
+        <img class="main-icon" th:src="@{'/favicon.svg'}" alt="icon">
         <span class="icon-text" th:text="${@navBarText}"></span>
       </a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
@@ -242,7 +242,7 @@
           </li>
 
           <li class="nav-item" th:if="${@endpointConfiguration.isEndpointEnabled('multi-tool')}">
-            <a class="nav-link" href="#" th:href="@{multi-tool}"
+            <a class="nav-link" href="#" th:href="@{'/multi-tool'}"
               th:classappend="${currentPage}=='multi-tool' ? 'active' : ''" th:title="#{home.multiTool.desc}">
               <span class="material-symbols-rounded">
                 construction
@@ -252,7 +252,7 @@
           </li>
 
           <li class="nav-item" th:if="${@endpointConfiguration.isEndpointEnabled('pipeline')}" >
-            <a class="nav-link" href="#" th:href="@{pipeline}"
+            <a class="nav-link" href="#" th:href="@{'/pipeline'}"
               th:classappend="${currentPage}=='pipeline' ? 'active' : ''" th:title="#{home.pipeline.desc}">
               <span class="material-symbols-rounded">
                 family_history
@@ -262,7 +262,7 @@
           </li>
 
           <li class="nav-item" th:if="${@endpointConfiguration.isEndpointEnabled('compress-pdf')}" >
-            <a class="nav-link" href="#" title="#{home.compressPdfs.title}" th:href="@{compress-pdf}"
+            <a class="nav-link" href="#" title="#{home.compressPdfs.title}" th:href="@{'/compress-pdf'}"
               th:classappend="${currentPage}=='compress-pdf' ? 'active' : ''" th:title="#{home.compressPdfs.desc}">
               <span class="material-symbols-rounded">
                 zoom_in_map
@@ -273,7 +273,7 @@
           </li>
 
           <li class="nav-item">
-            <a class="nav-link" href="#" th:href="@{split-pdfs}"
+            <a class="nav-link" href="#" th:href="@{'/split-pdfs'}"
               th:classappend="${currentPage}=='split-pdfs' ? 'active' : ''" th:title="#{home.split-pdfs.desc}">
               <span class="material-symbols-rounded">
                 cut
@@ -283,7 +283,7 @@
           </li>
 
           <!-- <li class="nav-item">
-            <a class="nav-link" href="#" th:href="@{merge-pdfs}"
+            <a class="nav-link" href="#" th:href="@{'/merge-pdfs'}"
               th:classappend="${currentPage}=='merge-pdfs' ? 'active' : ''" th:title="#{home.merge.desc}">
               <span class="material-symbols-rounded">
                 add_to_photos
@@ -363,8 +363,8 @@
         </ul>
       </div>
     </div>
-    <script src="js/favourites.js"></script>
+    <script th:src="@{'/js/favourites.js'}"></script>
-    <script src="js/search.js"></script>
+    <script th:src="@{'/js/search.js'}"></script>
   </nav>
 
   <th:block th:insert="~{fragments/errorBannerPerPage.html :: errorBannerPerPage}"></th:block>
@@ -386,13 +386,13 @@
             <div class="footer-center" style="flex-direction: row;">
               <a href="https://github.com/Stirling-Tools/Stirling-PDF" class="mx-1" role="button"
                 th:title="#{visitGithub}">
-                <img src="images/github.svg" alt="github">
+                <img th:src="@{'/images/github.svg'}" alt="github">
               </a>
               <a href="https://hub.docker.com/r/frooodle/s-pdf" class="mx-1" role="button" th:title="#{seeDockerHub}">
-                <img src="images/docker.svg" alt="docker">
+                <img th:src="@{'/images/docker.svg'}" alt="docker">
               </a>
               <a href="https://discord.gg/Cn8pWhQRxZ" class="mx-1" role="button" th:title="#{joinDiscord}">
-                <img src="images/discord.svg" alt="discord">
+                <img th:src="@{'/images/discord.svg'}" alt="discord">
               </a>
               <a href="https://github.com/sponsors/Frooodle" class="mx-1" role="button" th:title="#{donate}">
                 <span class="material-symbols-rounded fill footer-icon" style="font-size: 2.5rem;">
@@ -401,7 +401,7 @@
               </a>
             </div>
 
-            <a href="swagger-ui/index.html" class="btn btn-sm btn-outline-primary mx-1" role="button"
+            <a th:href="@{'/swagger-ui/index.html'}" class="btn btn-sm btn-outline-primary mx-1" role="button"
               target="_blank">API</a>
             <a href="https://github.com/Stirling-Tools/Stirling-PDF/releases"
               class="btn btn-sm btn-outline-primary mx-1" id="update-btn" th:utext="#{settings.update}" role="button"
@@ -430,16 +430,16 @@
             <label for="cacheInputs" th:text="#{settings.cacheInputs.name}"></label>
           </div>
 
-          <a th:if="${@loginEnabled and @activSecurity}" href="account" class="btn btn-sm btn-outline-primary"
+          <a th:if="${@loginEnabled and @activSecurity}" th:href="@{'/account'}" class="btn btn-sm btn-outline-primary"
             role="button" th:text="#{settings.accountSettings}" target="_blank">Account Settings</a>
         </div>
         <div class="modal-footer">
           <a th:if="${@loginEnabled and @activSecurity}" class="btn btn-danger" role="button"
-            th:text="#{settings.signOut}" href="logout">Sign Out</a>
+            th:text="#{settings.signOut}" th:href="@{'/logout'}">Sign Out</a>
           <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" th:text="#{close}"></button>
         </div>
       </div>
     </div>
   </div>
-  <script src="js/settings.js"></script>
+  <script th:src="@{'/js/settings.js'}"></script>
 </div>

src/main/resources/templates/home.html

@@ -21,7 +21,7 @@
       </div>
       <br class="d-md-none">
       <!-- Features -->
-      <script src="js/homecard.js"></script>
+      <script th:src="@{'/js/homecard.js'}"></script>
       <div class=" container">
         <br>
         <span class="material-symbols-rounded search-icon">

src/main/resources/templates/login.html

@@ -2,7 +2,7 @@
 <html th:lang="${#locale.language}" th:dir="#{language.direction}" th:data-language="${#locale.toString()}" xmlns:th="https://www.thymeleaf.org">
   <head>
   <th:block th:insert="~{fragments/common :: head(title=#{login.title}, header=#{login.header})}"></th:block>
-    <link rel="stylesheet" href="css/login.css">
+    <link rel="stylesheet" th:href="@{'/css/login.css'}">
   </head>
 
   <body>
@@ -111,7 +111,7 @@
           }
         </script>
         <div class="text-center">
-          <img class="mb-4" src="favicon.svg" alt="favicon" width="144" height="144">
+          <img class="mb-4" th:src="@{'/favicon.svg'}" alt="favicon" width="144" height="144">
 
           <h1 class="h1 mb-3 fw-normal" th:text="${@appName}">Stirling-PDF</h1>
           <div th:if="${oAuth2Enabled} and (${loginMethod} == 'all' or ${loginMethod} == 'oauth2')">
@@ -134,7 +134,7 @@
             </div>
           </div>
         </div>
-        <form th:if="${loginMethod} == 'all' or ${loginMethod} == 'normal'" th:action="@{login}" method="post">
+        <form th:if="${loginMethod} == 'all' or ${loginMethod} == 'normal'" th:action="@{'/login'}" method="post">
           <h2 class="h5 mb-3 fw-normal" th:text="#{login.signinTitle}">Please sign in</h2>
           <div class="form-floating">
             <input type="text" class="form-control" id="username" name="username" placeholder="admin">
@@ -154,7 +154,7 @@
         <div class="mt-3"> <!-- Added a margin-top for spacing -->
           <div class="dropdown text-center">
             <button class="btn btn-secondary dropdown-toggle" type="button" id="languageDropdown" data-bs-toggle="dropdown" aria-expanded="false">
-              <img src="images/flags/gb.svg" alt="icon" width="20" height="15"> English (GB)
+              <img th:src="@{'/images/flags/gb.svg'}" alt="icon" width="20" height="15"> English (GB)
               <!-- Default language placeholder -->
             </button>
             <div class="dropdown-menu" aria-labelledby="languageDropdown">

src/main/resources/templates/merge-pdfs.html

@@ -2,7 +2,7 @@
 <html th:lang="${#locale.language}" th:dir="#{language.direction}" th:data-language="${#locale.toString()}" xmlns:th="https://www.thymeleaf.org">
   <head>
   <th:block th:insert="~{fragments/common :: head(title=#{merge.title}, header=#{merge.header})}"></th:block>
-    <link rel="stylesheet" href="css/merge.css">
+    <link rel="stylesheet" th:href="@{'/css/merge.css'}">
   </head>
 
   <body>
@@ -35,7 +35,7 @@
                   <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{merge.submit}"></button>
                 </div>
               </form>
-              <script src="js/merge.js"></script>
+              <script th:src="@{'/js/merge.js'}"></script>
             </div>
           </div>
         </div>

src/main/resources/templates/misc/add-image.html

@@ -2,8 +2,8 @@
 <html th:lang="${#locale.language}" th:dir="#{language.direction}" th:data-language="${#locale.toString()}" xmlns:th="https://www.thymeleaf.org">
   <head>
   <th:block th:insert="~{fragments/common :: head(title=#{addImage.title}, header=#{addImage.header})}"></th:block>
-    <script src="js/thirdParty/interact.min.js"></script>
+    <script th:src="@{'/js/thirdParty/interact.min.js'}"></script>
-    <link rel="stylesheet" href="css/add-image.css">
+    <link rel="stylesheet" th:href="@{'/css/add-image.css'}">
   </head>
 
   <body>
@@ -68,7 +68,7 @@
               <!-- draggables box -->
               <div id="box-drag-container" class="show-on-file-selected">
                 <canvas id="pdf-canvas"></canvas>
-                <script src="js/draggable-utils.js"></script>
+                <script th:src="@{'/js/draggable-utils.js'}"></script>
                 <div class="draggable-buttons-box ignore-rtl">
                   <button class="btn btn-outline-secondary" onclick="DraggableUtils.deleteDraggableCanvas(DraggableUtils.getLastInteracted())">
                     <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-trash" viewBox="0 0 16 16">

src/main/resources/templates/misc/add-page-numbers.html

@@ -60,7 +60,7 @@
                 <span class="material-symbols-rounded tool-header-icon other">123</span>
                 <span class="tool-header-text" th:text="#{addPageNumbers.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/misc/add-page-numbers}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/misc/add-page-numbers'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <br>
                 <div class="mb-3">

src/main/resources/templates/misc/auto-crop.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon advance">crop</span>
                 <span class="tool-header-text" th:text="#{autoCrop.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/misc/auto-crop}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/misc/auto-crop'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{autoCrop.submit}"></button>

src/main/resources/templates/misc/auto-rename.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon advance">text_fields_alt</span>
                 <span class="tool-header-text" th:text="#{auto-rename.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/misc/auto-rename}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/misc/auto-rename'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{auto-rename.submit}"></button>

src/main/resources/templates/misc/change-metadata.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon other">assignment</span>
                 <span class="tool-header-text" th:text="#{changeMetadata.header}"></span>
               </div>
-              <form method="post" id="form1" enctype="multipart/form-data" th:action="@{api/v1/misc/update-metadata}">
+              <form method="post" id="form1" enctype="multipart/form-data" th:action="@{'/api/v1/misc/update-metadata'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <p class="text-muted" th:text="#{changeMetadata.selectText.1}"></p>
                 <div class="form-check mb-3-inline ms-3">

src/main/resources/templates/misc/compress-pdf.html

@@ -19,7 +19,7 @@
               <span class="material-symbols-rounded tool-header-icon advance">zoom_in_map</span>
               <span class="tool-header-text" th:text="#{compress.header}"></span>
             </div>
-            <form action="#" th:action="@{api/v1/misc/compress-pdf}" method="post" enctype="multipart/form-data">
+            <form action="#" th:action="@{'/api/v1/misc/compress-pdf'}" method="post" enctype="multipart/form-data">
               <div
                 th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}">
               </div>

src/main/resources/templates/misc/extract-image-scans.html

@@ -18,7 +18,7 @@
                 <span class="tool-header-text" th:text="#{home.ScannerImageSplit.title}"></span>
               </div>
 
-              <form id="multiPdfForm" th:action="@{api/v1/misc/extract-image-scans}" method="post" enctype="multipart/form-data">
+              <form id="multiPdfForm" th:action="@{'/api/v1/misc/extract-image-scans'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='image/*, application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="angleThreshold" th:text="#{ScannerImageSplit.selectText.1}"></label>

src/main/resources/templates/misc/extract-images.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon other">photo_library</span>
                 <span class="tool-header-text" th:text="#{extractImages.header}"></span>
               </div>
-              <form id="multiPdfForm" th:action="@{api/v1/misc/extract-images}" method="post" enctype="multipart/form-data">
+              <form id="multiPdfForm" th:action="@{'/api/v1/misc/extract-images'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label th:text="#{extractImages.selectText}"></label>

src/main/resources/templates/misc/fake-scan.html

@@ -14,7 +14,7 @@
           <div class="row justify-content-center">
             <div class="col-md-6">
               <h2 th:text="#{fakeScan.header}"></h2>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/misc/fake-scan}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/misc/fake-scan'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{fakeScan.submit}"></button>

src/main/resources/templates/misc/flatten.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon other">layers_clear</span>
                 <span class="tool-header-text" th:text="#{flatten.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/misc/flatten}" id="pdfForm" class="mb-3">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/misc/flatten'}" id="pdfForm" class="mb-3">
                 <div class="custom-file">
                   <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 </div>

src/main/resources/templates/misc/ocr-pdf.html

@@ -39,7 +39,7 @@
                 <span class="material-symbols-rounded tool-header-icon other">quick_reference_all</span>
                 <span class="tool-header-text" th:text="#{ocr.header}"></span>
               </div>
-              <form th:if="${#lists.size(languages) > 0}" action="#" th:action="@{api/v1/misc/ocr-pdf}" method="post" enctype="multipart/form-data" class="mb-3">
+              <form th:if="${#lists.size(languages) > 0}" action="#" th:action="@{'/api/v1/misc/ocr-pdf'}" method="post" enctype="multipart/form-data" class="mb-3">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="languages" class="form-label" th:text="#{ocr.selectText.1}"></label>

src/main/resources/templates/misc/print-file.html

@@ -14,7 +14,7 @@
           <div class="row justify-content-center">
             <div class="col-md-6">
               <h2 th:text="#{printFile.header}"></h2>
-              <form action="#" th:action="@{api/v1/misc/print-file}" method="post" enctype="multipart/form-data">
+              <form action="#" th:action="@{'/api/v1/misc/print-file'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf,image/*')}"></div>
                 <div class="card mb-3">
                   <div class="card-body">

src/main/resources/templates/misc/remove-annotations.html

@@ -28,7 +28,7 @@
       </div>
       <th:block th:insert="~{fragments/footer.html :: footer}"></th:block>
     </div>
-    <script src="js/local-pdf-input-download.js"></script>
+    <script th:src="@{'/js/local-pdf-input-download.js'}"></script>
     <script>
       document.getElementById('pdfForm').addEventListener('submit', async (e) => {
         e.preventDefault();

src/main/resources/templates/misc/remove-blanks.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon other">scan_delete</span>
                 <span class="tool-header-text" th:text="#{removeBlanks.header}"></span>
               </div>
-              <form id="multiPdfForm" th:action="@{api/v1/misc/remove-blanks}" method="post" enctype="multipart/form-data">
+              <form id="multiPdfForm" th:action="@{'/api/v1/misc/remove-blanks'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="threshold" th:text="#{removeBlanks.threshold}"></label>

src/main/resources/templates/misc/repair.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon advance">build</span>
                 <span class="tool-header-text" th:text="#{repair.header}"></span>
               </div>
-              <form id="multiPdfForm" th:action="@{api/v1/misc/repair}" method="post" enctype="multipart/form-data">
+              <form id="multiPdfForm" th:action="@{'/api/v1/misc/repair'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{repair.submit}"></button>
               </form>

src/main/resources/templates/misc/show-javascript.html

@@ -2,8 +2,8 @@
 <html th:lang="${#locale.language}" th:dir="#{language.direction}" th:data-language="${#locale.toString()}" xmlns:th="https://www.thymeleaf.org">
   <head>
   <th:block th:insert="~{fragments/common :: head(title=#{showJS.title}, header=#{showJS.header})}"></th:block>
-    <link href="css/prism.css" rel="stylesheet">
+    <link th:href="@{'/css/prism.css'}" rel="stylesheet">
-    <script src="js/thirdParty/prism.js"></script>
+    <script th:src="@{'/js/thirdParty/prism.js'}"></script>
     <style>
       /* Add a max-height and make it scrollable */
       #script-content {
@@ -25,7 +25,7 @@
                 <span class="material-symbols-rounded tool-header-icon advance">javascript</span>
                 <span class="tool-header-text" th:text="#{showJS.header}"></span>
               </div>
-              <form id="pdfInfoForm" method="post" enctype="multipart/form-data" th:action="@{show-javascript}">
+              <form id="pdfInfoForm" method="post" enctype="multipart/form-data" th:action="@{'/show-javascript'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, remoteCall='false', accept='application/pdf')}"></div>
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{showJS.submit}"></button>

src/main/resources/templates/misc/stamp.html

@@ -27,7 +27,7 @@
                 <span class="material-symbols-rounded tool-header-icon security">approval</span>
                 <span class="tool-header-text" th:text="#{AddStampRequest.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/misc/add-stamp}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/misc/add-stamp'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <br>
                 <div class="mb-3">

src/main/resources/templates/multi-page-layout.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon organize">dashboard</span>
                 <span class="tool-header-text" th:text="#{pageLayout.header}"></span>
               </div>
-              <form id="multiPdfForm" th:action="@{api/v1/general/multi-page-layout}" method="post" enctype="multipart/form-data">
+              <form id="multiPdfForm" th:action="@{'/api/v1/general/multi-page-layout'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="pagesPerSheet" th:text="#{pageLayout.pagesPerSheet}"></label>

src/main/resources/templates/overlay-pdf.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon advance">layers</span>
                 <span class="tool-header-text" th:text="#{overlay-pdfs.header}"></span>
               </div>
-              <form id="overlayForm" method="post" enctype="multipart/form-data" th:action="@{/api/v1/general/overlay-pdfs}">
+              <form id="overlayForm" method="post" enctype="multipart/form-data" th:action="@{'/api/v1/general/overlay-pdfs'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div th:replace="~{fragments/common :: fileSelector(name='overlayFiles', multiple=true, accept='application/pdf')}"></div>
 

src/main/resources/templates/pdf-organizer.html

@@ -17,7 +17,7 @@
                 <span class="tool-header-text" th:text="#{pdfOrganiser.header}"></span>
               </div>
 
-              <form th:action="@{api/v1/general/rearrange-pages}" method="post" enctype="multipart/form-data">
+              <form th:action="@{'/api/v1/general/rearrange-pages'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="customMode" th:text="#{pdfOrganiser.mode}">Mode</label>

src/main/resources/templates/pdf-to-single-page.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon organize">looks_one</span>
                 <span class="tool-header-text" th:text="#{pdfToSinglePage.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{api/v1/general/pdf-to-single-page}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/general/pdf-to-single-page'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{pdfToSinglePage.submit}"></button>
               </form>

src/main/resources/templates/pipeline.html

@@ -11,7 +11,7 @@
     ></th:block>
     <link
       rel="stylesheet"
-      href="css/pipeline.css"
+      th:href="@{'/css/pipeline.css'}"
       th:if="${currentPage == 'pipeline'}"
     />
     <script th:inline="javascript">
@@ -192,7 +192,7 @@
                     </div>
                   </div>
                 </div>
-                <script src="js/pipeline.js"></script>\
+                <script th:src="@{'/js/pipeline.js'}"></script>\
             </div>
           </div>
         </div>

src/main/resources/templates/remove-pages.html

@@ -17,7 +17,7 @@
                 <span class="tool-header-text" th:text="#{pageRemover.header}"></span>
               </div>
 
-              <form th:action="@{api/v1/general/remove-pages}" method="post" enctype="multipart/form-data">
+              <form th:action="@{'/api/v1/general/remove-pages'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="fileInput" th:text="#{pageRemover.pagesToDelete}"></label>

src/main/resources/templates/rotate-pdf.html

@@ -17,7 +17,7 @@
                 <span class="tool-header-text" th:text="#{rotate.header}"></span>
               </div>
 
-              <form action="#" th:action="@{api/v1/general/rotate-pdf}" th:object="${rotateForm}" method="post" enctype="multipart/form-data">
+              <form action="#" th:action="@{'/api/v1/general/rotate-pdf'}" th:object="${rotateForm}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <input type="hidden" id="angleInput" name="angle" value="0">
 

src/main/resources/templates/scale-pages.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon organize">fullscreen</span>
                 <span class="tool-header-text" th:text="#{scalePages.header}"></span>
               </div>
-              <form id="scalePagesFrom" th:action="@{api/v1/general/scale-pages}" method="post" enctype="multipart/form-data">
+              <form id="scalePagesFrom" th:action="@{'/api/v1/general/scale-pages'}" method="post" enctype="multipart/form-data">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <div class="mb-3">
                   <label for="pageSize" th:text="#{scalePages.pageSize}"></label>

src/main/resources/templates/security/get-info-on-pdf.html

@@ -16,7 +16,7 @@
                 <span class="material-symbols-rounded tool-header-icon other">info</span>
                 <span class="tool-header-text" th:text="#{getPdfInfo.header}"></span>
               </div>
-              <form id="pdfInfoForm" method="post" enctype="multipart/form-data" th:action="@{api/v1/security/get-info-on-pdf}">
+              <form id="pdfInfoForm" method="post" enctype="multipart/form-data" th:action="@{'/api/v1/security/get-info-on-pdf'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, remoteCall='false', accept='application/pdf')}"></div>
                 <br>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{getPdfInfo.submit}"></button>

src/main/resources/templates/sign.html

@@ -2,7 +2,7 @@
 <html th:lang="${#locale.language}" th:dir="#{language.direction}" th:data-language="${#locale.toString()}" xmlns:th="https://www.thymeleaf.org">
   <head>
   <th:block th:insert="~{fragments/common :: head(title=#{sign.title}, header=#{sign.header})}"></th:block>
-    <link rel="stylesheet" href="css/sign.css">
+    <link rel="stylesheet" th:href="@{'/css/sign.css'}">
   <th:block th:each="font : ${fonts}">
     <style th:inline="text">
       @font-face {
@@ -18,8 +18,8 @@
       }
     </style>
   </th:block>
-    <script src="js/thirdParty/signature_pad.umd.min.js"></script>
+    <script th:src="@{'/js/thirdParty/signature_pad.umd.min.js'}"></script>
-    <script src="js/thirdParty/interact.min.js"></script>
+    <script th:src="@{'/js/thirdParty/interact.min.js'}"></script>
   </head>
 
   <body>
@@ -229,7 +229,7 @@
               <!-- draggables box -->
               <div id="box-drag-container" class="show-on-file-selected">
                 <canvas id="pdf-canvas"></canvas>
-                <script src="js/draggable-utils.js"></script>
+                <script th:src="@{'/js/draggable-utils.js'}"></script>
                 <div class="draggable-buttons-box ignore-rtl">
                   <button class="btn btn-outline-secondary" onclick="DraggableUtils.deleteDraggableCanvas(DraggableUtils.getLastInteracted())">
                     <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-trash" viewBox="0 0 16 16">

src/main/resources/templates/split-by-size-or-count.html

@@ -17,7 +17,7 @@
                 <span class="material-symbols-rounded tool-header-icon advance">vertical_split</span>
                 <span class="tool-header-text" th:text="#{split-by-size-or-count.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{/api/v1/general/split-by-size-or-count}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/general/split-by-size-or-count'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <label for="splitType" th:text="#{split-by-size-or-count.type.label}">Split Type</label>
                 <select id="splitType" name="splitType" class="form-control">

src/main/resources/templates/split-pdf-by-sections.html

@@ -2,7 +2,7 @@
 <html th:lang="${#locale.language}" th:dir="#{language.direction}" th:data-language="${#locale.toString()}" xmlns:th="https://www.thymeleaf.org">
   <head>
   <th:block th:insert="~{fragments/common :: head(title=#{split-by-sections.title}, header=#{split-by-sections.header})}"></th:block>
-    <link rel="stylesheet" href="css/split-pdf-by-sections.css">
+    <link rel="stylesheet" th:href="@{'/css/split-pdf-by-sections.css'}">
   </head>
 
   <body>
@@ -18,7 +18,7 @@
                 <span class="material-symbols-rounded tool-header-icon advance">grid_on</span>
                 <span class="tool-header-text" th:text="#{split-by-sections.header}"></span>
               </div>
-              <form method="post" enctype="multipart/form-data" th:action="@{/api/v1/general/split-pdf-by-sections}">
+              <form method="post" enctype="multipart/form-data" th:action="@{'/api/v1/general/split-pdf-by-sections'}">
                 <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                 <label for="horizontalDivisions" th:text="#{split-by-sections.horizontal.label}">Horizontal Divisions</label>
                 <input type="number" id="horizontalDivisions" name="horizontalDivisions" class="form-control" min="0" max="300" value="0" required th:placeholder="#{split-by-sections.horizontal.placeholder}">

src/main/resources/templates/split-pdfs.html

@@ -18,7 +18,7 @@
               <span class="material-symbols-rounded tool-header-icon organize">cut</span>
               <span class="tool-header-text" th:text="#{split.header}"></span>
             </div>
-            <form th:action="@{api/v1/general/split-pages}" method="post" enctype="multipart/form-data">
+            <form th:action="@{'/api/v1/general/split-pages'}" method="post" enctype="multipart/form-data">
               <div
                 th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}">
               </div>

src/main/resources/templates/view-pdf.html

@@ -28,18 +28,18 @@ See https://github.com/adobe-type-tools/cmap-resources
     <title>PDF.js viewer</title>
 
     <!-- Bootstrap -->
-    <script src="js/thirdParty/popper.min.js"></script>
+    <script th:src="@{'/js/thirdParty/popper.min.js'}"></script>
-    <script src="js/thirdParty/bootstrap.min.js"></script>
+    <script th:src="@{'/js/thirdParty/bootstrap.min.js'}"></script>
 
-    <link rel="stylesheet" href="css/theme/componentes.css">
+    <link rel="stylesheet" th:href="@{'/css/theme/componentes.css'}">
-    <link rel="stylesheet" href="css/navbar.css">
+    <link rel="stylesheet" th:href="@{'/css/navbar.css'}">
 
     <!-- This snippet is used in production (included from view-pdf.html) -->
-    <link rel="resource" type="application/l10n" href="./pdfjs-legacy/locale/locale.json">
+    <link rel="resource" type="application/l10n" th:href="@{'/pdfjs-legacy/locale/locale.json'}">
-    <script src="./pdfjs-legacy/pdf.mjs" type="module"></script>
+    <script th:src="@{'/pdfjs-legacy/pdf.mjs'}" type="module"></script>
 
-    <link rel="stylesheet" href="./pdfjs-legacy/css/viewer.css">
+    <link rel="stylesheet" th:href="@{'/pdfjs-legacy/css/viewer.css'}">
-    <script src="./pdfjs-legacy/js/viewer.mjs" type="module"></script>
+    <script th:src="@{'/pdfjs-legacy/js/viewer.mjs'}" type="module"></script>
   </head>
 
   <body tabindex="1">
@@ -298,8 +298,8 @@ See https://github.com/adobe-type-tools/cmap-resources
                   <input type="number" id="pageNumber" class="toolbarField" title="Page" value="1" min="1" tabindex="15" data-l10n-id="pdfjs-page-input" autocomplete="off">
                 </span>
                 <span id="numPages" class="toolbarLabel"></span>
-                <a class="navbar-brand hiddenMediumView" th:href="@{/}" tabindex="16" >
+                <a class="navbar-brand hiddenMediumView" th:href="@{'/'}" tabindex="16" >
-                  <img class="main-icon" src="favicon.svg" alt="icon" style="max-height: 1.6rem; width: auto;">
+                  <img class="main-icon" th:src="@{'/favicon.svg'}" alt="icon" style="max-height: 1.6rem; width: auto;">
                   <span class="icon-text" style="color: #ffffff;" th:text="${@appName}">Stirling PDF</span>
                 </a>
               </div>
@@ -308,7 +308,7 @@ See https://github.com/adobe-type-tools/cmap-resources
                   <button id="editorHighlight" class="toolbarButton" hidden="true" disabled="disabled" title="Highlight" role="radio" aria-checked="false" aria-controls="editorHighlightParamsToolbar" tabindex="31" data-l10n-id="pdfjs-editor-highlight-button">
                     <span data-l10n-id="pdfjs-editor-highlight-button-label">Highlight</span>
                   </button>
-                  <a id="backToHome" class="toolbarButton hiddenMediumView" title="Back to Main Page" role="radio" aria-checked="false" tabindex="32" th:href="@{/}">
+                  <a id="backToHome" class="toolbarButton hiddenMediumView" title="Back to Main Page" role="radio" aria-checked="false" tabindex="32" th:href="@{'/'}">
                     <span data-l10n-id="pdfjs-open-file-button-label">Back to Main Page</span>
                   </a>
                   <button id="openFile" class="toolbarButton hiddenMediumView" title="Open File" role="radio" aria-checked="false" tabindex="33" data-l10n-id="pdfjs-open-file-button">