Files
andreandClaude Fable 5 c5c4a818f2 fix(contraste+fontes): verde de texto legível em fundo claro e Roboto auto-hospedado
Contraste (auditoria 4.8, WCAG AA):
- Novo token --fitme-accent-ink #667000 (≈5.1:1 sobre #F7F8FA), aplicado aos 7
  usos de texto que estavam em --fitme-accent-dark (#A6B600 ≈2.1:1 em fundo claro).
  O --fitme-accent-dark mantém-se para fundos de botões em hover/active (onde tem
  texto escuro por cima — escurecê-lo quebraria esses estados).
- .section-eyebrow passa a usar o ink green nas secções claras (oferta, galeria,
  modalidades, horário, workhours); as secções escuras mantêm o verde vivo.

Fontes (CSS "Google Fonts ainda carregado do CDN"):
- Roboto (variável, latin, 43 KB woff2) em site/assets/fonts/roboto/.
- @font-face 100-900 em style.css; removidos os <link> para fonts.googleapis.com
  em include.php e gym_chooser.php. Ficam apenas os pedidos à API do Places
  (legítimos, server-side).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-25 23:22:06 +01:00

54 lines
3.1 KiB
PHP

<?php
// Root page when more than one gym is published (site/index.php includes this
// instead of redirecting): pick a gym. Self-contained — no gym is "current"
// here, so it doesn't go through _open.php. Expects $pdo and $published.
$gyms = $published ?? db_gyms_published($pdo);
$brand = 'FitMe';
?><!doctype html>
<html lang="pt">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><?= htmlspecialchars($brand) ?> — Escolhe o teu ginásio</title>
<meta name="description" content="<?= htmlspecialchars($brand) ?>: <?= htmlspecialchars(implode(', ', array_map(fn($g) => $g['name'] . ($g['locality'] !== '' ? ' (' . $g['locality'] . ')' : ''), $gyms))) ?>.">
<link rel="canonical" href="<?= htmlspecialchars(base_url()) ?>">
<?php if (seo_noindex()): ?><meta name="robots" content="noindex, nofollow"><?php endif; ?>
<link rel="icon" type="image/svg+xml" href="<?= base_url('site/assets/img/logos/logo_black.svg') ?>">
<style>
@font-face { font-family:'Roboto'; font-style:normal; font-weight:100 900; font-display:swap;
src:url('<?= base_url('site/assets/fonts/roboto/roboto-latin.woff2') ?>') format('woff2'); }
:root { --accent:#C2D500; --dark:#0B0B0D; --dark2:#16181A; --ash:#B8B9BE; }
* { box-sizing: border-box; }
body { margin:0; min-height:100svh; font-family:Roboto,system-ui,sans-serif; color:#fff;
background:#141517 url('<?= base_url('site/assets/img/home.jpg') ?>') center/cover fixed; }
.wrap { min-height:100svh; background:rgba(11,11,13,.82); display:flex; flex-direction:column;
align-items:center; justify-content:center; padding:48px 16px; gap:36px; }
h1 { margin:0; font-size:clamp(1.8rem,4vw,2.6rem); font-weight:900; text-transform:uppercase; text-align:center; }
h1 span { color:var(--accent); }
.gyms { display:flex; flex-wrap:wrap; gap:18px; justify-content:center; width:100%; max-width:900px; }
a.gym { flex:1 1 260px; max-width:320px; display:block; padding:28px 24px; border-radius:8px; text-decoration:none;
color:#fff; background:var(--dark2); border:2px solid rgba(255,255,255,.08);
transition:border-color .25s, transform .25s; }
a.gym:hover, a.gym:focus-visible { border-color:var(--accent); transform:translateY(-4px); outline:none; }
.gym strong { display:block; font-size:1.4rem; font-weight:900; text-transform:uppercase; }
.gym span { color:var(--ash); }
.gym em { display:inline-block; margin-top:14px; font-style:normal; font-weight:700; color:var(--accent); }
</style>
</head>
<body>
<main class="wrap">
<img src="<?= base_url('site/assets/img/logos/logo_black.svg') ?>" alt="<?= htmlspecialchars($brand) ?>" style="width:170px;filter:invert(1)" decoding="async">
<h1>Escolhe o teu <span>ginásio</span></h1>
<div class="gyms">
<?php foreach ($gyms as $g): ?>
<a class="gym" href="<?= htmlspecialchars(gym_url($g)) ?>">
<strong><?= htmlspecialchars($g['name']) ?></strong>
<?php if ($g['locality'] !== ''): ?><span><?= htmlspecialchars($g['locality']) ?></span><?php endif; ?>
<br><em>Entrar →</em>
</a>
<?php endforeach; ?>
</div>
</main>
</body>
</html>