SONUM v7 - Évolution v6 (éditeurs/blocs CRUD, tableau de bord stats) + vue liste alternance couleurs

client/src/pages/Login.tsx

@@ -0,0 +1,88 @@
+import { getLoginUrl } from "@/const";
+import { useLocation } from "wouter";
+import { Building2, KeyRound, ExternalLink } from "lucide-react";
+
+export default function Login() {
+  const [, navigate] = useLocation();
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-background px-4">
+      <div className="w-full max-w-md">
+        {/* En-tête */}
+        <div className="text-center mb-10">
+          <div className="inline-flex items-center gap-3 mb-5">
+            <div className="w-14 h-14 rounded-2xl bg-primary flex items-center justify-center shadow-lg">
+              <Building2 size={26} className="text-white" />
+            </div>
+            <div className="text-left">
+              <div className="text-xs font-semibold text-muted-foreground uppercase tracking-widest">FEHAP</div>
+              <div
+                className="text-3xl font-bold text-primary leading-tight"
+                style={{ fontFamily: "'Playfair Display', serif" }}
+              >
+                SONUM
+              </div>
+            </div>
+          </div>
+          <h1 className="text-2xl font-semibold text-foreground">Bienvenue</h1>
+          <p className="text-sm text-muted-foreground mt-2 max-w-xs mx-auto">
+            Cartographie des Solutions Numériques des établissements FEHAP
+          </p>
+        </div>
+
+        {/* Options de connexion */}
+        <div className="space-y-4">
+          {/* Connexion via espace adhérent FEHAP */}
+          <a
+            href={getLoginUrl()}
+            className="group flex items-center gap-4 p-5 bg-primary text-white rounded-2xl shadow-md hover:bg-primary/90 transition-all hover:shadow-lg hover:-translate-y-0.5"
+          >
+            <div className="w-10 h-10 rounded-xl bg-white/20 flex items-center justify-center flex-shrink-0">
+              <ExternalLink size={20} className="text-white" />
+            </div>
+            <div className="flex-1 text-left">
+              <div className="font-semibold text-base">Espace adhérent FEHAP</div>
+              <div className="text-sm text-white/75 mt-0.5">
+                Connexion via votre compte FEHAP existant
+              </div>
+            </div>
+            <div className="text-white/50 group-hover:text-white/80 transition-colors">
+              →
+            </div>
+          </a>
+
+          {/* Séparateur */}
+          <div className="flex items-center gap-3 py-1">
+            <div className="flex-1 h-px bg-border" />
+            <span className="text-xs text-muted-foreground font-medium">ou</span>
+            <div className="flex-1 h-px bg-border" />
+          </div>
+
+          {/* Connexion locale */}
+          <button
+            onClick={() => navigate("/login/local")}
+            className="group w-full flex items-center gap-4 p-5 bg-card border border-border rounded-2xl shadow-sm hover:border-primary/40 hover:shadow-md transition-all hover:-translate-y-0.5 text-left"
+          >
+            <div className="w-10 h-10 rounded-xl bg-muted flex items-center justify-center flex-shrink-0">
+              <KeyRound size={20} className="text-muted-foreground" />
+            </div>
+            <div className="flex-1">
+              <div className="font-semibold text-base text-foreground">Connexion locale</div>
+              <div className="text-sm text-muted-foreground mt-0.5">
+                Email et mot de passe fournis par un gestionnaire SONUM
+              </div>
+            </div>
+            <div className="text-muted-foreground group-hover:text-primary transition-colors">
+              →
+            </div>
+          </button>
+        </div>
+
+        {/* Pied de page */}
+        <p className="text-center text-xs text-muted-foreground mt-8">
+          En vous connectant, vous acceptez les conditions générales d'utilisation de la plateforme SONUM.
+        </p>
+      </div>
+    </div>
+  );
+}