Update enrollment details for 2026: Enhance ProgramPage with additional eligibility criteria and benefits, and improve main page with updated enrollment information.
This commit is contained in:
117
src/error.html
Normal file
117
src/error.html
Normal file
@@ -0,0 +1,117 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="pt-BR">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>%sveltekit.status% • %sveltekit.error.message%</title>
|
||||||
|
<meta name="robots" content="noindex" />
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--page-bg: #eef3ff;
|
||||||
|
--text-strong: #0f1f3a;
|
||||||
|
--text: #2b3a55;
|
||||||
|
--text-muted: #60708a;
|
||||||
|
--accent-blue: #1f4a86;
|
||||||
|
}
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
|
||||||
|
color: var(--text);
|
||||||
|
background:
|
||||||
|
radial-gradient(1000px 500px at 10% 0%, rgba(31, 74, 134, 0.14), transparent 60%),
|
||||||
|
radial-gradient(900px 480px at 90% 10%, rgba(244, 208, 29, 0.16), transparent 55%),
|
||||||
|
radial-gradient(800px 420px at 30% 100%, rgba(43, 179, 74, 0.12), transparent 55%),
|
||||||
|
var(--page-bg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrap {
|
||||||
|
max-width: 56rem;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 3.5rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
background: rgba(255, 255, 255, 0.85);
|
||||||
|
border: 1px solid rgba(15, 31, 58, 0.08);
|
||||||
|
border-radius: 24px;
|
||||||
|
box-shadow: 0 1px 0 rgba(15, 31, 58, 0.04);
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.kicker {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: 0.12em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: var(--text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin: 0.5rem 0 0;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
line-height: 1.2;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
color: var(--text-strong);
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0.75rem 0 0;
|
||||||
|
line-height: 1.55;
|
||||||
|
}
|
||||||
|
|
||||||
|
.actions {
|
||||||
|
margin-top: 1.75rem;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 0.75rem 1rem;
|
||||||
|
border-radius: 14px;
|
||||||
|
background: var(--accent-blue);
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 0.75rem 1rem;
|
||||||
|
border-radius: 14px;
|
||||||
|
background: rgba(255, 255, 255, 0.85);
|
||||||
|
color: var(--text-strong);
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 700;
|
||||||
|
border: 1px solid rgba(15, 31, 58, 0.1);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="wrap">
|
||||||
|
<div class="card">
|
||||||
|
<div class="kicker">Erro %sveltekit.status%</div>
|
||||||
|
<h1>%sveltekit.error.message%</h1>
|
||||||
|
<p>
|
||||||
|
Se o problema persistir, volte para a página inicial e tente novamente mais tarde.
|
||||||
|
</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a class="primary" href="/">Ir para a página inicial</a>
|
||||||
|
<button class="secondary" type="button" onclick="location.reload()">Recarregar</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
92
src/routes/+error.svelte
Normal file
92
src/routes/+error.svelte
Normal file
@@ -0,0 +1,92 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { page } from '$app/state';
|
||||||
|
|
||||||
|
const isNotFound = $derived(page.status === 404);
|
||||||
|
const isServerError = $derived(page.status >= 500);
|
||||||
|
|
||||||
|
const title = $derived(isNotFound ? 'Página não encontrada' : 'Não foi possível carregar esta página');
|
||||||
|
const description = $derived(
|
||||||
|
isNotFound
|
||||||
|
? 'O endereço pode estar incorreto, ou a página foi movida/removida.'
|
||||||
|
: 'Ocorreu um erro ao processar sua solicitação. Tente novamente em alguns instantes.'
|
||||||
|
);
|
||||||
|
|
||||||
|
// Evita expor detalhes quando o erro é inesperado (SvelteKit usa "Internal Error").
|
||||||
|
const safeDetails = $derived(
|
||||||
|
!isNotFound && page.error?.message && page.error.message !== 'Internal Error' ? page.error.message : null
|
||||||
|
);
|
||||||
|
|
||||||
|
function goBack() {
|
||||||
|
if (typeof history !== 'undefined') history.back();
|
||||||
|
}
|
||||||
|
|
||||||
|
function reload() {
|
||||||
|
if (typeof location !== 'undefined') location.reload();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<svelte:head>
|
||||||
|
<title>{page.status} • {title} • Secretaria de Esportes de Pernambuco</title>
|
||||||
|
<meta name="robots" content="noindex" />
|
||||||
|
</svelte:head>
|
||||||
|
|
||||||
|
<div class="min-h-dvh bg-(--page-bg)">
|
||||||
|
<main class="mx-auto w-full max-w-6xl px-4 pb-14 pt-10 sm:px-6 sm:pt-14">
|
||||||
|
<section class="overflow-hidden rounded-3xl bg-white/80 shadow-sm ring-1 ring-black/5">
|
||||||
|
<div class="px-6 py-10 sm:px-10 sm:py-12">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-widest text-(--text-muted)">
|
||||||
|
Erro {page.status}
|
||||||
|
</p>
|
||||||
|
<h1 class="mt-2 text-2xl font-extrabold tracking-tight text-(--text-strong) sm:text-3xl">
|
||||||
|
{title}
|
||||||
|
</h1>
|
||||||
|
<p class="mt-3 max-w-2xl text-sm leading-relaxed text-(--text)">
|
||||||
|
{description}
|
||||||
|
</p>
|
||||||
|
|
||||||
|
{#if safeDetails}
|
||||||
|
<div class="mt-5 rounded-2xl bg-white/70 p-4 ring-1 ring-black/5">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-widest text-(--text-muted)">Detalhes</p>
|
||||||
|
<p class="mt-2 text-sm text-(--text)">{safeDetails}</p>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
|
<div class="mt-8 flex flex-wrap items-center gap-3">
|
||||||
|
<a
|
||||||
|
href="/"
|
||||||
|
class="inline-flex items-center justify-center rounded-xl bg-(--accent-blue) px-4 py-3 text-sm font-bold text-white shadow-sm transition hover:bg-(--accent-blue)/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--accent-blue) focus-visible:ring-offset-2 focus-visible:ring-offset-white"
|
||||||
|
>
|
||||||
|
Ir para a página inicial
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={goBack}
|
||||||
|
class="inline-flex items-center justify-center rounded-xl bg-white px-4 py-3 text-sm font-bold text-(--text-strong) ring-1 ring-black/10 shadow-sm transition hover:bg-white/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--focus-ring) focus-visible:ring-offset-2 focus-visible:ring-offset-white"
|
||||||
|
>
|
||||||
|
Voltar
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{#if isServerError}
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={reload}
|
||||||
|
class="inline-flex items-center justify-center rounded-xl bg-white px-4 py-3 text-sm font-bold text-(--text-strong) ring-1 ring-black/10 shadow-sm transition hover:bg-white/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--focus-ring) focus-visible:ring-offset-2 focus-visible:ring-offset-white"
|
||||||
|
>
|
||||||
|
Tentar novamente
|
||||||
|
</button>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-8 rounded-2xl bg-white/70 p-5 ring-1 ring-black/5">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-widest text-(--text-muted)">Dica</p>
|
||||||
|
<p class="mt-2 text-sm text-(--text)">
|
||||||
|
Se você chegou aqui por um link antigo, volte para a página inicial e escolha o programa no card
|
||||||
|
correspondente.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
|
||||||
Reference in New Issue
Block a user