ADUANASOFT/plantillas-proyectos
13
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feature/app-laucher-mejoras

Browse Source
This commit is contained in:
hreyes
2026-05-29 13:10:23 -06:00
parent 6d545da31c
commit 496068ba1c
2 changed files with 20 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/lib/components/sidebar/app-launcher.svelte
View File

@@ -38,14 +38,14 @@
{#snippet child({ props })}
<button
{...props}
class="inline-flex size-8 shrink-0 items-center justify-center rounded-md
class="inline-flex size-10 shrink-0 select-none items-center justify-center rounded-md
text-sidebar-foreground/70 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground
transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring
data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
title="Aplicaciones"
aria-label="Abrir selector de aplicaciones"
>
<LayoutGridIcon class="size-4" />
<LayoutGridIcon class="size-5" />
</button>
{/snippet}
</DropdownMenu.Trigger>

21
frontend/src/lib/components/sidebar/app-sidebar.svelte
View File

@@ -84,6 +84,21 @@
inventory: BarChart3Icon,
};
const SYSTEM_COLORS: Record<SystemType, { border: string; bg: string; iconBg: string; iconText: string }> = {
fixed_asset: {
border: 'border-amber-500/40',
bg: 'bg-amber-500/5 dark:bg-amber-500/10',
iconBg: 'bg-amber-500/10',
iconText: 'text-amber-600 dark:text-amber-400',
},
inventory: {
border: 'border-emerald-500/40',
bg: 'bg-emerald-500/5 dark:bg-emerald-500/10',
iconBg: 'bg-emerald-500/10',
iconText: 'text-emerald-600 dark:text-emerald-400',
},
};
onMount(() => {
const expandForKeyboardNav = () => {
sidebar.setOpen(true);
@@ -104,15 +119,15 @@
{@const activeLabel = systemStore.activeLabel}
{@const activeSystem = systemStore.activeSystem}
{@const Icon = activeSystem ? ACTIVE_ICONS[activeSystem] : null}
{@const colors = activeSystem ? SYSTEM_COLORS[activeSystem] : null}
<div
class="flex items-center gap-2 rounded-lg border border-primary/40 bg-primary/5 px-3 py-2 text-xs shadow-sm
dark:bg-primary/10"
class="flex items-center gap-2 rounded-lg border {colors?.border} {colors?.bg} px-3 py-2 text-xs shadow-sm"
aria-label={`Aplicación activa: ${activeLabel.name}`}
title={`Aplicación activa: ${activeLabel.name}`}
>
{#if Icon}
<div class="flex size-8 items-center justify-center rounded-md bg-primary/10 text-primary">
<div class="flex size-8 items-center justify-center rounded-md {colors?.iconBg} {colors?.iconText}">
<Icon class="size-4" />
</div>
{/if}