Update website to display all content in French and add a values disclaimer

Translate UI elements to French, replace rejected voice notifications with a disclaimer, and add sourced legal values.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 923ae0e3-a363-4db8-b04a-e8baca2a1330
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: fcd1a349-b688-425c-9bb4-acdbfc2e808e
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8af7d2ec-2cc3-4ece-8af3-9f071488d072/923ae0e3-a363-4db8-b04a-e8baca2a1330/zrclMhx
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
pironantoine
2026-04-04 06:08:33 +00:00
parent 432509b2d3
commit 6730700f5a
4 changed files with 335 additions and 108 deletions
+152 -19
View File
@@ -1,22 +1,104 @@
import React from "react";
import { Link } from "wouter";
import { ArrowLeft, Shield, Brain, BookOpen } from "lucide-react";
import { ArrowLeft, Shield, Brain, BookOpen, Scale, ExternalLink } from "lucide-react";
import { Button } from "@/components/ui/button";
const TEXTES_SOURCES = [
{
sigle: "DUDH",
titre: "Déclaration universelle des droits de l'homme",
org: "Organisation des Nations Unies",
annee: "1948",
url: "https://www.un.org/fr/about-us/universal-declaration-of-human-rights",
articles: [
{ num: "Art. 1", texte: "Tous les êtres humains naissent libres et égaux en dignité et en droits. Ils sont doués de raison et de conscience et doivent agir les uns envers les autres dans un esprit de fraternité." },
{ num: "Art. 2", texte: "Chacun peut se prévaloir de tous les droits et de toutes les libertés proclamés dans la présente Déclaration, sans distinction aucune, notamment de race, de couleur, de sexe, de langue, de religion, d'opinion politique ou de toute autre opinion, d'origine nationale ou sociale, de fortune, de naissance ou de toute autre situation." },
{ num: "Art. 19", texte: "Tout individu a droit à la liberté d'opinion et d'expression, ce qui implique le droit de ne pas être inquiété pour ses opinions et celui de chercher, de recevoir et de répandre, sans considérations de frontières, les informations et les idées par quelque moyen d'expression que ce soit." },
{ num: "Art. 20", texte: "Toute propagande en faveur de la guerre est interdite par la loi. Tout appel à la haine nationale, raciale ou religieuse qui constitue une incitation à la discrimination, à l'hostilité ou à la violence est interdit par la loi." },
],
},
{
sigle: "PIDCP",
titre: "Pacte international relatif aux droits civils et politiques",
org: "Organisation des Nations Unies",
annee: "1966",
url: "https://www.ohchr.org/fr/instruments-mechanisms/instruments/international-covenant-civil-and-political-rights",
articles: [
{ num: "Art. 20", texte: "Tout appel à la haine nationale, raciale ou religieuse qui constitue une incitation à la discrimination, à l'hostilité ou à la violence est interdit par la loi." },
{ num: "Art. 25", texte: "Tout citoyen a le droit et la possibilité, sans restrictions déraisonnables, de prendre part à la direction des affaires publiques, soit directement, soit par l'intermédiaire de représentants librement choisis." },
{ num: "Art. 26", texte: "Toutes les personnes sont égales devant la loi et ont droit sans discrimination à une égale protection de la loi." },
],
},
{
sigle: "CEDH",
titre: "Convention européenne des droits de l'homme",
org: "Conseil de l'Europe",
annee: "1950",
url: "https://www.echr.coe.int/european-convention-on-human-rights",
articles: [
{ num: "Art. 10", texte: "Toute personne a droit à la liberté d'expression. Ce droit comprend la liberté d'opinion et la liberté de recevoir ou de communiquer des informations ou des idées sans qu'il puisse y avoir ingérence d'autorités publiques et sans considération de frontière." },
{ num: "Art. 17", texte: "Aucune des dispositions de la présente Convention ne peut être interprétée comme impliquant pour un État, un groupement ou un individu, un droit quelconque de se livrer à une activité ou d'accomplir un acte visant à la destruction des droits ou libertés reconnus dans la présente Convention." },
],
},
{
sigle: "Charte UE",
titre: "Charte des droits fondamentaux de l'Union européenne",
org: "Union européenne",
annee: "2000 / entrée en vigueur 2009",
url: "https://www.europarl.europa.eu/charter/pdf/text_fr.pdf",
articles: [
{ num: "Art. 1", texte: "La dignité humaine est inviolable. Elle doit être respectée et protégée." },
{ num: "Art. 21", texte: "Est interdite toute discrimination fondée notamment sur le sexe, la race, la couleur, les origines ethniques ou sociales, les caractéristiques génétiques, la langue, la religion ou les convictions, les opinions politiques ou toute autre opinion." },
],
},
{
sigle: "Convention génocide",
titre: "Convention pour la prévention et la répression du crime de génocide",
org: "Organisation des Nations Unies",
annee: "1948",
url: "https://www.un.org/fr/genocideprevention/genocide-convention.shtml",
articles: [
{ num: "Art. III (c)", texte: "L'incitation directe et publique à commettre le génocide est punie." },
],
},
{
sigle: "Statut de Rome",
titre: "Statut de Rome de la Cour pénale internationale",
org: "Cour pénale internationale",
annee: "1998",
url: "https://www.icc-cpi.int/sites/default/files/RS-Fra.pdf",
articles: [
{ num: "Art. 7", texte: "On entend par « crime contre l'humanité » l'un quelconque des actes ci-après lorsqu'il est commis dans le cadre d'une attaque généralisée ou systématique lancée contre toute population civile et en connaissance de cette attaque : persécution de tout groupe ou de toute collectivité identifiable pour des motifs d'ordre politique, racial, national, ethnique, culturel ou religieux." },
],
},
{
sigle: "CERD",
titre: "Convention internationale sur l'élimination de toutes les formes de discrimination raciale",
org: "Organisation des Nations Unies",
annee: "1965",
url: "https://www.ohchr.org/fr/instruments-mechanisms/instruments/international-convention-elimination-all-forms-racial",
articles: [
{ num: "Art. 4", texte: "Les États parties condamnent toute propagande et toutes organisations qui s'inspirent d'idées ou de théories fondées sur la supériorité d'une race ou d'un groupe de personnes d'une certaine couleur ou d'une certaine origine ethnique, ou qui prétendent justifier ou encourager toute forme de haine et de discrimination raciales." },
],
},
];
export default function About() {
return (
<div className="min-h-[calc(100vh-4rem)] bg-background flex justify-center py-12 px-4 md:px-8">
<div className="max-w-3xl w-full">
<Link href="/">
<Button variant="ghost" size="sm" className="mb-8 font-mono tracking-widest uppercase text-xs">
<ArrowLeft className="mr-2 h-4 w-4" /> Return to the Agora
<ArrowLeft className="mr-2 h-4 w-4" /> Retour à l'agora
</Button>
</Link>
<header className="mb-12 space-y-4">
<h1 className="text-4xl md:text-5xl font-serif font-bold text-primary">About La Voix du Peuple</h1>
<h1 className="text-4xl md:text-5xl font-serif font-bold text-primary">
À propos de La Voix du Peuple
</h1>
<p className="text-xl font-serif text-muted-foreground leading-relaxed">
A digital town square where individual voices forge a collective democratic manifesto, protected by artificial intelligence.
Une place publique numérique où les voix individuelles forment un manifeste démocratique collectif, guidé par le droit international des droits humains.
</p>
</header>
@@ -24,44 +106,95 @@ export default function About() {
<section className="space-y-4">
<div className="flex items-center gap-3 text-xl font-bold font-serif border-b border-border/50 pb-2">
<BookOpen className="h-6 w-6 text-primary" />
<h2>The Concept</h2>
<h2>Le concept</h2>
</div>
<p className="leading-relaxed text-foreground/90 font-serif text-lg">
Democracy requires both free expression and a shared foundation of values. "La Voix du Peuple" (The Voice of the People) provides a platform where citizens can submit their ideas for the betterment of society. These distinct, fragile voices are woven together in real-time to create a living, breathing synthesisa modern digital pamphlet reflecting our collective aspirations.
La démocratie exige à la fois la liberté d'expression et un socle commun de valeurs. Cette plateforme offre aux citoyens un espace pour soumettre leurs idées en faveur d'une société meilleure. Ces voix distinctes sont tissées en temps réel pour former une synthèse vivante — un pamphlet numérique moderne qui reflète nos aspirations collectives.
</p>
</section>
<section className="space-y-4">
<div className="flex items-center gap-3 text-xl font-bold font-serif border-b border-border/50 pb-2">
<Shield className="h-6 w-6 text-primary" />
<h2>The Democratic Filter</h2>
<h2>Le filtre démocratique</h2>
</div>
<p className="leading-relaxed text-foreground/90 font-serif text-lg mb-4">
Not all speech serves the public good. To protect the integrity of the agora, an AI agent acts as a civic guardian. Every submitted idea is evaluated against core democratic principles before it can enter the collective synthesis.
<p className="leading-relaxed text-foreground/90 font-serif text-lg">
Toute prise de parole ne contribue pas nécessairement au bien commun. Pour préserver l'intégrité de l'agora, un agent d'intelligence artificielle agit comme gardien civique. Chaque idée soumise est évaluée à la lumière des droits fondamentaux reconnus par le droit international avant de pouvoir rejoindre la synthèse collective.
</p>
<div className="bg-muted/30 p-6 rounded-none border-l-4 border-primary">
<h3 className="font-bold font-mono uppercase tracking-widest text-sm mb-3">Protected Values</h3>
<h3 className="font-bold font-mono uppercase tracking-widest text-sm mb-3">
Valeurs protégées
</h3>
<ul className="space-y-2 font-serif list-disc pl-5">
<li>Respect for human rights and dignity</li>
<li>Equality and anti-discrimination</li>
<li>Constructive civic discourse (no hate speech or violence)</li>
<li>Commitment to democratic processes</li>
<li>La dignité humaine universelle et inviolable</li>
<li>L'égalité et la non-discrimination</li>
<li>La liberté d'expression dans le respect des droits d'autrui</li>
<li>Le refus de la haine, de la violence et des appels à la persécution</li>
<li>L'attachement aux processus démocratiques et pacifiques</li>
</ul>
</div>
<p className="leading-relaxed text-foreground/90 font-serif text-lg mt-4">
If an idea violates these principles, it is rejected with a clear explanation. This transparency ensures the filter remains accountable to the people it serves.
<p className="leading-relaxed text-foreground/90 font-serif text-lg">
Lorsqu'une contribution ne peut être retenue, l'auteur en est informé discrètement, sans jugement de sa personne seulement de la conformité du contenu aux valeurs fondamentales de cet espace commun.
</p>
</section>
<section className="space-y-4">
<div className="flex items-center gap-3 text-xl font-bold font-serif border-b border-border/50 pb-2">
<Brain className="h-6 w-6 text-primary" />
<h2>The Synthesis</h2>
<h2>La synthèse</h2>
</div>
<p className="leading-relaxed text-foreground/90 font-serif text-lg">
Once accepted, an idea doesn't just sit in a list. A second AI agent constantly reads the stream of accepted ideas and weaves them into a single, cohesive narrative. This textupdated every 15 secondsrepresents the prevailing mood, concerns, and hopes of the populace. It is the voice of the people, distilled.
Une idée acceptée ne reste pas isolée. Un second agent lit en continu le flux des idées validées et les tisse en un texte cohérent, éloquent, rédigé à la première personne du pluriel «&nbsp;Nous, le peuple&nbsp;». Ce texte, actualisé toutes les 15 secondes, représente l'humeur collective, les préoccupations et les espoirs des citoyens qui ont pris la parole.
</p>
</section>
<section className="space-y-6">
<div className="flex items-center gap-3 text-xl font-bold font-serif border-b border-border/50 pb-2">
<Scale className="h-6 w-6 text-primary" />
<h2>Fondements juridiques</h2>
</div>
<p className="leading-relaxed text-foreground/90 font-serif text-lg">
Le filtre s'appuie sur les textes fondateurs du droit international des droits humains. Voici les instruments qui guident chaque décision d'intégration ou de non-intégration d'une contribution.
</p>
<div className="space-y-8">
{TEXTES_SOURCES.map((source) => (
<div key={source.sigle} className="border border-border/40 p-6 space-y-4">
<div className="flex items-start justify-between gap-4">
<div>
<span className="font-mono text-xs font-bold text-primary bg-primary/10 px-2 py-0.5 rounded-sm">
{source.sigle}
</span>
<h3 className="font-serif font-bold text-lg mt-2">{source.titre}</h3>
<p className="text-xs font-mono text-muted-foreground mt-0.5">
{source.org} · {source.annee}
</p>
</div>
<a
href={source.url}
target="_blank"
rel="noopener noreferrer"
className="flex-shrink-0 text-muted-foreground hover:text-primary transition-colors"
title="Consulter le texte officiel"
>
<ExternalLink className="h-4 w-4" />
</a>
</div>
<div className="space-y-3">
{source.articles.map((art) => (
<div key={art.num} className="border-l-2 border-primary/30 pl-4">
<p className="text-xs font-mono font-bold text-primary/80 mb-1">{art.num}</p>
<p className="font-serif text-sm text-foreground/80 leading-relaxed italic">
«&nbsp;{art.texte}&nbsp;»
</p>
</div>
))}
</div>
</div>
))}
</div>
</section>
</div>
</div>
</div>