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:
@@ -12,6 +12,7 @@
|
||||
import PresenceManager from "$lib/components/chat/PresenceManager.svelte";
|
||||
import { getBrowserInfo } from "$lib/utils/browserInfo";
|
||||
import { getAvatarUrl } from "$lib/utils/avatarGenerator";
|
||||
import { Menu, User, Home, UserPlus, XCircle, LogIn, Tag, Plus, Check } from "lucide-svelte";
|
||||
|
||||
let { children }: { children: Snippet } = $props();
|
||||
|
||||
@@ -180,21 +181,11 @@
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-white/0 to-white/20 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
|
||||
|
||||
<!-- Ícone de menu hambúrguer -->
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
<Menu
|
||||
class="w-7 h-7 text-white relative z-10 group-hover:scale-110 transition-transform duration-300"
|
||||
style="filter: drop-shadow(0 2px 8px rgba(0,0,0,0.3));"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2.5"
|
||||
d="M4 6h16M4 12h16M4 18h16"
|
||||
stroke="currentColor"
|
||||
></path>
|
||||
</svg>
|
||||
strokeWidth={2.5}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="flex-1 flex items-center gap-4 lg:gap-6">
|
||||
@@ -261,15 +252,10 @@
|
||||
/>
|
||||
{:else}
|
||||
<!-- Ícone de usuário moderno (fallback) -->
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
<User
|
||||
class="w-7 h-7 text-white relative z-10 group-hover:scale-110 transition-transform duration-300"
|
||||
style="filter: drop-shadow(0 2px 8px rgba(0,0,0,0.3));"
|
||||
>
|
||||
<path fill-rule="evenodd" d="M18.685 19.097A9.723 9.723 0 0021.75 12c0-5.385-4.365-9.75-9.75-9.75S2.25 6.615 2.25 12a9.723 9.723 0 003.065 7.097A9.716 9.716 0 0012 21.75a9.716 9.716 0 006.685-2.653zm-12.54-1.285A7.486 7.486 0 0112 15a7.486 7.486 0 015.855 2.812A8.224 8.224 0 0112 20.25a8.224 8.224 0 01-5.855-2.438zM15.75 9a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
/>
|
||||
{/if}
|
||||
|
||||
<!-- Badge de status online -->
|
||||
@@ -301,21 +287,11 @@
|
||||
<div class="absolute inset-0 rounded-full bg-white/10 group-hover:animate-ping"></div>
|
||||
|
||||
<!-- Ícone de login premium -->
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
<User
|
||||
class="h-8 w-8 relative z-10 text-white group-hover:scale-110 transition-all duration-500"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
style="filter: drop-shadow(0 2px 8px rgba(0,0,0,0.3));"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M17.982 18.725A7.488 7.488 0 0 0 12 15.75a7.488 7.488 0 0 0-5.982 2.975m11.963 0a9 9 0 1 0-11.963 0m11.963 0A8.966 8.966 0 0 1 12 21a8.966 8.966 0 0 1-5.982-2.275M15 9.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
|
||||
/>
|
||||
</svg>
|
||||
strokeWidth={2.5}
|
||||
/>
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
@@ -365,20 +341,10 @@
|
||||
href="/"
|
||||
class={getMenuClasses(currentPath === "/")}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
<Home
|
||||
class="h-5 w-5 group-hover:scale-110 transition-transform"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"
|
||||
/>
|
||||
</svg>
|
||||
strokeWidth={2}
|
||||
/>
|
||||
<span>Dashboard</span>
|
||||
</a>
|
||||
</li>
|
||||
@@ -399,20 +365,10 @@
|
||||
href="/solicitar-acesso"
|
||||
class={getSolicitarClasses(currentPath === "/solicitar-acesso")}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
<UserPlus
|
||||
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="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"
|
||||
/>
|
||||
</svg>
|
||||
strokeWidth={2}
|
||||
/>
|
||||
<span>Solicitar acesso</span>
|
||||
</a>
|
||||
</li>
|
||||
@@ -446,9 +402,7 @@
|
||||
|
||||
{#if erroLogin}
|
||||
<div class="alert alert-error mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<XCircle class="stroke-current shrink-0 h-6 w-6" strokeWidth={2} />
|
||||
<span>{erroLogin}</span>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -492,9 +446,7 @@
|
||||
<span class="loading loading-spinner loading-sm"></span>
|
||||
Entrando...
|
||||
{:else}
|
||||
<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="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1" />
|
||||
</svg>
|
||||
<LogIn class="h-5 w-5" strokeWidth={2} />
|
||||
Entrar
|
||||
{/if}
|
||||
</button>
|
||||
@@ -559,16 +511,12 @@
|
||||
<!-- Informações de Versão -->
|
||||
<div class="bg-primary/10 rounded-xl p-6 space-y-3">
|
||||
<div class="flex items-center justify-center gap-2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z" />
|
||||
</svg>
|
||||
<Tag class="h-5 w-5 text-primary" strokeWidth={2} />
|
||||
<p class="text-sm font-medium text-base-content/70">Versão</p>
|
||||
</div>
|
||||
<p class="text-2xl font-bold text-primary">1.0 26_2025</p>
|
||||
<div class="badge badge-warning badge-lg gap-2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
|
||||
</svg>
|
||||
<Plus class="h-4 w-4" strokeWidth={2} />
|
||||
Em Desenvolvimento
|
||||
</div>
|
||||
</div>
|
||||
@@ -603,9 +551,7 @@
|
||||
class="btn btn-primary btn-lg w-full max-w-xs mx-auto shadow-lg hover:shadow-xl transition-all duration-300"
|
||||
onclick={closeAboutModal}
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
|
||||
</svg>
|
||||
<Check class="h-6 w-6" strokeWidth={2} />
|
||||
OK
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user