refactor: update splashscreen bg colour

src/main/index.js

@@ -45,6 +45,7 @@ const createLoadingWindow = () => {
     width: 800,
     height: 600,
     parent: mainWindow,
+    backgroundColor: '#f7fafb',
     skipTaskbar: true,
     frame: false,
     autoHideMenuBar: true,
@@ -76,6 +77,7 @@ function createWindow () {
     height: windowState.height,
     x: windowState.x,
     y: windowState.y,
+    backgroundColor: '#f7fafb',
     center: true,
     show: false,
     webPreferences: {

src/renderer/App.vue

@@ -6,9 +6,11 @@
       'background-image': background,
       windows: isWindows,
       mac: isMac,
-      linux: isLinux
+      linux: isLinux,
+      'bg-theme-page': isReady,
+      'bg-default-background': !isReady
     }]"
-    class="App bg-theme-page text-theme-page-text font-sans"
+    class="App text-theme-page-text font-sans"
   >
     <div
       v-if="!hasSeenIntroduction"

src/renderer/SplashScreen.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="absolute h-full w-full flex flex-col text-center select-none">
+  <div class="bg-default-background absolute h-full w-full flex flex-col text-center select-none">
     <div class="flex flex-1 justify-center">
       <div class="rounded-lg mb-3 p-5 bg-red m-auto">
         <img

tailwind.js

@@ -43,6 +43,7 @@ View the full documentation at https://tailwindcss.com.
 
 let colors = {
   // Custom color variables
+  'default-background': '#f7fafb',
   'theme-page': 'var(--theme-page)',
   'theme-page-text': 'var(--theme-page-text)',
   'theme-page-text-light': 'var(--theme-page-text-light)',