7
0
forked from yvv/decision

Home : renommage libreDecision + chiffres dynamiques + centrage + typo

- Titre : ğ(Decision) → libreDecision (libre italic/muted + Decision accent)
- Chiffres : plus de valeurs hardcodées, tout dynamique depuis les stores
  (mandates store ajouté, protocoles depuis protocols.protocols.length)
- Affichage intelligent : total quand actif = 0, labels contextuels
- Grilles centrées : margin: 0 auto sur .dash
- Font-weight 800 → 700 partout (moins gras, plus classe)
- Typo : "Nuance" → "Nuancé" dans les tags

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Yvv
2026-03-24 02:06:02 +01:00
parent 0310dcba42
commit 99c5e9dd5a

View File

@@ -2,6 +2,7 @@
const documents = useDocumentsStore() const documents = useDocumentsStore()
const decisions = useDecisionsStore() const decisions = useDecisionsStore()
const protocols = useProtocolsStore() const protocols = useProtocolsStore()
const mandates = useMandatesStore()
const auth = useAuthStore() const auth = useAuthStore()
const loading = ref(true) const loading = ref(true)
@@ -13,6 +14,7 @@ onMounted(async () => {
documents.fetchAll(), documents.fetchAll(),
decisions.fetchAll(), decisions.fetchAll(),
protocols.fetchProtocols(), protocols.fetchProtocols(),
mandates.fetchAll(),
]) ])
} }
finally { finally {
@@ -20,52 +22,61 @@ onMounted(async () => {
} }
}) })
const entryCards = computed(() => [ const entryCards = computed(() => {
{ const decisionsTotal = decisions.list.length
key: 'decisions', const decisionsActive = decisions.activeDecisions.length
title: 'Décisions structurantes',
icon: 'i-lucide-scale', const docsActive = documents.activeDocuments.length
to: '/decisions', const docsTotal = documents.list.length
count: decisions.activeDecisions.length,
countLabel: `${decisions.activeDecisions.length} en cours`, const mandatesActive = mandates.list.filter(m => ['active', 'voting'].includes(m.status)).length
totalLabel: `${decisions.list.length} au total`, const mandatesTotal = mandates.list.length
description: 'Processus de décision collectifs',
color: 'var(--mood-secondary, var(--mood-accent))', const protocolsCount = protocols.protocols.length
},
{ return [
key: 'documents', {
title: 'Documents de référence', key: 'decisions',
icon: 'i-lucide-book-open', title: 'Décisions',
to: '/documents', icon: 'i-lucide-scale',
count: documents.activeDocuments.length, to: '/decisions',
countLabel: `${documents.activeDocuments.length} actif${documents.activeDocuments.length > 1 ? 's' : ''}`, count: decisionsTotal,
totalLabel: `${documents.list.length} au total`, countLabel: decisionsActive > 0 ? `${decisionsActive} en cours` : `${decisionsTotal} au total`,
description: 'Textes fondateurs sous vote permanent', totalLabel: decisionsActive > 0 ? `${decisionsTotal} au total` : 'aucune en cours',
color: 'var(--mood-accent)', color: 'var(--mood-secondary, var(--mood-accent))',
}, },
{ {
key: 'mandats', key: 'documents',
title: 'Mandats et nominations', title: 'Documents',
icon: 'i-lucide-user-check', icon: 'i-lucide-book-open',
to: '/mandates', to: '/documents',
count: null, count: docsActive || docsTotal,
countLabel: null, countLabel: docsActive > 0 ? `${docsActive} actif${docsActive > 1 ? 's' : ''}` : `${docsTotal} au total`,
totalLabel: null, totalLabel: docsTotal > 0 ? `${docsTotal} document${docsTotal > 1 ? 's' : ''}` : 'textes fondateurs',
description: 'Missions déléguées avec nomination en binôme', color: 'var(--mood-accent)',
color: 'var(--mood-success)', },
}, {
{ key: 'mandats',
key: 'protocoles', title: 'Mandats',
title: 'Protocoles et fonctionnement', icon: 'i-lucide-user-check',
icon: 'i-lucide-settings', to: '/mandates',
to: '/protocols', count: mandatesTotal || null,
count: 2, countLabel: mandatesTotal > 0 ? `${mandatesActive} en cours` : null,
countLabel: '2 protocoles', totalLabel: mandatesTotal > 0 ? `${mandatesTotal} mandats` : 'missions déléguées',
totalLabel: `${protocols.protocols.length} modalités de vote`, color: 'var(--mood-success)',
description: 'Modalités de vote, formules, workflows', },
color: 'var(--mood-tertiary, var(--mood-accent))', {
}, key: 'protocoles',
]) title: 'Protocoles',
icon: 'i-lucide-settings',
to: '/protocols',
count: protocolsCount || null,
countLabel: protocolsCount > 0 ? `${protocolsCount} protocoles` : null,
totalLabel: 'modalités de vote',
color: 'var(--mood-tertiary, var(--mood-accent))',
},
]
})
const recentDecisions = computed(() => { const recentDecisions = computed(() => {
return [...decisions.list] return [...decisions.list]
@@ -98,7 +109,7 @@ function formatDate(dateStr: string): string {
<!-- Welcome --> <!-- Welcome -->
<div class="dash__welcome"> <div class="dash__welcome">
<h1 class="dash__title"> <h1 class="dash__title">
<span class="dash__title-g">ğ</span><span class="dash__title-paren">(</span>Decision<span class="dash__title-paren">)</span> <span class="dash__title-libre">libre</span><span class="dash__title-decision">Decision</span>
</h1> </h1>
<p class="dash__subtitle"> <p class="dash__subtitle">
Décisions collectives pour la communauté Duniter / G1 Décisions collectives pour la communauté Duniter / G1
@@ -127,7 +138,7 @@ function formatDate(dateStr: string): string {
<span class="entry-card__total">{{ card.totalLabel }}</span> <span class="entry-card__total">{{ card.totalLabel }}</span>
</template> </template>
<template v-else> <template v-else>
<span class="entry-card__desc">{{ card.description }}</span> <span class="entry-card__desc">{{ card.totalLabel }}</span>
</template> </template>
<span class="entry-card__arrow"> <span class="entry-card__arrow">
<UIcon name="i-lucide-arrow-right" /> <UIcon name="i-lucide-arrow-right" />
@@ -151,7 +162,7 @@ function formatDate(dateStr: string): string {
</NuxtLink> </NuxtLink>
</div> </div>
<!-- Toolbox teaser (5th block, distinct look) --> <!-- Toolbox teaser -->
<NuxtLink to="/tools" class="dash__toolbox-card"> <NuxtLink to="/tools" class="dash__toolbox-card">
<div class="dash__toolbox-card-inner"> <div class="dash__toolbox-card-inner">
<div class="dash__toolbox-card-icon"> <div class="dash__toolbox-card-icon">
@@ -166,7 +177,7 @@ function formatDate(dateStr: string): string {
<span class="dash__toolbox-card-tag">Vote WoT</span> <span class="dash__toolbox-card-tag">Vote WoT</span>
<span class="dash__toolbox-card-tag">Inertie</span> <span class="dash__toolbox-card-tag">Inertie</span>
<span class="dash__toolbox-card-tag">Smith</span> <span class="dash__toolbox-card-tag">Smith</span>
<span class="dash__toolbox-card-tag">Nuance</span> <span class="dash__toolbox-card-tag">Nuancé</span>
</div> </div>
</div> </div>
<UIcon name="i-lucide-arrow-right" class="dash__toolbox-card-arrow" /> <UIcon name="i-lucide-arrow-right" class="dash__toolbox-card-arrow" />
@@ -236,17 +247,19 @@ function formatDate(dateStr: string): string {
flex-direction: column; flex-direction: column;
gap: 2rem; gap: 2rem;
max-width: 56rem; max-width: 56rem;
margin: 0 auto;
} }
/* --- Welcome --- */ /* --- Welcome --- */
.dash__welcome { .dash__welcome {
padding: 0.5rem 0; padding: 0.5rem 0;
} }
.dash__title { .dash__title {
font-size: 1.75rem; font-size: 1.75rem;
font-weight: 800; font-weight: 700;
color: var(--mood-accent); letter-spacing: -0.02em;
letter-spacing: -0.03em; line-height: 1.1;
} }
@media (min-width: 640px) { @media (min-width: 640px) {
@@ -254,14 +267,18 @@ function formatDate(dateStr: string): string {
font-size: 2.25rem; font-size: 2.25rem;
} }
} }
.dash__title-g {
.dash__title-libre {
font-style: italic; font-style: italic;
} font-weight: 400;
.dash__title-paren {
font-weight: 300;
color: var(--mood-text-muted); color: var(--mood-text-muted);
opacity: 0.4;
} }
.dash__title-decision {
font-weight: 700;
color: var(--mood-accent);
}
.dash__subtitle { .dash__subtitle {
margin-top: 0.375rem; margin-top: 0.375rem;
font-size: 0.9375rem; font-size: 0.9375rem;
@@ -284,7 +301,6 @@ function formatDate(dateStr: string): string {
@media (min-width: 640px) { @media (min-width: 640px) {
.dash__entries { .dash__entries {
grid-template-columns: 1fr 1fr;
gap: 1rem; gap: 1rem;
} }
} }
@@ -331,17 +347,29 @@ function formatDate(dateStr: string): string {
} }
.entry-card__title { .entry-card__title {
font-size: 1.25rem; font-size: 1rem;
font-weight: 800; font-weight: 700;
color: var(--mood-text); color: var(--mood-text);
margin: 0; margin: 0;
} }
@media (min-width: 640px) {
.entry-card__title {
font-size: 1.125rem;
}
}
.entry-card__count { .entry-card__count {
font-size: 1.5rem; font-size: 0.9375rem;
font-weight: 800; font-weight: 700;
color: var(--card-color, var(--mood-accent)); color: var(--card-color, var(--mood-accent));
line-height: 1; line-height: 1.2;
}
@media (min-width: 640px) {
.entry-card__count {
font-size: 1.125rem;
}
} }
.entry-card__total { .entry-card__total {
@@ -350,7 +378,7 @@ function formatDate(dateStr: string): string {
} }
.entry-card__desc { .entry-card__desc {
font-size: 0.875rem; font-size: 0.8125rem;
color: var(--mood-text-muted); color: var(--mood-text-muted);
line-height: 1.4; line-height: 1.4;
} }
@@ -452,7 +480,7 @@ function formatDate(dateStr: string): string {
transform: translateY(0); transform: translateY(0);
} }
/* --- Toolbox card (5th block, distinct) --- */ /* --- Toolbox card --- */
.dash__toolbox-card { .dash__toolbox-card {
display: block; display: block;
text-decoration: none; text-decoration: none;
@@ -495,8 +523,8 @@ function formatDate(dateStr: string): string {
} }
.dash__toolbox-card-title { .dash__toolbox-card-title {
font-size: 1.125rem; font-size: 1.0625rem;
font-weight: 800; font-weight: 700;
color: var(--mood-text); color: var(--mood-text);
margin: 0; margin: 0;
} }
@@ -557,8 +585,8 @@ function formatDate(dateStr: string): string {
align-items: center; align-items: center;
gap: 0.5rem; gap: 0.5rem;
color: var(--mood-text); color: var(--mood-text);
font-weight: 800; font-weight: 700;
font-size: 1.0625rem; font-size: 1rem;
margin-bottom: 0.75rem; margin-bottom: 0.75rem;
} }
.dash__activity-head h3 { margin: 0; } .dash__activity-head h3 { margin: 0; }