diff --git a/internal/webserver/embedded/js/upload.js b/internal/webserver/embedded/js/upload.js
index 3bfff7d2..7f6fd28a 100644
--- a/internal/webserver/embedded/js/upload.js
+++ b/internal/webserver/embedded/js/upload.js
@@ -24,6 +24,7 @@
 
   uploadForm.addEventListener('submit', (event) => {
     let spinner = document.querySelector('.spinner-border');
-    spinner.classList.remove('visually-hidden')
+    spinner.classList.remove('visually-hidden');
+    spinner.classList.add('htmx-request');
     fileSubmit.setAttribute('disabled', '');
   });
diff --git a/internal/webserver/embedded/views/document/upload.html b/internal/webserver/embedded/views/document/upload.html
index d5e3233b..b86b9ef7 100644
--- a/internal/webserver/embedded/views/document/upload.html
+++ b/internal/webserver/embedded/views/document/upload.html
@@ -7,10 +7,8 @@ <h1>{{t .Lang "Upload document" }}</h1>
         <form action="/documents" method="post" enctype="multipart/form-data" id="upload-form">
             <div class="input-group">
                 <input type="file" name="filename" id="file-selector" accept=".epub,.pdf, application/epub+zip,application/pdf" class="form-control form-control-lg" required data-max_size="{{.MaxSize}}" data-error_too_large='{{t .Lang "Document too large, the maximum allowed size is %d megabytes" .MaxSize}}'>
-                <button type="submit" id="file-submit" value='{{t .Lang "Upload"}}' class="btn btn-primary">
-                    <span id="spinner" class="spinner-border spinner-border-sm visually-hidden" aria-hidden="true">
-                        &nbsp;&nbsp;
-                    </span>
+                <button type="submit" id="file-submit" value='{{t .Lang "Upload"}}' class="btn btn-primary d-inline-flex align-items-center">
+                    <span id="spinner" class="spinner-border spinner-border-sm visually-hidden me-2" aria-hidden="true"></span>
                     {{t .Lang "Upload"}}
                 </button>
                 <div class="invalid-feedback visually-hidden">