fix: resolve z-index and background issues for canvas visibility

Remove opaque background, adjust z-index, and add base color for proper theming.

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
This commit is contained in:
v0
2026-02-04 15:21:03 +00:00
parent 822c08bda8
commit 7c45e9a868
2 changed files with 8 additions and 6 deletions

View File

@@ -111,7 +111,9 @@ export function TechBackground() {
const animate = () => {
const isDark = document.documentElement.classList.contains("dark")
ctx.clearRect(0, 0, canvas.width, canvas.height)
// Fill with base background color
ctx.fillStyle = isDark ? "hsl(224, 71%, 4%)" : "hsl(0, 0%, 100%)"
ctx.fillRect(0, 0, canvas.width, canvas.height)
// Draw subtle gradient overlay
const gradient = ctx.createRadialGradient(
@@ -165,7 +167,7 @@ export function TechBackground() {
return (
<canvas
ref={canvasRef}
className="fixed inset-0 pointer-events-none -z-10"
className="fixed inset-0 pointer-events-none z-0"
aria-hidden="true"
/>
)