Update website colors and add disclaimers about expression

Modify CSS variables for a politically neutral color palette and inject disclaimer text across multiple pages to clarify that the platform captures citizen expression rather than established truth.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 923ae0e3-a363-4db8-b04a-e8baca2a1330
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: a6455e51-215a-43d1-a452-a445436b0317
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8af7d2ec-2cc3-4ece-8af3-9f071488d072/923ae0e3-a363-4db8-b04a-e8baca2a1330/UL3T8eF
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
pironantoine
2026-04-04 11:32:08 +00:00
parent f72a64f23e
commit a3d06f6c53
5 changed files with 79 additions and 44 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 133 KiB

After

Width:  |  Height:  |  Size: 127 KiB

+27 -27
View File
@@ -77,55 +77,55 @@
--elevate-1: rgba(0,0,0, .03);
--elevate-2: rgba(0,0,0, .08);
/* Deep paper/parchment tone */
--background: 40 20% 96%;
--foreground: 220 30% 12%;
/* Warm parchment tone */
--background: 40 15% 96%;
--foreground: 200 20% 14%;
--border: 40 10% 85%;
--input: 40 10% 85%;
--ring: 220 80% 25%;
--ring: 185 42% 28%;
/* White-ish cards with slight warmth */
--card: 40 20% 99%;
--card-foreground: 220 30% 12%;
--card-foreground: 200 20% 14%;
--card-border: 40 15% 90%;
--popover: 40 20% 99%;
--popover-foreground: 220 30% 12%;
--popover-foreground: 200 20% 14%;
--popover-border: 40 15% 90%;
/* Deep French Blue */
--primary: 220 80% 25%;
/* Deep petrol — neutre, sans connotation partisane */
--primary: 185 42% 28%;
--primary-foreground: 0 0% 100%;
/* Warm paper accent */
--secondary: 40 25% 90%;
--secondary-foreground: 220 80% 25%;
--secondary: 40 20% 90%;
--secondary-foreground: 185 42% 28%;
--muted: 40 15% 92%;
--muted-foreground: 220 15% 45%;
--muted: 40 12% 92%;
--muted-foreground: 200 12% 45%;
--accent: 40 25% 90%;
--accent-foreground: 220 80% 25%;
--accent: 40 20% 90%;
--accent-foreground: 185 42% 28%;
/* Warm French Red */
--destructive: 350 70% 40%;
/* Warm amber-red (alertes uniquement) */
--destructive: 12 65% 40%;
--destructive-foreground: 0 0% 100%;
--sidebar: 40 20% 96%;
--sidebar-foreground: 220 30% 12%;
--sidebar: 40 15% 96%;
--sidebar-foreground: 200 20% 14%;
--sidebar-border: 40 10% 85%;
--sidebar-primary: 220 80% 25%;
--sidebar-primary: 185 42% 28%;
--sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 40 25% 90%;
--sidebar-accent-foreground: 220 80% 25%;
--sidebar-ring: 220 80% 25%;
--sidebar-accent: 40 20% 90%;
--sidebar-accent-foreground: 185 42% 28%;
--sidebar-ring: 185 42% 28%;
--chart-1: 220 80% 25%;
--chart-2: 350 70% 40%;
--chart-3: 40 15% 40%;
--chart-4: 200 40% 40%;
--chart-5: 25 70% 45%;
--chart-1: 185 42% 28%;
--chart-2: 30 65% 42%;
--chart-3: 155 30% 38%;
--chart-4: 210 25% 45%;
--chart-5: 50 55% 42%;
--app-font-sans: 'Inter', sans-serif;
--app-font-serif: 'Bahnschrift', 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', ui-sans-serif, sans-serif;
+19 -1
View File
@@ -1,6 +1,6 @@
import React from "react";
import { Link } from "wouter";
import { ArrowLeft, Shield, Brain, BookOpen, Scale, ExternalLink } from "lucide-react";
import { ArrowLeft, Shield, Brain, BookOpen, Scale, ExternalLink, MessageSquare } from "lucide-react";
import { Button } from "@/components/ui/button";
const TEXTES_SOURCES = [
@@ -113,6 +113,24 @@ export default function About() {
</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">
<MessageSquare className="h-6 w-6 text-primary" />
<h2>Expression, pas vérité</h2>
</div>
<p className="leading-relaxed text-foreground/90 text-base">
Cette plateforme est conçue pour ouvrir un espace d'expression pas pour produire des consensus scientifiques ou établir des faits. Ce que vous lisez dans la synthèse reflète ce que des citoyens ont choisi d'exprimer : leurs préoccupations, leurs attentes, leurs désaccords.
</p>
<div className="bg-muted/30 p-6 border-l-4 border-primary/40 space-y-3">
<p className="text-sm leading-relaxed text-foreground/80">
Les propositions ne sont ni expertisées, ni validées politiquement, ni représentatives d'une majorité. Leur intérêt réside dans leur existence même : des personnes ont pris le temps de s'exprimer sur ce qui leur tient à cœur.
</p>
<p className="text-sm leading-relaxed text-foreground/80">
La démarche est portée par un auteur personnellement attaché à l'expertise, à la rigueur et au fait vérifié. Cette plateforme n'est pas un substitut à la délibération éclairée — c'est un outil d'écoute et de traduction de la parole citoyenne brute.
</p>
</div>
</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" />
+10 -2
View File
@@ -184,8 +184,9 @@ export default function Home() {
{/* Bandeau d'introduction */}
<div className="border-b border-border/40 bg-muted/30 px-6 md:px-10 py-5">
<p className="text-sm text-foreground/75 max-w-3xl leading-relaxed">
<span className="font-semibold text-foreground">La Voix du Peuple</span> recueille vos propositions et les synthétise en un résumé clair, destiné à être transmis à vos élus.
Exprimez-vous librement chaque contribution est modérée selon le droit international des droits humains, puis intégrée au résumé collectif affiché à droite.
<span className="font-semibold text-foreground">La Voix du Peuple</span> est un espace d'expression citoyenne, pas un sondage ni une vérité établie.
Exprimez-vous librement — chaque contribution est modérée selon le droit international des droits humains, puis reflétée dans la synthèse collective affichée à droite.
<span className="text-foreground/55 ml-1">Ce que vous lisez représente ce que des personnes ont choisi d'exprimer, pas un consensus validé.</span>
</p>
</div>
@@ -440,6 +441,7 @@ export default function Home() {
{/* Pied de page fixe */}
{synthesis?.updatedAt && (
<>
<div
className="flex justify-between items-center px-6 md:px-10 py-3 border-t border-border/30 text-xs font-mono text-muted-foreground relative z-10 flex-shrink-0"
data-testid="text-synthesis-meta"
@@ -453,6 +455,12 @@ export default function Home() {
{format(new Date(synthesis.updatedAt), "d MMM à HH:mm", { locale: fr })}
</span>
</div>
<div className="px-6 md:px-10 py-2 border-t border-border/20 relative z-10 flex-shrink-0">
<p className="text-[10px] text-muted-foreground/60 italic leading-relaxed">
Ce document reflète des expressions citoyennes, pas des faits vérifiés ni un consensus officiel. La démarche est portée par un auteur attaché à l'expertise et au dialogue fondé sur les preuves.
</p>
</div>
</>
)}
</div>
</div>
@@ -232,6 +232,15 @@ export default function Transparence() {
<AlertTriangle className="h-5 w-5 text-primary" />
<h2>Limites du système</h2>
</div>
<div className="bg-muted/30 border-l-4 border-primary/40 p-5 space-y-2">
<p className="font-semibold text-sm">Ce que cette plateforme n'est pas</p>
<p className="text-sm leading-relaxed text-foreground/80">
La synthèse n'est pas un document factuel. Elle reflète fidèlement ce qui a é exprimé ni plus ni moins. Les propositions ne sont pas vérifiées, expertisées ni validées politiquement. Cette plateforme capture des expressions citoyennes, pas des vérités établies.
</p>
<p className="text-sm leading-relaxed text-foreground/80">
L'auteur de la démarche reste personnellement attaché à l'expertise et au dialogue fondé sur les preuves. Ce projet n'a pas vocation à substituer la parole collective au jugement éclairé, mais à rendre cette parole lisible et transmissible.
</p>
</div>
<div className="space-y-4">
{[
{
@@ -247,8 +256,8 @@ export default function Transparence() {
desc: "Il n'existe pas encore de mécanisme de contestation d'un refus. Si cette plateforme est déployée dans un cadre institutionnel, il est recommandé d'ajouter un contact humain de recours.",
},
{
titre: "Dépendance à OpenAI",
desc: "Le filtrage et la synthèse dépendent de l'API OpenAI. En cas d'indisponibilité, les soumissions sont refusées par précaution et le service affiche un message d'erreur.",
titre: "Dépendance à l'API IA",
desc: "Le filtrage et la synthèse dépendent de l'API Mistral (ou OpenAI en alternative). En cas d'indisponibilité, les soumissions sont refusées par précaution et le service affiche un message d'erreur.",
},
].map((item) => (
<div key={item.titre} className="border-l-4 border-amber-400/60 pl-4 space-y-1">