fix: text and theme icon colors (#920)

apps/token/src/components/splash-loader/splash-loader.tsx

@@ -25,7 +25,7 @@ export const SplashLoader = ({ text = 'Loading' }: { text?: string }) => {
           );
         })}
       </div>
-      <div>{text}</div>
+      <div className="text-white">{text}</div>
     </div>
   );
 };

apps/trading/pages/_app.page.tsx

@@ -28,7 +28,7 @@ function AppBody({ Component, pageProps }: AppProps) {
 
   return (
     <ThemeContext.Provider value={theme}>
-      <div className="h-full text-white relative text-black-60 dark:text-white-60 z-0 grid grid-rows-[min-content,1fr]">
+      <div className="h-full relative text-black-60 dark:text-white-60 z-0 grid grid-rows-[min-content,1fr]">
         <AppLoader>
           <div className="flex items-stretch border-b-[7px] bg-black border-vega-pink dark:border-vega-yellow">
             <Navbar />
@@ -41,7 +41,11 @@ function AppBody({ Component, pageProps }: AppProps) {
                   store.setVegaWalletManageDialog(open);
                 }}
               />
-              <ThemeSwitcher onToggle={toggleTheme} className="-my-4" />
+              <ThemeSwitcher
+                onToggle={toggleTheme}
+                className="-my-4"
+                sunClassName="text-white"
+              />
             </div>
           </div>
           <main data-testid={pageProps.page} className="dark:bg-black">

libs/ui-toolkit/src/components/splash/splash.tsx

@@ -8,8 +8,7 @@ export interface SplashProps {
 export const Splash = ({ children }: SplashProps) => {
   const splashClasses = classNames(
     'w-full h-full',
-    'flex items-center justify-center',
-    'text-white'
+    'flex items-center justify-center'
   );
   return <div className={splashClasses}>{children}</div>;
 };