SESP/sgse-app
2
0
Fork 0
Code Issues 3 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: replace SVG icons with Lucide components in various dashboard pages for improved consistency and maintainability

Browse Source
This commit is contained in:
deyvisonwanderley
2025-12-04 15:34:24 -03:00
parent 88f25dc6ab
commit eb7f3507d3
14 changed files with 151 additions and 1248 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
apps/web/src/routes/(dashboard)/secretaria-executiva/+page.svelte
View File

@@ -1,13 +1,13 @@
<script lang="ts">
import { resolve } from '$app/paths';
import WidgetGestaoPontos from '$lib/components/ponto/WidgetGestaoPontos.svelte';
import { Clock, ChevronRight, Info } from 'lucide-svelte';
const menuItems = [
{
categoria: 'Gestão de Ausências',
descricao: 'Gerencie solicitações de ausências e aprovações',
icon: `<svg xmlns="http://www.w3.org/2000/svg" class="h-12 w-12" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>`,
iconComponent: Clock,
gradient: 'from-orange-500/10 to-orange-600/20',
accentColor: 'text-orange-600',
bgIcon: 'bg-orange-500/20',
@@ -16,9 +16,7 @@
nome: 'Gestão de Ausências',
descricao: 'Visualizar e gerenciar solicitações de ausências',
href: '/secretaria-executiva/gestao-ausencias',
icon: `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>`
iconComponent: Clock
}
]
}
@@ -48,9 +46,7 @@
<!-- Cabeçalho da Categoria -->
<div class="mb-6 flex items-start gap-6">
<div class="p-4 {categoria.bgIcon} rounded-2xl">
<div class={categoria.accentColor}>
{@html categoria.icon}
</div>
<svelte:component this={categoria.iconComponent} class="h-12 w-12 {categoria.accentColor}" strokeWidth={2} />
</div>
<div class="flex-1">
<h2 class="card-title mb-2 text-2xl {categoria.accentColor}">
@@ -72,24 +68,9 @@
<div
class="bg-base-100 group-hover:bg-primary rounded-lg p-3 transition-colors duration-300 group-hover:text-white"
>
<div class="{categoria.accentColor} group-hover:text-white">
{@html opcao.icon}
</div>
<svelte:component this={opcao.iconComponent} class="h-5 w-5 {categoria.accentColor} group-hover:text-white" strokeWidth={2} />
</div>
<svg
xmlns="http://www.w3.org/2000/svg"
class="text-base-content/30 group-hover:text-primary h-5 w-5 transition-colors duration-300"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 5l7 7-7 7"
/>
</svg>
<ChevronRight class="text-base-content/30 group-hover:text-primary h-5 w-5 transition-colors duration-300" strokeWidth={2} />
</div>
<h3
class="text-base-content group-hover:text-primary mb-2 text-lg font-bold transition-colors duration-300"
@@ -115,19 +96,7 @@
<!-- Card de Ajuda -->
<div class="alert alert-info mt-8 shadow-lg">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
class="h-6 w-6 shrink-0 stroke-current"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
></path>
</svg>
<Info class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
<div>
<h3 class="font-bold">Precisa de ajuda?</h3>
<div class="text-sm">