some window ui tweaks

src-tauri/Cargo.lock

@@ -1523,6 +1523,7 @@ name = "haystack"
 version = "0.1.0"
 dependencies = [
  "base64 0.21.7",
+ "cocoa",
  "notify",
  "serde",
  "serde_json",

src-tauri/Cargo.toml

@@ -18,7 +18,7 @@ crate-type = ["staticlib", "cdylib", "rlib"]
 tauri-build = { version = "2", features = [] }
 
 [dependencies]
-tauri = { version = "2", features = [] }
+tauri = { version = "2", features = ["macos-private-api"] }
 tauri-plugin-opener = "2"
 serde = { version = "1", features = ["derive"] }
 serde_json = "1"
@@ -27,3 +27,5 @@ notify = "6.1.1"
 base64 = "0.21.7"
 tokio = { version = "1.36.0", features = ["full"] }
 
+[target."cfg(target_os = \"macos\")".dependencies]
+cocoa = "0.26"

src-tauri/src/lib.rs

@@ -8,6 +8,7 @@ use base64::{Engine as _, engine::general_purpose::STANDARD as BASE64};
 use std::sync::Mutex;
 use std::sync::Arc;
 use tauri::AppHandle;
+use tauri::{TitleBarStyle, WebviewUrl, WebviewWindowBuilder};
 
 
 // Global state to store the watcher

src-tauri/tauri.conf.json

@@ -1,38 +1,40 @@
 {
-  "$schema": "https://schema.tauri.app/config/2",
-  "productName": "haystack",
-  "version": "0.1.0",
-  "identifier": "com.haystack.app",
-  "build": {
-    "beforeDevCommand": "bun run dev",
-    "devUrl": "http://localhost:1420",
-    "beforeBuildCommand": "bun run build",
-    "frontendDist": "../dist"
-  },
-  "app": {
-    "windows": [
-      {
-        "title": "Haystack",
-        "width": 640,
-        "height": 480,
-        "decorations": false,
-        "transparent": true,
-        "resizable": false
-      }
-    ],
-    "security": {
-      "csp": null
-    }
-  },
-  "bundle": {
-    "active": true,
-    "targets": "all",
-    "icon": [
-      "icons/32x32.png",
-      "icons/128x128.png",
-      "icons/128x128@2x.png",
-      "icons/icon.icns",
-      "icons/icon.ico"
-    ]
-  }
+	"$schema": "https://schema.tauri.app/config/2",
+	"productName": "haystack",
+	"version": "0.1.0",
+	"identifier": "com.haystack.app",
+	"build": {
+		"beforeDevCommand": "bun run dev",
+		"devUrl": "http://localhost:1420",
+		"beforeBuildCommand": "bun run build",
+		"frontendDist": "../dist"
+	},
+	"app": {
+		"windows": [
+			{
+				"title": "Haystack",
+				"width": 640,
+				"height": 480,
+				"decorations": false,
+				"transparent": true,
+				"resizable": false,
+				"shadow": true
+			}
+		],
+		"macOSPrivateApi": true,
+		"security": {
+			"csp": null
+		}
+	},
+	"bundle": {
+		"active": true,
+		"targets": "all",
+		"icon": [
+			"icons/32x32.png",
+			"icons/128x128.png",
+			"icons/128x128@2x.png",
+			"icons/icon.icns",
+			"icons/icon.ico"
+		]
+	}
 }

src/components/TitleBar.tsx

@@ -1,7 +1,7 @@
 export function TitleBar() {
 	return (
-		<div class="h-8 bg-[#1a1a1a] flex items-center px-4" data-tauri-drag-region>
-			<div class="text-white text-sm">Haystack</div>
+		<div class="h-8 flex items-center rounded-t-xl px-4" data-tauri-drag-region>
+			<div class="text-sm">Haystack</div>
 		</div>
 	);
 }

src/index.css

@@ -2,15 +2,14 @@
 @tailwind components;
 @tailwind utilities;
 
+
 :root {
+  @apply bg-gray-100 text-black rounded-xl;
   font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
   font-size: 16px;
   line-height: 24px;
   font-weight: 400;
 
-  color: #0f0f0f;
-  background-color: #f6f6f6;
-
   font-synthesis: none;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;