spb/job-ka

1/**2 * =============================================================================3 * Job·Ka — Groupe KA4 * Auteur  : Simon-Pierre Boucher5 * Contact : contact@spboucher.ai6 * Fichier : frontend/src/pages/Contact.tsx7 * Rôle    : Page Contact commune Groupe KA (données ka/ecosystem.json)8 * Créé    : 2026-08-17   Modifié : 2026-08-179 * =============================================================================10 */11import { useEffect } from "react";12import eco from "../ka/ecosystem.json";1314export default function ContactPage() {15  useEffect(() => {16    document.title = "Contact | Job-Ka — Un service Groupe KA";17    window.scrollTo(0, 0);18  }, []);1920  const others = eco.sites.filter((s) => s.id !== "job-ka");2122  return (23    <div className="container contact-page">24      <span className="kicker">Contact</span>25      <h1>26        Écrire au <span className="hl">Groupe KA</span>27      </h1>28      <p className="lede">29        Job-Ka — {eco.sites.find((s) => s.id === "job-ka")?.tagline?.toLowerCase()} —30        est un service du {eco.org.name}. {eco.org.tagline} Toutes les demandes31        passent par les adresses ci-dessous.32      </p>3334      <div className="contact-grid">35        {eco.contacts.map((c) => (36          <div className="card contact-card" key={c.email}>37            <span className="klabel">{c.role}</span>38            <a className="mail" href={`mailto:${c.email}`}>{c.email}</a>39          </div>40        ))}41      </div>4243      <p className="contact-note">44        <b>{eco.org.disclaimer}</b> Les offres affichées sur Job-Ka proviennent45        des pages carrières publiques des employeurs québécois ; chaque fiche46        renvoie vers l'offre originale. Pour postuler ou poser une question sur47        un poste, adressez-vous directement à l'employeur indiqué sur la fiche.48      </p>4950      <div className="contact-hub">51        <span className="klabel">L'écosystème ·Ka</span>52        <ul className="contact-sites">53          {others.map((s) => (54            <li key={s.id}>55              <a href={`https://${s.domain}`} target="_blank" rel="noopener noreferrer">56                {s.wordmark}57              </a>58            </li>59          ))}60        </ul>61        <p style={{ marginTop: 18, display: "flex", flexWrap: "wrap", gap: 10 }}>62          <a className="btn btn-primary" href={eco.hub.url} target="_blank" rel="noopener noreferrer">63            Visiter le portail groupe-ka.com →64          </a>65          <a className="btn" href={`${eco.hub.url}${eco.hub.loginPath}`} target="_blank" rel="noopener noreferrer">66            Créer un compte KA ID67          </a>68        </p>69      </div>70    </div>71  );72}73