diff --git a/apps/web/app/(dash)/dialogTriggerWrapper.tsx b/apps/web/app/(dash)/dialogTriggerWrapper.tsx
index 7d21e27e..7dcfc355 100644
--- a/apps/web/app/(dash)/dialogTriggerWrapper.tsx
+++ b/apps/web/app/(dash)/dialogTriggerWrapper.tsx
@@ -7,23 +7,27 @@ import { PlusIcon } from "@heroicons/react/24/solid";
 
 export function DialogDesktopTrigger() {
 	return (
-		<div className="border-gray-700/50 border-[1px] space-y-4 group relative bg-[#1F2428] shadow-md shadow-[#1d1d1dc7] rounded-xl flex justify-center">
-			<button className="cursor-pointer p-2 hover:scale-105 hover:text-[#bfc4c9] active:scale-90">
-				<PlusIcon className="h-6 w-6" />
-			</button>
-			<div className="opacity-0 group-hover:opacity-100 scale-x-50 group-hover:scale-x-100 origin-left transition-all  absolute whitespace-nowrap pointer-events-none border-gray-700/50 border-[1px] bg-[#1F2428] shadow-md shadow-[#1d1d1dc7] rounded-xl px-2 py-1 left-[120%] -top-2">
-				Add Memories
+		<DialogTriggerWrapper>
+			<div className="border-gray-700/50 border-[1px] space-y-4 group relative bg-[#1F2428] shadow-md shadow-[#1d1d1dc7] rounded-xl flex justify-center">
+				<button className="cursor-pointer p-2 hover:scale-105 hover:text-[#bfc4c9] active:scale-90">
+					<PlusIcon className="h-6 w-6" />
+				</button>
+				<div className="opacity-0 group-hover:opacity-100 scale-x-50 group-hover:scale-x-100 origin-left transition-all  absolute whitespace-nowrap pointer-events-none border-gray-700/50 border-[1px] bg-[#1F2428] shadow-md shadow-[#1d1d1dc7] rounded-xl px-2 py-1 left-[120%] -top-2">
+					Add Memories
+				</div>
 			</div>
-		</div>
+		</DialogTriggerWrapper>
 	);
 }
 
 export function DialogMobileTrigger() {
 	return (
-		<div className={`flex flex-col items-center cursor-pointer text-white`}>
-			<PlusIcon className="h-6 w-6 hover:brightness-125 focus:brightness-125 duration-200 stroke-white" />
-			<p className="text-xs text-foreground-menu mt-2">Add</p>
-		</div>
+		<DialogTriggerWrapper>
+			<div className={`flex flex-col items-center cursor-pointer text-white`}>
+				<PlusIcon className="h-6 w-6 hover:brightness-125 focus:brightness-125 duration-200 stroke-white" />
+				<p className="text-xs text-foreground-menu mt-2">Add</p>
+			</div>
+		</DialogTriggerWrapper>
 	);
 }
 export default function DialogTriggerWrapper({
diff --git a/apps/web/app/(dash)/home/heading.tsx b/apps/web/app/(dash)/home/heading.tsx
index 12417a83..dc5b8799 100644
--- a/apps/web/app/(dash)/home/heading.tsx
+++ b/apps/web/app/(dash)/home/heading.tsx
@@ -27,7 +27,7 @@ export function Heading({ queryPresent }: { queryPresent: boolean }) {
 						exit={{ opacity: 0, y: "20%", whiteSpace: "nowrap" }}
 						className={`text-[2.45rem] font-semibold ${
 							queryPresent ? "pointer-events-none" : "pointer-events-auto"
-						} transition-opacity ${poppins.className}`}
+						} transition-opacity text-center ${poppins.className}`}
 					>
 						{headings[showHeading]}
 					</motion.h1>
diff --git a/apps/web/app/(dash)/home/queryinput.tsx b/apps/web/app/(dash)/home/queryinput.tsx
index 930f34db..f15a712b 100644
--- a/apps/web/app/(dash)/home/queryinput.tsx
+++ b/apps/web/app/(dash)/home/queryinput.tsx
@@ -6,15 +6,13 @@ import { FilterSpaces } from "./filterSpaces";
 function QueryInput({
 	setQueryPresent,
 	initialSpaces,
-	className,
 	handleSubmit,
 }: {
-	setQueryPresent: (t:boolean) => void;
+	setQueryPresent: (t: boolean) => void;
 	initialSpaces?: {
 		id: number;
 		name: string;
 	}[];
-	className?: string;
 	mini?: boolean;
 	handleSubmit: (q: string, spaces: { id: number; name: string }[]) => void;
 }) {
@@ -38,7 +36,6 @@ function QueryInput({
 						handleSubmit(q, selectedSpaces);
 						setQ("");
 					}}
-					className=""
 				>
 					<textarea
 						autoFocus
@@ -57,10 +54,12 @@ function QueryInput({
 								setQ("");
 							}
 						}}
-						onChange={(e) => setQ((prev)=> {
-							setQueryPresent(!!(e.target.value.length));
-							return e.target.value;
-						})}
+						onChange={(e) =>
+							setQ((prev) => {
+								setQueryPresent(!!e.target.value.length);
+								return e.target.value;
+							})
+						}
 						value={q}
 					/>
 					<FilterSpaces
diff --git a/apps/web/app/(dash)/layout.tsx b/apps/web/app/(dash)/layout.tsx
index 65a04a9b..24857fb1 100644
--- a/apps/web/app/(dash)/layout.tsx
+++ b/apps/web/app/(dash)/layout.tsx
@@ -17,12 +17,10 @@ async function Layout({ children }: { children: React.ReactNode }) {
 				<Header />
 			</div>
 
-			<div className="relative flex justify-center z-40 pointer-events-none">
 				<div
-					className="absolute -z-10 left-0 top-[10%] h-32 w-[90%] overflow-x-hidden bg-[rgb(54,157,253)] bg-opacity-100 md:bg-opacity-70 blur-[337.4px]"
+					className="absolute z-[100] left-0 top-[10%] h-32 w-[90%] overflow-x-hidden bg-[rgb(54,157,253)] bg-opacity-100 pointer-events-none md:bg-opacity-70 blur-[337.4px]"
 					style={{ transform: "rotate(-30deg)" }}
 				/>
-			</div>
 
 			<Menu />
 
diff --git a/apps/web/package.json b/apps/web/package.json
index 7d97fe7c..f157ad87 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -1,53 +1,54 @@
 {
-	"name": "@repo/web",
-	"version": "1.0.0",
-	"private": true,
-	"packageManager": "yarn@1.22.21",
-	"scripts": {
-		"dev": "next dev",
-		"build": "next build",
-		"start": "next start",
-		"lint": "eslint . --max-warnings 0",
-		"cf-typegen": "wrangler types --env-interface CloudflareEnv env.d.ts",
-		"pages:build": "npx @cloudflare/next-on-pages",
-		"preview": "npm run pages:build && wrangler pages dev",
-		"deploy": "npm run pages:build && wrangler pages deploy --branch main",
-		"schema-update": "bunx drizzle-kit generate sqlite",
-		"update-local-db": "bunx wrangler d1 execute dev-d1-anycontext --local",
-		"update-prod-db": "bunx wrangler d1 execute prod-d1-supermemory --remote"
-	},
-	"dependencies": {
-		"@radix-ui/react-dialog": "^1.0.5",
-		"@radix-ui/react-popover": "^1.0.7",
-		"@radix-ui/react-slot": "^1.1.0",
-		"@sentry/nextjs": "^8",
-		"cmdk": "^1.0.0",
-		"lowlight": "^3.1.0",
-		"million": "^3.1.6",
-		"next": "^14.1.1",
-		"novel": "^0.4.2",
-		"nuqs": "^1.17.4",
-		"react": "^18.2.0",
-		"react-dom": "^18.2.0",
-		"react-resizable-panels": "^2.0.19",
-		"use-debounce": "^10.0.1"
-	},
-	"devDependencies": {
-		"@next/eslint-plugin-next": "^14.1.1",
-		"@repo/eslint-config": "*",
-		"@repo/typescript-config": "*",
-		"@repo/tailwind-config": "*",
-		"@repo/shared-types": "*",
-		"@types/eslint": "^8.56.5",
-		"@types/node": "^20.11.24",
-		"@types/react": "^18.2.61",
-		"@types/react-dom": "^18.2.19",
-		"eslint": "^8.57.0",
-		"typescript": "^5.3.3"
-	},
-	"trustedDependencies": [
-		"esbuild",
-		"workerd",
-		"xycolors"
-	]
+  "name": "@repo/web",
+  "version": "1.0.0",
+  "private": true,
+  "packageManager": "yarn@1.22.21",
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "eslint . --max-warnings 0",
+    "cf-typegen": "wrangler types --env-interface CloudflareEnv env.d.ts",
+    "pages:build": "npx @cloudflare/next-on-pages",
+    "preview": "npm run pages:build && wrangler pages dev",
+    "deploy": "npm run pages:build && wrangler pages deploy --branch main",
+    "schema-update": "bunx drizzle-kit generate sqlite",
+    "update-local-db": "bunx wrangler d1 execute dev-d1-anycontext --local",
+    "update-prod-db": "bunx wrangler d1 execute prod-d1-supermemory --remote"
+  },
+  "dependencies": {
+    "@radix-ui/react-dialog": "^1.0.5",
+    "@radix-ui/react-popover": "^1.0.7",
+    "@radix-ui/react-slot": "^1.1.0",
+    "@sentry/nextjs": "^8",
+    "cmdk": "^1.0.0",
+    "lowlight": "^3.1.0",
+    "million": "^3.1.6",
+    "next": "^14.1.1",
+    "novel": "^0.4.2",
+    "nuqs": "^1.17.4",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-resizable-panels": "^2.0.19",
+    "react-use-measure": "^2.1.1",
+    "use-debounce": "^10.0.1"
+  },
+  "devDependencies": {
+    "@next/eslint-plugin-next": "^14.1.1",
+    "@repo/eslint-config": "*",
+    "@repo/typescript-config": "*",
+    "@repo/tailwind-config": "*",
+    "@repo/shared-types": "*",
+    "@types/eslint": "^8.56.5",
+    "@types/node": "^20.11.24",
+    "@types/react": "^18.2.61",
+    "@types/react-dom": "^18.2.19",
+    "eslint": "^8.57.0",
+    "typescript": "^5.3.3"
+  },
+  "trustedDependencies": [
+    "esbuild",
+    "workerd",
+    "xycolors"
+  ]
 }
diff --git a/bun.lockb b/bun.lockb
index 46b3cd51..6daefb02 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/packages/tailwind-config/globals.css b/packages/tailwind-config/globals.css
index 5e5804ad..ffce0b11 100644
--- a/packages/tailwind-config/globals.css
+++ b/packages/tailwind-config/globals.css
@@ -236,10 +236,8 @@ body {
 }
 
 .bg {
-  background-color:#171B1F;
-  background-image: linear-gradient(#1f24287a 2px, transparent 2px),
-  linear-gradient(90deg, #1f24287a 2px, transparent 2px);
-
-  background-size: 100px 100px, 100px 100px, 20px 20px, 20px 20px;
-  background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px;
+	background-color: #171B1F;
+	opacity: 1;
+	background: radial-gradient(circle, transparent 20%, #171B1F 20%, #171B1F 80%, transparent 80%, transparent), radial-gradient(circle, transparent 20%, #171B1F 20%, #171B1F 80%, transparent 80%, transparent) 100px 100px, linear-gradient(#1a1f23 8px, transparent 8px) 0 -4px, linear-gradient(90deg, #1a1f23 8px, #171B1F 8px) -4px 0;
+	background-size: 100px 100px, 100px 100px, 100px 100px, 100px 100px;
 }
\ No newline at end of file