refactor: clean up Svelte components and improve code readability
- Refactored multiple Svelte components to enhance code clarity and maintainability. - Standardized formatting and indentation across various files for consistency. - Improved error handling messages in the AprovarAusencias component for better user feedback. - Updated class names in the UI components to align with the new design system. - Removed unnecessary whitespace and comments to streamline the codebase.
This commit is contained in:
@@ -11,7 +11,14 @@
|
||||
| "document"
|
||||
| "teams"
|
||||
| "userPlus";
|
||||
type PaletteKey = "primary" | "success" | "secondary" | "accent" | "info" | "error" | "warning";
|
||||
type PaletteKey =
|
||||
| "primary"
|
||||
| "success"
|
||||
| "secondary"
|
||||
| "accent"
|
||||
| "info"
|
||||
| "error"
|
||||
| "warning";
|
||||
|
||||
type FeatureCard = {
|
||||
title: string;
|
||||
@@ -294,32 +301,54 @@
|
||||
</script>
|
||||
|
||||
<main class="mx-auto w-full max-w-7xl space-y-12 px-4 py-10">
|
||||
<section class="relative overflow-hidden rounded-3xl border border-primary/25 bg-gradient-to-br from-primary/10 via-base-100 to-secondary/20 p-8 shadow-2xl">
|
||||
<div class="absolute -left-10 top-10 h-40 w-40 rounded-full bg-primary/20 blur-3xl"></div>
|
||||
<div class="absolute -bottom-16 right-0 h-56 w-56 rounded-full bg-secondary/20 blur-3xl"></div>
|
||||
<div class="relative z-10 flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between">
|
||||
<section
|
||||
class="relative overflow-hidden rounded-3xl border border-primary/25 bg-linear-to-br from-primary/10 via-base-100 to-secondary/20 p-8 shadow-2xl"
|
||||
>
|
||||
<div
|
||||
class="absolute -left-10 top-10 h-40 w-40 rounded-full bg-primary/20 blur-3xl"
|
||||
></div>
|
||||
<div
|
||||
class="absolute -bottom-16 right-0 h-56 w-56 rounded-full bg-secondary/20 blur-3xl"
|
||||
></div>
|
||||
<div
|
||||
class="relative z-10 flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between"
|
||||
>
|
||||
<div class="max-w-3xl space-y-4">
|
||||
<span class="inline-flex w-fit items-center gap-2 rounded-full border border-primary/40 bg-primary/10 px-4 py-1 text-xs font-semibold uppercase tracking-[0.28em] text-primary">
|
||||
<span
|
||||
class="inline-flex w-fit items-center gap-2 rounded-full border border-primary/40 bg-primary/10 px-4 py-1 text-xs font-semibold uppercase tracking-[0.28em] text-primary"
|
||||
>
|
||||
Tecnologia da Informação
|
||||
</span>
|
||||
<h1 class="text-4xl font-black leading-tight text-base-content sm:text-5xl">
|
||||
<h1
|
||||
class="text-4xl font-black leading-tight text-base-content sm:text-5xl"
|
||||
>
|
||||
Sistemas de Informação
|
||||
</h1>
|
||||
<p class="text-base leading-relaxed text-base-content/70 sm:text-lg">
|
||||
Acesso restrito para gerenciamento de solicitações de acesso ao sistema, configuração de permissões e monitoramento técnico das operações do SGSE.
|
||||
Acesso restrito para gerenciamento de solicitações de acesso ao
|
||||
sistema, configuração de permissões e monitoramento técnico das
|
||||
operações do SGSE.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-4 rounded-2xl border border-base-200/60 bg-base-100/70 p-6 shadow-lg backdrop-blur sm:max-w-sm">
|
||||
<div
|
||||
class="grid grid-cols-2 gap-4 rounded-2xl border border-base-200/60 bg-base-100/70 p-6 shadow-lg backdrop-blur sm:max-w-sm"
|
||||
>
|
||||
<div>
|
||||
<p class="text-sm font-semibold text-base-content/60">Status</p>
|
||||
<p class="mt-2 text-2xl font-bold text-base-content">Operacional</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="text-sm font-semibold text-base-content/60">Última atualização</p>
|
||||
<p class="text-sm font-semibold text-base-content/60">
|
||||
Última atualização
|
||||
</p>
|
||||
<p class="mt-2 text-xl font-bold text-base-content">Agora mesmo</p>
|
||||
</div>
|
||||
<div class="col-span-2 h-px bg-gradient-to-r from-transparent via-base-300 to-transparent"></div>
|
||||
<div class="col-span-2 flex items-center justify-between text-sm text-base-content/70">
|
||||
<div
|
||||
class="col-span-2 h-px bg-linear-to-r from-transparent via-base-300 to-transparent"
|
||||
></div>
|
||||
<div
|
||||
class="col-span-2 flex items-center justify-between text-sm text-base-content/70"
|
||||
>
|
||||
<span>Monitoramento em tempo real.</span>
|
||||
<span class="badge badge-primary badge-sm">SGSE</span>
|
||||
</div>
|
||||
@@ -332,7 +361,9 @@
|
||||
<article
|
||||
class={`card-hover group relative overflow-hidden rounded-2xl border ${paletteStyles[card.palette].cardBorder} bg-base-100/90 p-6 shadow-lg transition-all duration-300`}
|
||||
>
|
||||
<div class="absolute inset-x-6 top-0 h-24 rounded-b-full bg-gradient-to-b from-base-200/40 to-transparent opacity-0 transition-opacity duration-300 group-hover:opacity-100"></div>
|
||||
<div
|
||||
class="absolute inset-x-6 top-0 h-24 rounded-b-full bg-linear-to-b from-base-200/40 to-transparent opacity-0 transition-opacity duration-300 group-hover:opacity-100"
|
||||
></div>
|
||||
<div class="relative flex items-start gap-4">
|
||||
<div
|
||||
class={`flex h-14 w-14 items-center justify-center rounded-2xl ${paletteStyles[card.palette].iconBg} ${paletteStyles[card.palette].iconRing}`}
|
||||
@@ -345,7 +376,7 @@
|
||||
class={`h-7 w-7 ${paletteStyles[card.palette].iconColor}`}
|
||||
>
|
||||
{#each iconPaths[card.icon] as path (path.d)}
|
||||
<path
|
||||
<path
|
||||
d={path.d}
|
||||
stroke-linecap={path.strokeLinecap ?? "round"}
|
||||
stroke-linejoin={path.strokeLinejoin ?? "round"}
|
||||
@@ -355,16 +386,22 @@
|
||||
</svg>
|
||||
</div>
|
||||
<div class="relative flex-1">
|
||||
<h2 class="text-xl font-semibold text-base-content">{card.title}</h2>
|
||||
<p class="mt-2 text-sm leading-relaxed text-base-content/70">{card.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="text-xl font-semibold text-base-content">
|
||||
{card.title}
|
||||
</h2>
|
||||
<p class="mt-2 text-sm leading-relaxed text-base-content/70">
|
||||
{card.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{#if card.highlightBadges}
|
||||
<div class="mt-4 flex flex-wrap gap-2">
|
||||
{#each card.highlightBadges as badge (badge.label)}
|
||||
{#if badge.variant === "solid"}
|
||||
<span class={`badge ${paletteStyles[card.palette].badgeSolid}`}>{badge.label}</span>
|
||||
<span class={`badge ${paletteStyles[card.palette].badgeSolid}`}
|
||||
>{badge.label}</span
|
||||
>
|
||||
{:else}
|
||||
<span
|
||||
class={`badge ${paletteStyles[card.palette].badgeOutline} ${paletteStyles[card.palette].iconColor}`}
|
||||
@@ -391,33 +428,45 @@
|
||||
disabled
|
||||
>
|
||||
{card.ctaLabel}
|
||||
</button>
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
</article>
|
||||
{/each}
|
||||
</section>
|
||||
|
||||
<section class="relative overflow-hidden rounded-2xl border border-warning/30 bg-gradient-to-br from-warning/15 via-warning/10 to-warning/5 p-6 shadow-lg">
|
||||
<div class="absolute -top-10 right-0 h-32 w-32 rounded-full bg-warning/30 blur-3xl"></div>
|
||||
<section
|
||||
class="relative overflow-hidden rounded-2xl border border-warning/30 bg-linear-to-br from-warning/15 via-warning/10 to-warning/5 p-6 shadow-lg"
|
||||
>
|
||||
<div
|
||||
class="absolute -top-10 right-0 h-32 w-32 rounded-full bg-warning/30 blur-3xl"
|
||||
></div>
|
||||
<div class="relative z-10 flex items-start gap-4">
|
||||
<div class="flex h-12 w-12 items-center justify-center rounded-full bg-warning/25 text-warning">
|
||||
<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"
|
||||
<div
|
||||
class="flex h-12 w-12 items-center justify-center rounded-full bg-warning/25 text-warning"
|
||||
>
|
||||
<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>
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<h3 class="text-lg font-bold text-base-content">Área Restrita</h3>
|
||||
<p class="mt-2 text-sm leading-relaxed text-base-content/70">
|
||||
Esta área é exclusiva da equipe de Tecnologia da Informação. Garanta que apenas usuários autorizados acessem o Painel Administrativo e mantenha suas credenciais em segurança.
|
||||
Esta área é exclusiva da equipe de Tecnologia da Informação. Garanta
|
||||
que apenas usuários autorizados acessem o Painel Administrativo e
|
||||
mantenha suas credenciais em segurança.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user