feat: replace SVG icons with Lucide components across various Svelte components for improved consistency and maintainability
This commit is contained in:
@@ -1,5 +1,20 @@
|
||||
<script lang="ts">
|
||||
import { resolve } from '$app/paths';
|
||||
import {
|
||||
Settings,
|
||||
Headphones,
|
||||
ShieldCheck,
|
||||
Mail,
|
||||
Users,
|
||||
Bell,
|
||||
Monitor,
|
||||
FileText,
|
||||
UserPlus,
|
||||
Clock,
|
||||
Video,
|
||||
Building,
|
||||
Info
|
||||
} from 'lucide-svelte';
|
||||
type HighlightVariant = 'solid' | 'outline';
|
||||
type FeatureIcon =
|
||||
| 'control'
|
||||
@@ -45,13 +60,6 @@
|
||||
highlightBadges?: Array<{ label: string; variant: HighlightVariant }>;
|
||||
};
|
||||
|
||||
type IconPath = {
|
||||
d: string;
|
||||
strokeLinecap?: 'butt' | 'round' | 'square';
|
||||
strokeLinejoin?: 'miter' | 'round' | 'bevel';
|
||||
strokeWidth?: number;
|
||||
};
|
||||
|
||||
const paletteStyles: Record<
|
||||
PaletteKey,
|
||||
{
|
||||
@@ -129,7 +137,8 @@
|
||||
}
|
||||
};
|
||||
|
||||
const iconPaths: Record<FeatureIcon, IconPath[]> = {
|
||||
// Removido: iconPaths substituído por iconComponents com Lucide
|
||||
const iconPaths_OLD: Record<FeatureIcon, IconPath[]> = {
|
||||
control: [
|
||||
{
|
||||
d: 'M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4',
|
||||
@@ -457,22 +466,11 @@
|
||||
<div
|
||||
class={`relative flex h-14 w-14 shrink-0 items-center justify-center rounded-2xl ${paletteStyles[card.palette].iconBg} ${paletteStyles[card.palette].iconRing}`}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
<svelte:component
|
||||
this={iconComponents[card.icon]}
|
||||
class={`h-7 w-7 ${paletteStyles[card.palette].iconColor}`}
|
||||
>
|
||||
{#each iconPaths[card.icon] as path (path.d)}
|
||||
<path
|
||||
d={path.d}
|
||||
stroke-linecap={path.strokeLinecap ?? 'round'}
|
||||
stroke-linejoin={path.strokeLinejoin ?? 'round'}
|
||||
stroke-width={path.strokeWidth ?? 2}
|
||||
/>
|
||||
{/each}
|
||||
</svg>
|
||||
strokeWidth={2}
|
||||
/>
|
||||
</div>
|
||||
<div class="relative flex-1">
|
||||
<h2 class="text-base-content text-xl font-semibold">
|
||||
@@ -487,22 +485,11 @@
|
||||
<div
|
||||
class={`relative flex h-14 w-14 shrink-0 items-center justify-center rounded-2xl ${paletteStyles[card.palette].iconBg} ${paletteStyles[card.palette].iconRing}`}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
<svelte:component
|
||||
this={iconComponents[card.icon]}
|
||||
class={`h-7 w-7 ${paletteStyles[card.palette].iconColor}`}
|
||||
>
|
||||
{#each iconPaths[card.icon] as path (path.d)}
|
||||
<path
|
||||
d={path.d}
|
||||
stroke-linecap={path.strokeLinecap ?? 'round'}
|
||||
stroke-linejoin={path.strokeLinejoin ?? 'round'}
|
||||
stroke-width={path.strokeWidth ?? 2}
|
||||
/>
|
||||
{/each}
|
||||
</svg>
|
||||
strokeWidth={2}
|
||||
/>
|
||||
</div>
|
||||
<div class="relative flex-1">
|
||||
<h2 class="text-base-content text-xl font-semibold">
|
||||
@@ -522,19 +509,7 @@
|
||||
<div
|
||||
class="bg-warning/25 text-warning flex h-12 w-12 items-center justify-center rounded-full"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
class="h-6 w-6 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"
|
||||
/>
|
||||
</svg>
|
||||
<Info class="h-6 w-6 stroke-current" strokeWidth={2} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-base-content text-lg font-bold">Área Restrita</h3>
|
||||
|
||||
Reference in New Issue
Block a user