fix: preserve wood paneling on dashboard refresh and improve colors

- Fix View All link flashing by preserving data-wood attribute when dashboard re-renders
- Update wood-dark text color to match wood-mahogany (#f5f5f5) for better consistency
- Add smart link colors for wood paneling (#0066cc for light wood, #66ccff for dark woods)
- Fix carousel arrow gradients to be less harsh on wood backgrounds (0.6 for light, 0.3 for dark)
- Remove accent color preservation rule that was conflicting with wood-specific link colors

web/src/dashboard.ts

@@ -128,6 +128,9 @@ async function switchLibrary(libraryId: string): Promise<void> {
 function renderCollections(sections: SectionData[]): void {
     const container = document.getElementById('collections-container') as HTMLElement;
     if (!container) return;
+    
+    // Preserve wood paneling attribute
+    const currentWood = container.getAttribute('data-wood');
 
     container.innerHTML = sections.map(section => `
         <div class="dashboard-collection mb-8" data-collection-id="${section.id}">
@@ -178,6 +181,10 @@ function renderCollections(sections: SectionData[]): void {
             </div>
         </div>
     `).join('');
+
+    if(currentWood) {
+        container.setAttribute('data-wood', currentWood)
+    }
 }
 
 function renderBookCard(book: BookInfo): string {

web/static/input.css

@@ -215,11 +215,11 @@
       --wood-border: #2a2a2a;
   }
 
-  /* Wood Dark - needs medium text */
+  /* Wood Dark - needs light text */
   #collections-container[data-wood="wood-dark"] {
-      --wood-text-primary: #d0d0d0;
+      --wood-text-primary: #f5f5f5;
-      --wood-text-secondary: #a0a0a0;
+      --wood-text-secondary: #c0c0c0;
-      --wood-border: #5a4a3a;
+      --wood-border: #5c3317;
   }
 
   /* Wood Mahogany - needs light text (darkest background) */
@@ -246,9 +246,31 @@
       color: var(--wood-text-secondary) !important;
   }
 
-  /* Preserve accent color for links */
+  /* Links on wood-light need darker color for visibility */
-  #collections-container[data-wood] a[style*="accent"] {
+  #collections-container[data-wood="wood-light"] a {
-      color: var(--accent) !important;
+      color: #0066cc !important;
+  }
+  /* Links on dark woods use lighter color */
+  #collections-container[data-wood="wood-dark"] a,
+  #collections-container[data-wood="wood-mahogany"] a {
+      color: #66ccff !important;
+  }
+
+    /* Wood Light - use darker gradient */
+  #collections-container[data-wood="wood-light"] .carousel-nav-left {
+      background: linear-gradient(to right, rgba(0, 0, 0, 0.6), transparent);
+  }
+  #collections-container[data-wood="wood-light"] .carousel-nav-right {
+      background: linear-gradient(to left, rgba(0, 0, 0, 0.6), transparent);
+  }
+  /* Wood Dark/Mahogany - use subtle white/transparent gradient */
+  #collections-container[data-wood="wood-dark"] .carousel-nav-left,
+  #collections-container[data-wood="wood-mahogany"] .carousel-nav-left {
+      background: linear-gradient(to right, rgba(0, 0, 0, 0.3), transparent);
+  }
+  #collections-container[data-wood="wood-dark"] .carousel-nav-right,
+  #collections-container[data-wood="wood-mahogany"] .carousel-nav-right {
+      background: linear-gradient(to left, rgba(0, 0, 0, 0.3), transparent);
   }
 
   /* Add subtle borders to book cards on wood backgrounds */

web/static/style.css

@@ -1563,12 +1563,12 @@ body:not(.page-docs) .header-nav {
   --wood-border: #2a2a2a;
 }
 
-/* Wood Dark - needs medium text */
+/* Wood Dark - needs light text */
 
 #collections-container[data-wood="wood-dark"] {
-  --wood-text-primary: #d0d0d0;
+  --wood-text-primary: #f5f5f5;
-  --wood-text-secondary: #a0a0a0;
+  --wood-text-secondary: #c0c0c0;
-  --wood-border: #5a4a3a;
+  --wood-border: #5c3317;
 }
 
 /* Wood Mahogany - needs light text (darkest background) */
@@ -1597,10 +1597,39 @@ body:not(.page-docs) .header-nav {
   color: var(--wood-text-secondary) !important;
 }
 
-/* Preserve accent color for links */
+/* Links on wood-light need darker color for visibility */
 
-#collections-container[data-wood] a[style*="accent"] {
+#collections-container[data-wood="wood-light"] a {
-  color: var(--accent) !important;
+  color: #0066cc !important;
+}
+
+/* Links on dark woods use lighter color */
+
+#collections-container[data-wood="wood-dark"] a,
+  #collections-container[data-wood="wood-mahogany"] a {
+  color: #66ccff !important;
+}
+
+/* Wood Light - use darker gradient */
+
+#collections-container[data-wood="wood-light"] .carousel-nav-left {
+  background: linear-gradient(to right, rgba(0, 0, 0, 0.6), transparent);
+}
+
+#collections-container[data-wood="wood-light"] .carousel-nav-right {
+  background: linear-gradient(to left, rgba(0, 0, 0, 0.6), transparent);
+}
+
+/* Wood Dark/Mahogany - use subtle white/transparent gradient */
+
+#collections-container[data-wood="wood-dark"] .carousel-nav-left,
+  #collections-container[data-wood="wood-mahogany"] .carousel-nav-left {
+  background: linear-gradient(to right, rgba(0, 0, 0, 0.3), transparent);
+}
+
+#collections-container[data-wood="wood-dark"] .carousel-nav-right,
+  #collections-container[data-wood="wood-mahogany"] .carousel-nav-right {
+  background: linear-gradient(to left, rgba(0, 0, 0, 0.3), transparent);
 }
 
 /* Add subtle borders to book cards on wood backgrounds */