groupe-meditation/frontend/src/pages/PrincipesUtilisation.jsx

44 lines
2.3 KiB
JavaScript

import React from 'react';
import PageHeader from '../components/PageHeader';
const PRINCIPES = [
['Outil de service', "L'application soutient les serviteurs; elle ne remplace jamais la conscience de groupe."],
['Reprise sur papier', "Les rencontres, assemblées et rapports doivent pouvoir continuer même si l'informatique tombe."],
['Sobriété des données', "On conserve seulement les renseignements utiles au fonctionnement du groupe."],
['Transparence', "Le journal sert à comprendre les changements et protéger l'historique, pas à surveiller les membres."],
['Pouvoirs visibles', "Les accès viennent des postes occupés. Les actions sensibles doivent rester explicables au groupe."],
['Participation libre', "L'application ne doit jamais devenir nécessaire pour assister à une réunion ou participer au groupe."],
];
export default function PrincipesUtilisation() {
return (
<div className="min-h-screen bg-gray-100">
<PageHeader titre="Principes d'utilisation" sousTitre="L'application comme outil de service" />
<div className="p-4 space-y-4">
<div className="bg-white rounded-2xl p-4 shadow-sm">
<p className="text-sm text-gray-700 leading-relaxed">
Cette application aide le groupe à alléger les tâches, préserver l'historique et soutenir la transparence.
Elle ne gouverne pas le groupe. Les décisions demeurent prises par les membres, selon les pratiques du groupe.
</p>
</div>
<div className="space-y-2">
{PRINCIPES.map(([titre, texte]) => (
<div key={titre} className="bg-white rounded-2xl p-4 shadow-sm">
<p className="font-bold text-gray-800">{titre}</p>
<p className="text-sm text-gray-600 mt-1 leading-relaxed">{texte}</p>
</div>
))}
</div>
<div className="bg-blue-50 border border-blue-100 rounded-2xl p-4">
<p className="font-bold text-aa-blue">Boussole simple</p>
<p className="text-sm text-blue-900 mt-1 leading-relaxed">
Une fonctionnalité est saine si elle augmente la capacité du groupe à se servir lui-même.
Elle devient fragile si elle augmente surtout le contrôle sur les membres.
</p>
</div>
</div>
</div>
);
}