diff --git a/ui/public/index.html b/ui/public/index.html
index 3c2b1841..73eb0af1 100644
--- a/ui/public/index.html
+++ b/ui/public/index.html
@@ -9,31 +9,42 @@
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <div id="root">
-      <style>
-        @keyframes _doc-spin {
-          to { transform: rotate(360deg) }
-        }
-        #doc-spinner {
-          position: fixed;
-          top: 50%;
-          left: 50%;
-          transform: translate(-50%, -50%);
-        }
-        #doc-spinner .spinner {
-          box-sizing: border-box;
-          display: inline-block;
-          width: 2rem;
-          height: 2rem;
-          vertical-align: -.125em;
-          border: .25rem solid currentColor;
-          border-right-color: transparent;
-          color: rgba(108, 117, 125, .75);
-          border-radius: 50%;
-          animation: 0.75s linear infinite _doc-spin;
-        }
-      </style>
-      <div id="doc-spinner">
-        <div class="spinner"></div>
+      <div id="spin-mask">
+        <style>
+          @keyframes _doc-spin {
+            to { transform: rotate(360deg) }
+          }
+          #spin-mask {
+            position: fixed;
+            top: 0;
+            right: 0;
+            bottom: 0;
+            left: 0;
+            background-color: white;
+            z-index: 9999;
+          }
+          #spin-container {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+          }
+          #spin-container .spinner {
+            box-sizing: border-box;
+            display: inline-block;
+            width: 2rem;
+            height: 2rem;
+            vertical-align: -.125em;
+            border: .25rem solid currentColor;
+            border-right-color: transparent;
+            color: rgba(108, 117, 125, .75);
+            border-radius: 50%;
+            animation: 0.75s linear infinite _doc-spin;
+          }
+        </style>
+        <div id="spin-container">
+          <div class="spinner"></div>
+        </div>
       </div>
     </div>
   </body>
diff --git a/ui/src/components/CustomizeTheme/index.tsx b/ui/src/components/CustomizeTheme/index.tsx
index 63524e37..1310358c 100644
--- a/ui/src/components/CustomizeTheme/index.tsx
+++ b/ui/src/components/CustomizeTheme/index.tsx
@@ -76,6 +76,12 @@ const Index: FC = () => {
               .dropdown-menu {
                 --bs-dropdown-link-active-bg: rgb(var(--bs-primary-rgb));
               }
+              .link-primary {
+                color: ${primaryColor.hex()}!important;
+              }
+              .link-primary:hover, .link-primary:focus {
+                color: ${shadeColor(primaryColor, 0.8).hex()}!important
+              }
             `}
         </style>
       )}
