diff --git a/src/vcen-edit/comps/CatalogSidebar.svelte b/src/vcen-edit/comps/CatalogSidebar.svelte index 3108a32..aa38be5 100644 --- a/src/vcen-edit/comps/CatalogSidebar.svelte +++ b/src/vcen-edit/comps/CatalogSidebar.svelte @@ -86,9 +86,9 @@ function isNodeActive(kind: string, objId?: ObjID, secId?: SecID): boolean { return isActiveSel(kind, objId, secId) } -const ITEM_BASE = "flex items-center gap-1.5 px-3 py-1.5 text-xs cursor-pointer select-none transition-colors border-l-2" -const ITEM_ACTIVE = "bg-indigo-600/10 text-indigo-300 border-indigo-500" -const ITEM_INACTIVE = "text-gray-500 hover:text-gray-200 hover:bg-gray-800/50 border-transparent" +const ITEM_BASE = "flex items-center gap-1.5 px-3 py-2 text-sm cursor-pointer select-none transition-colors border-l-2" +const ITEM_ACTIVE = "bg-gray-800 text-gray-100 border-blue-500" +const ITEM_INACTIVE = "text-gray-300 hover:text-gray-100 hover:bg-gray-800 border-transparent"
@@ -203,8 +203,8 @@ const ITEM_INACTIVE = "text-gray-500 hover:text-gray-200 hover:bg-gray-800/50 bo role="button" tabindex="0" onclick={() => toggleObj(obj.id)} onkeydown={e => e.key === 'Enter' && toggleObj(obj.id)} - class="flex items-center gap-1.5 px-3 py-1.5 text-xs cursor-pointer - select-none transition-colors text-gray-400 hover:text-gray-200 hover:bg-gray-800/40 + class="flex items-center gap-1.5 px-3 py-2 text-sm cursor-pointer + select-none transition-colors text-gray-300 hover:text-gray-100 hover:bg-gray-800 border-l-2 border-transparent group" > toggleSec(sec.id)} onkeydown={e => e.key === 'Enter' && toggleSec(sec.id)} - class="flex items-center gap-1.5 pl-9 pr-3 py-1 text-xs cursor-pointer - select-none transition-colors text-gray-500 hover:text-gray-200 hover:bg-gray-800/40 + class="flex items-center gap-1.5 pl-9 pr-3 py-2 text-sm cursor-pointer + select-none transition-colors text-gray-300 hover:text-gray-100 hover:bg-gray-800 border-l-2 border-transparent group" >