refactor: update components to use lucide icons and improve structure

- Replaced SVG icons with lucide-svelte components across various files for consistency and improved performance.
- Refactored ActionGuard, ErrorModal, FileUpload, and other components to enhance readability and maintainability.
- Updated the dashboard pages to include new icons and improved layout for better user experience.
- Enhanced StatsCard component to support dynamic icon rendering, allowing for more flexible usage.
- Improved overall styling and structure in multiple components to align with design standards.
This commit is contained in:
2025-11-05 12:09:41 -03:00
parent 6cb7414dcc
commit c459297968
22 changed files with 2085 additions and 2423 deletions

View File

@@ -11,7 +11,7 @@
import SalaReuniaoManager from "./SalaReuniaoManager.svelte";
import { getAvatarUrl } from "$lib/utils/avatarGenerator";
import { authStore } from "$lib/stores/auth.svelte";
import { Bell, X } from "lucide-svelte";
import { Bell, X, ArrowLeft, LogOut, MoreVertical, Users, Clock, XCircle } from "lucide-svelte";
interface Props {
conversaId: string;
@@ -117,18 +117,10 @@
aria-label="Voltar"
title="Voltar para lista de conversas"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"
<ArrowLeft
class="w-6 h-6 text-primary"
>
<path d="M19 12H5M12 19l-7-7 7-7"/>
</svg>
strokeWidth={2.5}
/>
</button>
<!-- Avatar e Info -->
@@ -215,20 +207,10 @@
title="Sair da conversa"
>
<div class="absolute inset-0 bg-red-500/0 group-hover:bg-red-500/10 transition-colors duration-300"></div>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
<LogOut
class="w-5 h-5 text-red-500 relative z-10 group-hover:scale-110 transition-transform"
>
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/>
<polyline points="16 17 21 12 16 7"/>
<line x1="21" y1="12" x2="9" y2="12"/>
</svg>
strokeWidth={2}
/>
</button>
{/if}
@@ -247,20 +229,10 @@
title="Recursos administrativos"
>
<div class="absolute inset-0 bg-blue-500/0 group-hover:bg-blue-500/10 transition-colors duration-300"></div>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
<MoreVertical
class="w-5 h-5 text-blue-500 relative z-10 group-hover:scale-110 transition-transform"
>
<circle cx="12" cy="12" r="1"/>
<circle cx="12" cy="5" r="1"/>
<circle cx="12" cy="19" r="1"/>
</svg>
strokeWidth={2}
/>
</button>
{#if showAdminMenu}
<ul
@@ -277,9 +249,7 @@
showAdminMenu = false;
}}
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-4 h-4">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 19.128a9.38 9.38 0 0 0 2.625.372 9.337 9.337 0 0 0 4.121-.952 4.125 4.125 0 0 0-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 0 1 8.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0 1 11.964-3.07M12 6.375a3.375 3.375 0 1 1-6.75 0 3.375 3.375 0 0 1 6.75 0Zm8.25 2.25a2.625 2.625 0 1 1-5.25 0 2.625 2.625 0 0 1 5.25 0Z" />
</svg>
<Users class="w-4 h-4" strokeWidth={2} />
Gerenciar Participantes
</button>
</li>
@@ -293,9 +263,7 @@
showAdminMenu = false;
}}
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-4 h-4">
<path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9A6 6 0 0 0 6 9v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0" />
</svg>
<Bell class="w-4 h-4" strokeWidth={2} />
Enviar Notificação
</button>
</li>
@@ -324,9 +292,7 @@
})();
}}
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-4 h-4">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
</svg>
<XCircle class="w-4 h-4" strokeWidth={2} />
Encerrar Reunião
</button>
</li>
@@ -345,19 +311,10 @@
title="Agendar mensagem"
>
<div class="absolute inset-0 bg-purple-500/0 group-hover:bg-purple-500/10 transition-colors duration-300"></div>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
<Clock
class="w-5 h-5 text-purple-500 relative z-10 group-hover:scale-110 transition-transform"
>
<circle cx="12" cy="12" r="10"/>
<polyline points="12 6 12 12 16 14"/>
</svg>
strokeWidth={2}
/>
</button>
</div>
</div>