chore(tauri): minor config and style updates

apps/tauri/src-tauri/tauri.conf.json

@@ -20,7 +20,7 @@
         "minHeight": 500,
         "resizable": true,
         "decorations": false,
-        "transparent": false
+        "transparent": true
       }
     ],
     "security": {

apps/tauri/src/App.svelte

@@ -1,9 +1,11 @@
 <script lang="ts">
   import { onMount } from "svelte";
+  import { platform } from "@tauri-apps/plugin-os";
   import { app } from "./lib/stores/app.svelte";
   import SetupScreen from "./lib/screens/SetupScreen.svelte";
   import TasksScreen from "./lib/screens/TasksScreen.svelte";
 
+  const isLinux = platform() === "linux";
 
   onMount(() => {
     app.loadConfig();
@@ -11,9 +13,11 @@
 </script>
 
 <div class={app.darkMode ? "dark" : ""}>
-  <div class="h-screen w-screen">
+  <div class="h-screen w-screen" class:p-2={isLinux}>
     <div
       class="relative h-full w-full overflow-hidden bg-surface-light text-text-light dark:bg-surface-dark dark:text-text-dark"
+      class:rounded-xl={isLinux}
+      class:linux-window-border={isLinux}
       style="container-type: inline-size"
     >
       {#if app.error}

apps/tauri/src/app.css

@@ -24,11 +24,24 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+html {
+  background: transparent;
+}
+
 body {
   margin: 0;
   overflow: hidden;
   user-select: none;
   -webkit-user-select: none;
+  background: transparent;
+}
+
+.linux-window-border {
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25), 0 0 2px rgba(0, 0, 0, 0.1);
+}
+.dark .linux-window-border {
+  border-color: rgba(255, 255, 255, 0.15);
 }
 
 /* Scrollbar styling */