Hartmut/CapaKraken
1
0
Fork 0
Code Issues 10 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix: Blueprint list dark theme — target badges and sidebar categories

Browse Source 
- PROJECT badge: dark:bg-purple-900/40 dark:text-purple-300
- RESOURCE badge: dark:bg-blue-900/40 dark:text-blue-300
- Global badge: dark:bg-amber-900/40 dark:text-amber-300
- Table rows: dark:hover:bg-gray-800/50, dark:border-gray-700/50
- Blueprint name: dark:text-gray-100
- Field/preset counts: dark:text-gray-400
- Sidebar category buttons in .map(): added missing dark: variants
  (root cause of persistent white hover backgrounds)

Co-Authored-By: claude-flow <ruv@ruv.net>
This commit is contained in:
Hartmut Nörenberg
2026-03-22 20:54:07 +01:00
parent 4bd4b23657
commit a9a8a13424
2 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/blueprints/BlueprintsClient.tsx
+6 -6
View File
@@ -369,7 +369,7 @@ export function BlueprintsClient() {
const isProject = bp.target === "PROJECT";
return (
<tr key={bp.id} className="border-b border-gray-100 last:border-b-0 hover:bg-gray-50 transition-colors">
<tr key={bp.id} className="border-b border-gray-100 dark:border-gray-700/50 last:border-b-0 hover:bg-gray-50 dark:hover:bg-gray-800/50 transition-colors">
<td className="px-3 py-3">
<input
type="checkbox"
@@ -380,20 +380,20 @@ export function BlueprintsClient() {
</td>
<td className="px-3 py-3">
<div className="min-w-0">
<div className="font-medium text-gray-900">{bp.name}</div>
<div className="font-medium text-gray-900 dark:text-gray-100">{bp.name}</div>
{bp.description && <div className="text-xs text-gray-500 mt-0.5 truncate">{bp.description}</div>}
</div>
</td>
<td className="px-3 py-3">
<span className={`inline-block px-2 py-0.5 text-xs rounded-full font-medium ${isProject ? "bg-purple-50 text-purple-700" : "bg-blue-50 text-blue-700"}`}>
<span className={`inline-block px-2 py-0.5 text-xs rounded-full font-medium ${isProject ? "bg-purple-50 text-purple-700 dark:bg-purple-900/40 dark:text-purple-300" : "bg-blue-50 text-blue-700 dark:bg-blue-900/40 dark:text-blue-300"}`}>
{bp.target}
</span>
</td>
<td className="px-3 py-3 text-center text-gray-600">{fieldCount}</td>
<td className="px-3 py-3 text-center text-gray-600">{isProject ? presetCount : "—"}</td>
<td className="px-3 py-3 text-center text-gray-600 dark:text-gray-400">{fieldCount}</td>
<td className="px-3 py-3 text-center text-gray-600 dark:text-gray-400">{isProject ? presetCount : "—"}</td>
<td className="px-3 py-3 text-center">
{bp.isGlobal ? (
<span className="inline-block px-2 py-0.5 text-xs rounded-full bg-amber-100 text-amber-700 font-medium">
<span className="inline-block px-2 py-0.5 text-xs rounded-full bg-amber-100 text-amber-700 dark:bg-amber-900/40 dark:text-amber-300 font-medium">
Global
</span>
) : (