improved loader styling

fleetbase · May 16, 2024 · d95004f · d95004f
1 parent 7279d29
commit d95004f
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/addon/styles/layout/legacy.css b/addon/styles/layout/legacy.css
@@ -369,7 +369,7 @@ body[data-theme='dark'] .overlay-panel-section-title {
 
 #console-loader,
 .overloader {
-    @apply absolute inset-0 w-full h-full bg-gray-100 text-gray-800 flex items-center justify-center bg-opacity-10;
+    @apply absolute inset-0 w-full h-full text-gray-800 flex items-center justify-center bg-opacity-10;
     z-index: 9999999999;
 }
 

diff --git a/addon/styles/layout/next.css b/addon/styles/layout/next.css
@@ -1894,6 +1894,19 @@ a.text-danger:hover {
     animation: rotation 1s linear infinite;
 }
 
+.overloader > .loader-container {
+    background: rgba(243, 244, 246, .25);
+    border: 1px solid #d1d5db;
+    backdrop-filter: blur(3.5px);
+    border-radius: .5rem;
+    padding: .25rem .85rem;
+}
+
+body[data-theme="dark"] .overloader > .loader-container {
+    background: rgb(31, 41, 55, .25);
+    border: 1px solid rgba(15, 23, 42, .25);
+}
+
 @keyframes rotation {
     0% {
         transform: rotate(0deg);