YvvandClaude Opus 5.5
81b604e5f2
- Accueil : le titre, le leitmotiv en trois lignes (contexte et cadrage · processus et modalités · boîte à outils), puis directement le choix du groupe ; sans session, la connexion à sa place. /groupes redirige vers /, « Mes groupes » et le retour après connexion mènent à /. - Logo « Clé de voûte » du DA (signe en currentColor, clé en --cle, libre Literata italique, Decision romain), droit, dans le menu et la barre mobile ; Stamp retiré, le sceau 井 ne bouge pas. Favicon, icônes 16/32/48, apple-touch, 192/512, manifeste. - Quatre ambiances : pierre et calcaire (claires), nuit et ardoise (sombres), --cle par ambiance ; quatre pastilles à la place du soleil / lune ; première visite selon l'appareil (pierre / nuit). Calcaire et ardoise : textes, accent, mousse et avertissement à 4,5:1 au moins. - Page d'un groupe : les quatre piliers, puis « En cours ». - Menu : nombre de docs en cours à côté de « Docs de référence », surligné seulement dedans, seul Docs réagit au survol ; les trois autres éteints mais ouvrent leur page ; hors d'un groupe, le dernier groupe ouvert. - /g/[group]/docs « En cours » + « À venir » ; /mandats et /protocoles du groupe : « À venir » éteints ; /g/[group]/decisions : une ligne par doc, « N modules à voter », « dont N sans ton vote ». Anciennes adresses /decisions, /mandats, /protocoles : vers le groupe courant, sinon /. - e2e : C1, C2, C11, C12, M1 mis à jour ; C13–C17 pour L1–L6 ; CONTROLES.md. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
63 lines
1.6 KiB
Svelte
63 lines
1.6 KiB
Svelte
<script lang="ts">
|
|
import { page } from '$app/state';
|
|
import DocCards from '$lib/components/DocCards.svelte';
|
|
import Guard from '$lib/components/Guard.svelte';
|
|
import SoonList from '$lib/components/SoonList.svelte';
|
|
import { groups } from '$lib/groups.svelte';
|
|
import { t } from '$lib/i18n/index.svelte';
|
|
import { Remote } from '$lib/load.svelte';
|
|
|
|
const slug = $derived(page.params.group ?? '');
|
|
const data = new Remote(() => groups.load(slug));
|
|
$effect(() => {
|
|
void slug;
|
|
void data.load();
|
|
});
|
|
</script>
|
|
|
|
{#if data.error}
|
|
<Guard code={data.error} onretry={() => data.load()} />
|
|
{:else if data.value}
|
|
{@const g = data.value.group}
|
|
<div class="page">
|
|
<a class="eyebrow back" href="/g/{g.slug}">{g.name}</a>
|
|
<h1>{t('docs.title')}</h1>
|
|
{#if !g.open}
|
|
<p class="muted">{t('groups.locked.long')}</p>
|
|
{:else}
|
|
<section class="current" aria-labelledby="current-title">
|
|
<h2 class="eyebrow" id="current-title">{t('group.current')}</h2>
|
|
<DocCards group={g.slug} docs={data.value.docs} />
|
|
</section>
|
|
<SoonList items={data.value.upcoming.docs} />
|
|
{/if}
|
|
</div>
|
|
{/if}
|
|
|
|
<style>
|
|
.page {
|
|
max-width: 48rem;
|
|
margin: 0 auto;
|
|
padding: clamp(2.5rem, 8vh, 5rem) 1.4rem 5rem;
|
|
display: grid;
|
|
gap: 0.8rem;
|
|
}
|
|
.back {
|
|
text-decoration: none;
|
|
}
|
|
h1 {
|
|
font-family: var(--font-text);
|
|
font-weight: 500;
|
|
font-size: clamp(2rem, 1.5rem + 2vw, 2.8rem);
|
|
margin-bottom: 1rem;
|
|
}
|
|
.current {
|
|
display: grid;
|
|
gap: 0.8rem;
|
|
margin-bottom: 1.8rem;
|
|
}
|
|
.current h2 {
|
|
color: var(--ink-soft);
|
|
}
|
|
</style>
|