fix: Update checkbox elements to use Bootstrap classes for consistent styling (Stirling-Tools#4412)

Author: balazs-szucs

app/core/src/main/resources/templates/adminSettings.html

@@ -302,8 +302,8 @@ <h5 class="data-modal-title">
 
               <div class="data-form-group" id="checkboxContainer">
                 <div class="form-check">
-                  <input type="checkbox" class="form-check-input" id="forceChange" name="forceChange">
-                  <label class="form-check-label" for="forceChange" th:text="#{adminUserSettings.forceChange}">Force user to change username/password on login</label>
+                  <input id="forceChange" name="forceChange" type="checkbox">
+                  <label for="forceChange" th:text="#{adminUserSettings.forceChange}">Force user to change username/password on login</label>
                 </div>
               </div>
 

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

@@ -29,7 +29,7 @@
                 th:replace="~{fragments/common :: fileSelector(name='fileInput', multipleInputsForSingleRequest=false, accept='application/pdf')}">
               </div>
               <div class="form-check ms-3">
-                <input type="checkbox" name="duplexMode" id="duplexMode">
+                <input id="duplexMode" name="duplexMode" type="checkbox">
                 <label for="duplexMode" th:text=#{autoSplitPDF.duplexMode}></label>
               </div>
               <p>

app/core/src/main/resources/templates/convert/eml-to-pdf.html

@@ -25,16 +25,16 @@
                 th:replace="~{fragments/common :: fileSelector(name='fileInput', multipleInputsForSingleRequest=false, accept='.eml,message/rfc822')}">
               </div>
 
-              <div class="form-check mb-3">
-                <input type="checkbox" class="form-check-input" name="downloadHtml" id="downloadHtml">
-                <label class="form-check-label" for="downloadHtml" th:text="#{EMLToPDF.downloadHtml}"></label>
+                      <div class="form-check mb-3">
+                        <input id="downloadHtml" name="downloadHtml" type="checkbox">
+                        <label for="downloadHtml" th:text="#{EMLToPDF.downloadHtml}"></label>
                 <div class="form-text" th:text="#{EMLToPDF.downloadHtmlHelp}"></div>
               </div>
 
-              <div id="pdfOnlyOptions">
-                <div class="form-check mb-3">
-                  <input type="checkbox" class="form-check-input" name="includeAttachments" id="includeAttachments" checked>
-                  <label class="form-check-label" for="includeAttachments" th:text="#{EMLToPDF.includeAttachments}"></label>
+                      <div id="pdfOnlyOptions">
+                        <div class="form-check mb-3">
+                          <input checked id="includeAttachments" name="includeAttachments" type="checkbox">
+                          <label for="includeAttachments" th:text="#{EMLToPDF.includeAttachments}"></label>
                 </div>
 
                 <div class="mb-3">

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

@@ -36,7 +36,7 @@
               </div>
 
               <div class="form-check ms-3">
-                <input type="checkbox" name="autoRotate" id="autoRotate">
+                <input id="autoRotate" name="autoRotate" type="checkbox">
                 <label for="autoRotate" th:text=#{imageToPDF.selectText.2}></label>
               </div>
               <div class="mb-3">

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

@@ -73,9 +73,9 @@
                   <option value="blackwhite" th:text="#{pdfToImage.blackwhite}"></option>
                 </select>
               </div>
-              <div class="mb-3 form-check">
-                <input class="form-check-input" type="checkbox" id="includeAnnotations" name="includeAnnotations">
-                <label class="form-check-label" for="includeAnnotations" th:text="#{pdfToImage.includeAnnotations}"></label>
+              <div class="form-check mb-3">
+                <input id="includeAnnotations" name="includeAnnotations" type="checkbox">
+                <label for="includeAnnotations" th:text="#{pdfToImage.includeAnnotations}"></label>
               </div>
               <div class="mb-3">
                 <label for="dpi">DPI:</label>

app/core/src/main/resources/templates/edit-table-of-contents.html

@@ -33,13 +33,12 @@
                   th:replace="~{fragments/common :: fileSelector(name='fileInput', multipleInputsForSingleRequest=false, accept='application/pdf')}">
                 </div>
 
-                <div class="mb-3 form-check">
+                <div class="form-check mb-3">
                   <input type="checkbox"
-                    class="form-check-input"
                     id="replaceExisting"
                     name="replaceExisting"
                     checked>
-                  <label class="form-check-label"
+                  <label
                     for="replaceExisting"
                     th:text="#{editTableOfContents.replaceExisting}"></label>
                   <input type="hidden"

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

@@ -284,11 +284,11 @@ <h5 class="modal-title" id="settingsModalLabel" th:text="#{settings.title}"></h5
             <span id="zipThresholdValue" class="ms-2"></span>
           </div>
           <div class="form-check mb-3">
-            <input type="checkbox" id="boredWaiting" th:title="#{settings.bored.help}">
+            <input id="boredWaiting" th:title="#{settings.bored.help}" type="checkbox">
             <label for="boredWaiting" th:text="#{bored}"></label>
           </div>
           <div class="form-check mb-3">
-            <input type="checkbox" id="cacheInputs" th:title="#{settings.cacheInputs.help}">
+            <input id="cacheInputs" th:title="#{settings.cacheInputs.help}" type="checkbox">
             <label for="cacheInputs" th:text="#{settings.cacheInputs.name}"></label>
           </div>
 

app/core/src/main/resources/templates/home.html

@@ -152,7 +152,7 @@ <h5 class="modal-title" id="surveyModalLabel" th:text="#{survey.title}">Stirling
         </div>
         <div class="modal-footer">
           <div class="form-check mb-3">
-            <input type="checkbox" id="dontShowAgain">
+            <input id="dontShowAgain" type="checkbox">
             <label for="dontShowAgain" th:text="#{survey.dontShowAgain}">Don't show again</label>
           </div>
 

app/core/src/main/resources/templates/login.html

@@ -130,7 +130,7 @@ <h2 class="h5 mb-3 fw-normal" th:text="#{login.signinTitle}">Please sign in</h2>
           </div>
 
           <div class="form-check m-2 mb-3">
-            <input type="checkbox" name="remember-me" id="remember-me">
+            <input id="remember-me" name="remember-me" type="checkbox">
             <label for="remember-me" th:text="#{login.rememberme}"></label>
           </div>
           <button type="submit" class="w-100 btn btn-lg btn-primary" th:text="#{login.signin}">Sign in</button>

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

@@ -27,13 +27,13 @@
                   th:replace="~{fragments/common :: fileSelector(name='fileInput', multipleInputsForSingleRequest=true, accept='application/pdf')}">
                 </div>
               </div>
-              <div class="mb-3">
-                <input type="checkbox" name="removeCertSign" id="removeCertSign">
+              <div class="form-check mb-3">
+                <input id="removeCertSign" name="removeCertSign" type="checkbox">
                 <label for="removeCertSign" th:text="#{merge.removeCertSign}">Remove digital signature in the merged
                   file?</label>
               </div>
-              <div class="mb-3">
-                <input type="checkbox" name="generateToc" id="generateToc">
+              <div class="form-check mb-3">
+                <input id="generateToc" name="generateToc" type="checkbox">
                 <label for="generateToc" th:text="#{merge.generateToc}">Generate table of contents in the merged file?</label>
               </div>
               <div class="mb-3">