GISE/landing-page-GISE
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Contact
Deploy GISE landing page test / build-and-deploy (push) Failing after 11s
Details

Browse Source
This commit is contained in:
LathanDevers
2026-07-28 18:57:59 +02:00
parent 9bdc81ae9a
commit 32e1068ace
3 changed files with 69 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/index.css
+7
View File
@@ -3,6 +3,13 @@
/* Configuration pour forcer le mode sombre via une classe .dark */
@custom-variant dark (&:where(.dark, .dark *));
@layer base {
:root {
--color-gise-blue: #1a73e8;
--color-gise-emerald: #10b981;
}
}
@theme {
--color-gise-accent: #2563eb;
--color-gise-accentHover: #1d4ed8;
src/pages/GiseLandingPage.tsx
+52 -16
View File
@@ -378,7 +378,7 @@ export default function GiseLandingPage() {
</section>
{/* --- SECTEURS D'ACTIVITÉ (Google Material Category Cards) --- */}
<section id="secteurs" className="py-20 bg-white dark:bg-slate-900/40 border-t border-slate-200/80 dark:border-slate-800/80">
<section id="secteurs" className="py-20 bg-white/60 dark:bg-slate-900/85 border-t border-slate-200/80 dark:border-slate-800/80">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="text-center max-w-2xl mx-auto mb-16 space-y-2">
<span className="text-xs font-bold uppercase tracking-wider text-blue-600 dark:text-blue-400">
@@ -472,10 +472,8 @@ export default function GiseLandingPage() {
</div>
{/* GISE */}
<div className="p-8 rounded-[28px] bg-blue-50/60 dark:bg-blue-950/30 border-2 border-blue-600/40 space-y-4 relative">
<span className="absolute -top-3 right-6 bg-blue-600 text-white text-[10px] font-bold uppercase tracking-wider px-3 py-0.5 rounded-full shadow-sm">
Recommandé
</span>
<div className="p-8 rounded-[28px] bg-blue-50 dark:bg-blue-950 border-2 border-blue-600/40 space-y-4 relative">
<h3 className="font-bold text-blue-600 dark:text-blue-400 text-xs uppercase tracking-wider">Offre GISE & AEGIS</h3>
<ul className="space-y-3.5 text-xs text-slate-800 dark:text-slate-200 font-semibold">
<li className="flex items-start gap-2.5">
@@ -495,16 +493,16 @@ export default function GiseLandingPage() {
</div>
</section>
{/* FORMULAIRE DE CONTACT (Google Forms Outlined Material Style) */}
<section id="contact" className="py-24 bg-white dark:bg-slate-900/60 border-t border-slate-200/80 dark:border-slate-800">
{/* FORMULAIRE DE CONTACT (Web3Forms + Google Material Style) */}
<section id="contact" className="py-24 bg-white dark:bg-slate-900 border-t border-slate-200/80 dark:border-slate-800 transition-colors">
<div className="max-w-2xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="text-center mb-12 space-y-2">
<h2 className="text-3xl font-bold text-slate-900 dark:text-white">
Demandez votre diagnostic offert
Demandez votre diagnostic
</h2>
<p className="text-slate-600 dark:text-slate-400 text-sm">
Un premier bilan rapide de votre infrastructure, sans aucun engagement.
Un premier bilan rapide de votre infrastructure, sans engagement.
</p>
</div>
@@ -517,13 +515,43 @@ export default function GiseLandingPage() {
</p>
<button
onClick={() => setFormStatus('idle')}
className="mt-4 text-xs font-semibold text-blue-600 hover:underline"
className="mt-4 text-xs font-semibold text-blue-600 dark:text-blue-400 hover:underline"
>
Envoyer un autre message
</button>
</div>
) : (
<form onSubmit={handleContactSubmit} className="space-y-5 bg-[#f0f4f9] dark:bg-slate-950 p-8 sm:p-10 rounded-[28px]">
<form
onSubmit={async (event) => {
event.preventDefault();
setFormStatus('submitting');
// Logique officielle Web3Forms
const formData = new FormData(event.currentTarget);
formData.append("access_key", "6d360b7b-731f-4cbc-b6d1-9e9f21504bcc"); // <-- Votre clé
formData.append("subject", "Demande de diagnostic (Site GISE)");
try {
const response = await fetch("https://api.web3forms.com/submit", {
method: "POST",
body: formData
});
const data = await response.json();
if (data.success) {
setFormStatus('success');
} else {
setFormStatus('idle');
alert("Erreur lors de l'envoi : " + data.message);
}
} catch (error) {
setFormStatus('idle');
alert("Erreur de connexion. Veuillez réessayer.");
}
}}
className="space-y-5 bg-[#f0f4f9] dark:bg-slate-950 p-8 sm:p-10 rounded-[28px] shadow-sm"
>
<div className="grid sm:grid-cols-2 gap-4">
<div>
@@ -535,6 +563,7 @@ export default function GiseLandingPage() {
required
type="text"
id="name"
name="name" // Indispensable pour Web3Forms
className="w-full bg-white dark:bg-slate-900 border border-slate-300 dark:border-slate-800 rounded-2xl px-4 py-3 pl-10 text-slate-900 dark:text-white focus:outline-none focus:border-blue-600 focus:ring-2 focus:ring-blue-600/20 text-xs transition-all"
placeholder="Jean Dupont"
/>
@@ -551,6 +580,7 @@ export default function GiseLandingPage() {
required
type="text"
id="company"
name="company" // Indispensable
className="w-full bg-white dark:bg-slate-900 border border-slate-300 dark:border-slate-800 rounded-2xl px-4 py-3 pl-10 text-slate-900 dark:text-white focus:outline-none focus:border-blue-600 focus:ring-2 focus:ring-blue-600/20 text-xs transition-all"
placeholder="Cabinet Dupont & Associés"
/>
@@ -569,6 +599,7 @@ export default function GiseLandingPage() {
required
type="email"
id="email"
name="email" // Indispensable
className="w-full bg-white dark:bg-slate-900 border border-slate-300 dark:border-slate-800 rounded-2xl px-4 py-3 pl-10 text-slate-900 dark:text-white focus:outline-none focus:border-blue-600 focus:ring-2 focus:ring-blue-600/20 text-xs transition-all"
placeholder="jean@dupont-avocats.be"
/>
@@ -582,11 +613,12 @@ export default function GiseLandingPage() {
</label>
<select
id="size"
name="taille_parc" // Nom du champ dans le mail
className="w-full bg-white dark:bg-slate-900 border border-slate-300 dark:border-slate-800 rounded-2xl px-4 py-3 text-slate-900 dark:text-white focus:outline-none focus:border-blue-600 focus:ring-2 focus:ring-blue-600/20 text-xs transition-all"
>
<option>5 à 15 postes</option>
<option>15 à 50 postes</option>
<option>Plus de 50 postes</option>
<option value="5 à 15 postes">5 à 15 postes</option>
<option value="15 à 50 postes">15 à 50 postes</option>
<option value="Plus de 50 postes">Plus de 50 postes</option>
</select>
</div>
</div>
@@ -599,6 +631,7 @@ export default function GiseLandingPage() {
<textarea
required
id="message"
name="message" // Indispensable
rows={4}
className="w-full bg-white dark:bg-slate-900 border border-slate-300 dark:border-slate-800 rounded-2xl px-4 py-3 pl-10 text-slate-900 dark:text-white focus:outline-none focus:border-blue-600 focus:ring-2 focus:ring-blue-600/20 text-xs resize-none transition-all"
placeholder="Décrivez brièvement votre informatique actuelle..."
@@ -607,12 +640,15 @@ export default function GiseLandingPage() {
</div>
</div>
{/* Protection Anti-spam native de Web3Forms */}
<input type="checkbox" name="botcheck" className="hidden" style={{ display: 'none' }} />
<button
disabled={formStatus === 'submitting'}
type="submit"
className="w-full bg-blue-600 hover:bg-blue-700 text-white font-semibold py-3.5 rounded-full transition-all flex items-center justify-center gap-2 shadow-sm disabled:opacity-70 text-xs active:scale-95"
>
{formStatus === 'submitting' ? 'Envoi en cours...' : 'Demander mon diagnostic offert'}
{formStatus === 'submitting' ? 'Envoi en cours...' : 'Demander mon diagnostic'}
</button>
</form>
)}
@@ -627,7 +663,7 @@ export default function GiseLandingPage() {
<div className="h-6 w-6 rounded-full bg-blue-600 flex items-center justify-center text-white">
<Shield className="h-3.5 w-3.5" />
</div>
<span className="font-bold text-slate-900 dark:text-white text-sm">GISE SRL</span>
<span className="font-bold text-slate-900 dark:text-white text-sm">GISE</span>
</div>
<div className="flex flex-wrap justify-center gap-x-6 gap-y-2 font-medium">
src/pages/PolitiqueCookies.tsx
+10 -10
View File
@@ -1,11 +1,11 @@
import {
Shield,
ArrowLeft,
Cookie,
Info,
CheckCircle,
Moon,
Sun
import {
Shield,
ArrowLeft,
Cookie,
Info,
CheckCircle,
Moon,
Sun
} from 'lucide-react';
import { Link } from 'react-router-dom';
import { useTheme } from '../hooks/useTheme';
@@ -19,7 +19,7 @@ export default function PolitiqueCookies() {
{/* HEADER DE NAVIGATION (Style Google Pill Bar) */}
<header className="sticky top-0 z-40 p-3 sm:p-4">
<div className="max-w-5xl mx-auto bg-white/90 dark:bg-slate-900/90 backdrop-blur-xl border border-slate-200/80 dark:border-slate-800 rounded-full px-5 py-2.5 shadow-sm flex items-center justify-between transition-all">
<Link
to="/"
className="inline-flex items-center gap-2 text-slate-600 dark:text-slate-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors text-xs font-semibold px-3.5 py-1.5 rounded-full hover:bg-slate-100 dark:hover:bg-slate-800"
@@ -82,7 +82,7 @@ export default function PolitiqueCookies() {
1. Qu'est-ce qu'un cookie ?
</h2>
</div>
<p className="text-xs sm:text-sm text-slate-600 dark:text-slate-400 leading-relaxed">
Un cookie est un petit fichier texte déposé sur votre terminal (ordinateur, tablette, smartphone) lors de la visite d'un site web. Il permet au site de mémoriser vos préférences d'affichage (comme le choix du mode clair/sombre) pour faciliter votre navigation ultérieure.
</p>