Improve background color contrast

explorer/src/components/ClusterStatusButton.tsx

@@ -21,9 +21,9 @@ function Button({ expand }: { expand?: boolean }) {
 
   const btnClasses = (variant: string) => {
     if (expand) {
-      return `btn lift d-block btn-${variant}`;
+      return `btn b-white lift d-block btn-${variant}`;
     } else {
-      return `btn lift btn-outline-${variant}`;
+      return `btn b-white lift btn-outline-${variant}`;
     }
   };
 

explorer/src/scss/_solana-variables.scss

@@ -5,7 +5,7 @@
 
 // Example of a variable override to change Dashkit's background color
 // Remove the "//" to comment it in and see it in action!
-$body-bg: #ffffff;
+$body-bg: #f9fdfc;
 
 // Dashkit scss needs to know where img masks are stored
 $path-to-img: "../../img/dashkit" !default;

explorer/src/scss/_solana.scss

@@ -57,6 +57,19 @@ code {
   cursor: pointer;
 }
 
+.b-white {
+  background: $white;
+}
+
+.dropdown-exit {
+  position: absolute;
+  z-index: 100;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+
 .btn-outline-warning:hover {
   .spinner-grow {
     color: $dark !important;