From e32921377fb35a92553e86cf00124a20c2406542 Mon Sep 17 00:00:00 2001
From: Julien Froidefond <julien.froidefond@cdbdx.biz>
Date: Sat, 18 Oct 2025 14:17:41 +0200
Subject: [PATCH] feat: enhance ClientLayout with custom background support for
 gradients and images, improving visual presentation

---
 src/components/layout/ClientLayout.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/layout/ClientLayout.tsx b/src/components/layout/ClientLayout.tsx
index bddb55f..5d77a4e 100644
--- a/src/components/layout/ClientLayout.tsx
+++ b/src/components/layout/ClientLayout.tsx
@@ -33,7 +33,6 @@ export default function ClientLayout({ children, initialLibraries = [], initialF
     if (bg.type === "gradient" && bg.gradient) {
       return {
         backgroundImage: bg.gradient,
-        backgroundAttachment: "fixed" as const,
       };
     }
     
@@ -90,9 +89,18 @@ export default function ClientLayout({ children, initialLibraries = [], initialF
   // Ne pas afficher le header et la sidebar sur les routes publiques et le reader
   const isPublicRoute = publicRoutes.includes(pathname) || pathname.startsWith('/books/');
 
+  const hasCustomBackground = preferences.background.type === "gradient" || preferences.background.type === "image";
+
   return (
     <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
-      <div className="relative min-h-screen bg-background" style={backgroundStyle}>
+      {/* Background fixe pour les images et gradients */}
+      {hasCustomBackground && (
+        <div 
+          className="fixed inset-0 -z-10" 
+          style={backgroundStyle}
+        />
+      )}
+      <div className={`relative min-h-screen ${hasCustomBackground ? "bg-background/95" : "bg-background"}`}>
         {!isPublicRoute && <Header onToggleSidebar={handleToggleSidebar} />}
         {!isPublicRoute && (
           <Sidebar