Compare commits
9
Commits
5a6047f69e
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
 deploy
|
c919c50fee | ||
|
deploy
|
785b3c5b43 | ||
 jmartin
|
1cc51e0745 | ||
|
jmartin
|
083908fc98 | ||
|
jmartin
|
187337a21c | ||
|
jmartin
|
f6177ca4b8 | ||
|
jmartin
|
3b40f4fca9 | ||
|
jmartin
|
e6ad57f72e | ||
|
jmartin
|
b45a6268f4 |
@@ -0,0 +1,34 @@
|
|||||||
|
# Production : lancement manuel uniquement.
|
||||||
|
# Aucun push (master, site/v3, …) ne doit déployer ptits-pas.fr.
|
||||||
|
name: Déploiement Hugo production
|
||||||
|
|
||||||
|
on:
|
||||||
|
workflow_dispatch:
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
deploy-production:
|
||||||
|
runs-on: self-hosted
|
||||||
|
steps:
|
||||||
|
- name: Déployer sur ptits-pas.fr (ordre explicite)
|
||||||
|
shell: bash
|
||||||
|
run: |
|
||||||
|
set -e
|
||||||
|
COMPOSE_DIR=/home/deploy/infra_v2/apps/site-vitrine
|
||||||
|
SITE_DIR=/home/deploy/infra_v2/site-vitrine
|
||||||
|
|
||||||
|
git config --global --add safe.directory "$SITE_DIR"
|
||||||
|
cd "$SITE_DIR"
|
||||||
|
# Ne pas écraser static/robots.txt (Allow prod, hors sync Git)
|
||||||
|
git fetch origin
|
||||||
|
git checkout master
|
||||||
|
git pull --ff-only origin master
|
||||||
|
|
||||||
|
/bin/cp -f /home/deploy/infra_v2/backups/robots-prod-allow-2026-10-08.txt "$SITE_DIR/static/robots.txt" 2>/dev/null || true
|
||||||
|
|
||||||
|
cd "$COMPOSE_DIR"
|
||||||
|
docker compose -f docker-compose.yml run --rm hugo-build
|
||||||
|
# Restaurer Allow dans public après build Hugo (static peut être Disallow en Git)
|
||||||
|
/bin/cp -f /home/deploy/infra_v2/backups/robots-prod-allow-2026-10-08.txt /home/deploy/infra_v2/site-vitrine/public/robots.txt
|
||||||
|
docker compose -f docker-compose.yml up -d --force-recreate site-vitrine
|
||||||
|
|
||||||
|
echo "Production mise à jour à $(date)"
|
||||||
@@ -0,0 +1,18 @@
|
|||||||
|
# Staging : push sur site/v3 uniquement.
|
||||||
|
name: Déploiement Hugo Staging
|
||||||
|
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches:
|
||||||
|
- site/v3
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
deploy-staging:
|
||||||
|
runs-on: self-hosted
|
||||||
|
steps:
|
||||||
|
- name: Déployer sur staging.ptits-pas.fr
|
||||||
|
shell: bash
|
||||||
|
run: |
|
||||||
|
set -e
|
||||||
|
git config --global --add safe.directory /home/deploy/staging
|
||||||
|
/home/deploy/infra_v2/apps/hooks/deploy-hugo.sh
|
||||||
@@ -1,27 +0,0 @@
|
|||||||
name: Déploiement Hugo Staging
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
branches:
|
|
||||||
- master
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
deploy-staging:
|
|
||||||
runs-on: self-hosted
|
|
||||||
steps:
|
|
||||||
- name: Déployer sur staging
|
|
||||||
shell: bash
|
|
||||||
run: |
|
|
||||||
# Déclare /home/deploy/staging comme safe pour Git
|
|
||||||
git config --global --add safe.directory /home/deploy/staging
|
|
||||||
|
|
||||||
# Dirige-toi dans le clone staging
|
|
||||||
cd /home/deploy/staging
|
|
||||||
|
|
||||||
# Récupère la dernière version de master
|
|
||||||
git pull origin master
|
|
||||||
|
|
||||||
# Relance le service Hugo-staging
|
|
||||||
docker compose -f /home/deploy/infra/docker-compose.staging.yml up -d
|
|
||||||
|
|
||||||
echo "Staging mis à jour à $(date)"
|
|
||||||
+2
-1
@@ -10,4 +10,5 @@ Thumbs.db
|
|||||||
.vscode/
|
.vscode/
|
||||||
.idea/
|
.idea/
|
||||||
*.swp
|
*.swp
|
||||||
*.swo
|
*.swo
|
||||||
|
.cursorrules
|
||||||
+14
-11
@@ -1,18 +1,17 @@
|
|||||||
# Pour staging: baseURL = "https://staging.ptits-pas.fr/"
|
# Staging. Build : apps/staging (hugo-build-staging --baseURL).
|
||||||
# Pour production: baseURL = "https://ptits-pas.fr/"
|
# Production override : --baseURL=https://ptits-pas.fr/
|
||||||
baseURL = "https://staging.ptits-pas.fr/"
|
baseURL = "https://staging.ptits-pas.fr/"
|
||||||
languageCode = "fr"
|
languageCode = "fr"
|
||||||
title = "P'titsPas - Solution Petite Enfance pour Collectivités"
|
title = "P'titsPas — Plateforme Petite Enfance on-premise pour collectivités"
|
||||||
liveReloadPort = -1
|
liveReloadPort = -1
|
||||||
|
|
||||||
# SEO Configuration
|
|
||||||
[params]
|
[params]
|
||||||
description = "P'titsPas : plateforme publique pour la gestion de la petite enfance. Mise en relation parents-assistantes maternelles, transparence et neutralité garanties pour les collectivités."
|
description = "P'titsPas : plateforme Petite Enfance installée chez les collectivités (on-premise). RPE, assistantes maternelles et familles — pilotage local, pas un SaaS cloud."
|
||||||
keywords = "P'titsPas, ptitspas, p'tits pas, ptits pas, petitspas, petit pas, petits pas, opetitspas, pitispas, ptitpas, p'titpas, Ptitspas, PTITSPAS, petite enfance, assistante maternelle, collectivité, garde enfant, crèche, RPE, relais petite enfance, plateforme publique, gestion municipale, nounou, baby-sitter, garde à domicile, accueil collectif, multi-accueil, halte-garderie, micro-crèche, RAM, modes de garde, service public, mairie, conseil départemental, CAF, allocation garde enfant, accompagnement parental, contrat assistante maternelle, agrément assistante maternelle, recherche nounou, solution numérique municipale, dématérialisation services publics, transparence publique, égalité territoriale, politique petite enfance, développement enfant, conciliation vie familiale professionnelle"
|
|
||||||
author = "P'titsPas"
|
author = "P'titsPas"
|
||||||
|
# GA4 — switch depuis G-65J8GVLCRH le 2026-10-08 (site/v3)
|
||||||
|
ga_id = "G-K8BM5FHLF3"
|
||||||
|
|
||||||
# Site map and SEO
|
enableRobotsTXT = false
|
||||||
enableRobotsTXT = true
|
|
||||||
enableGitInfo = true
|
enableGitInfo = true
|
||||||
|
|
||||||
[sitemap]
|
[sitemap]
|
||||||
@@ -36,10 +35,14 @@ ignoreLogs = ['warning-goldmark-raw-html']
|
|||||||
url = "/fonctionnalites/"
|
url = "/fonctionnalites/"
|
||||||
weight = 2
|
weight = 2
|
||||||
[[menu.main]]
|
[[menu.main]]
|
||||||
name = "Pourquoi P'titsPas ?"
|
name = "Pilotage"
|
||||||
url = "/pourquoi-ptitspas/"
|
url = "/pilotage/"
|
||||||
weight = 3
|
weight = 3
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Pourquoi P'titsPas"
|
||||||
|
url = "/pourquoi-ptitspas/"
|
||||||
|
weight = 4
|
||||||
[[menu.main]]
|
[[menu.main]]
|
||||||
name = "Contact"
|
name = "Contact"
|
||||||
url = "/contact/"
|
url = "/contact/"
|
||||||
weight = 4
|
weight = 5
|
||||||
|
|||||||
+6
-36
@@ -1,38 +1,8 @@
|
|||||||
---
|
---
|
||||||
title: "P'titsPas - Plateforme Publique de Gestion Petite Enfance pour Collectivités"
|
title: "La Petite Enfance, enfin réunie"
|
||||||
description: "Solution numérique publique pour les collectivités : gestion transparente des relations parents-assistantes maternelles, sans notation ni algorithme opaque. Égalité et neutralité garanties."
|
description: "P'titsPas — plateforme Petite Enfance on-premise pour les collectivités. Simplifiez RPE, assistantes maternelles et familles ; pilotez votre offre locale."
|
||||||
keywords: ["P'titsPas", "ptitspas", "p'tits pas", "ptits pas", "petitspas", "petit pas", "petits pas", "opetitspas", "pitispas", "ptitpas", "p'titpas", "Ptitspas", "PTITSPAS", "petite enfance", "assistante maternelle", "collectivité", "commune", "garde enfant", "RPE", "relais petite enfance", "plateforme publique", "transparence", "neutralité", "gestion municipale petite enfance", "plateforme numérique collectivité", "mise en relation parents assistante maternelle", "solution publique garde enfant", "service public petite enfance", "accompagnement parental collectivité", "transparence service public", "égalité accès garde enfant", "politique municipale enfance", "dématérialisation services municipaux"]
|
date: 2026-10-08T12:00:00+02:00
|
||||||
date: 2025-05-17T12:00:00+02:00
|
hero_tagline: "La plateforme Petite Enfance installée chez les collectivités."
|
||||||
|
cta_primary: "Demander une démonstration"
|
||||||
|
cta_primary_url: "/contact/"
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="logo-accueil"><img src="/images/page_login_4.1.png" alt="Logo P'titsPas"></div>
|
|
||||||
|
|
||||||
# P'titsPas : La solution publique pour une gestion simplifiée et humaine de la petite enfance dans votre collectivité. V2
|
|
||||||
|
|
||||||
<div class="content-section">
|
|
||||||
**P'titsPas (aussi écrit ptitspas ou p'tits pas) est une plateforme numérique conçue pour accompagner les collectivités dans la gestion des relations entre les parents, les assistantes maternelles et les relais petite enfance (RPE). Elle vise à simplifier, structurer et sécuriser les processus de mise en relation, de contractualisation, de suivi et de communication autour de la garde d'enfants.**
|
|
||||||
|
|
||||||
Elle s'inscrit dans une démarche publique fondée sur les valeurs de la République : **égalité**, **neutralité**, **accessibilité** et **transparence**. Contrairement aux plateformes privées, la solution P'titsPas ne fonctionne ni sur la logique de notation, ni de sélection algorithmique opaque.
|
|
||||||
|
|
||||||
Notre mission est de valoriser le rôle des collectivités locales dans l'accompagnement de la petite enfance en fournissant un outil performant, éthique et adapté à vos besoins.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
---
|
|
||||||
<div class="content-section">
|
|
||||||
## Découvrez la différence P'titsPas
|
|
||||||
|
|
||||||
Nous croyons en un service public numérique qui place **l'humain**, **la clarté** et **le lien de confiance** au cœur de chaque interaction.
|
|
||||||
|
|
||||||
* **Neutralité Garantie :** Pas de système de notation, pas de mise en concurrence biaisée. Chaque acteur est traité avec équité.
|
|
||||||
* **Transparence Totale :** Des processus lisibles, traçables, et validés par toutes les parties prenantes.
|
|
||||||
* **Accessibilité Universelle :** Une interface pensée pour une utilisation intuitive sur tous les appareils, des téléphones aux ordinateurs de bureau.
|
|
||||||
* **Protection des Données :** Un respect strict du RGPD et une gouvernance des données maîtrisée par la collectivité.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
---
|
|
||||||
<div style="text-align: center; margin-top: calc(var(--padding-module) * 3);">
|
|
||||||
### Prêt à moderniser la gestion de la petite enfance dans votre commune ?
|
|
||||||
|
|
||||||
<a href="/fonctionnalites" class="cta-button">Découvrez nos fonctionnalités</a>
|
|
||||||
<a href="/contact" class="cta-button">Contactez-nous</a>
|
|
||||||
</div>
|
|
||||||
|
|||||||
+53
-38
@@ -1,50 +1,65 @@
|
|||||||
---
|
---
|
||||||
title: "Contactez-Nous - Parlons de Votre Projet P'titsPas"
|
title: "Demander une démonstration P'titsPas"
|
||||||
date: 2025-05-24T11:00:00+02:00
|
description: "Contactez P'titsPas pour une démonstration de la plateforme Petite Enfance on-premise destinée aux collectivités."
|
||||||
draft: false
|
date: 2026-10-08T12:00:00+02:00
|
||||||
---
|
---
|
||||||
|
|
||||||
Nous sommes ravis de l'intérêt que vous portez à P'titsPas et nous serions heureux d'échanger avec vous sur la manière dont notre solution peut répondre aux besoins spécifiques de votre collectivité.
|
# Demander une démonstration
|
||||||
|
|
||||||
Que vous souhaitiez une démonstration personnalisée, obtenir un devis, ou simplement en savoir plus sur nos fonctionnalités et notre approche, n'hésitez pas à nous solliciter.
|
Parlez-nous de votre collectivité. Nous vous rappelons pour une démonstration adaptée à votre contexte (RPE, direction Petite Enfance, DSI, élus).
|
||||||
|
|
||||||
## Demander une Démonstration ou un Devis
|
<form class="site-form" action="/contact.php" method="POST" novalidate>
|
||||||
|
<div class="hp" aria-hidden="true">
|
||||||
Utilisez le formulaire ci-dessous pour nous faire part de votre projet. Nous nous engageons à vous répondre dans les plus brefs délais.
|
<label for="website">Site web</label>
|
||||||
|
<input type="text" id="website" name="website" tabindex="-1" autocomplete="off">
|
||||||
<!--
|
|
||||||
IMPORTANT : Pour que ce formulaire fonctionne, vous devez l'intégrer avec un service de gestion de formulaires externe tel que :
|
|
||||||
- Formspree (https://formspree.io/)
|
|
||||||
- Netlify Forms (si votre site est hébergé sur Netlify)
|
|
||||||
- Getform (https://getform.io/)
|
|
||||||
- Ou une solution backend personnalisée.
|
|
||||||
|
|
||||||
Vous devrez modifier l'attribut "action" du formulaire ci-dessous avec l'URL fournie par le service que vous choisirez,
|
|
||||||
et potentiellement ajouter des champs cachés spécifiques à ce service.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<form action="#" method="POST" style="max-width: 600px; margin: 20px auto; padding: 20px; border: 1px solid #ddd; border-radius: 5px;">
|
|
||||||
<div style="margin-bottom: 15px;">
|
|
||||||
<label for="name" style="display: block; margin-bottom: 5px;">Nom Prénom :</label>
|
|
||||||
<input type="text" id="name" name="name" required style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 3px;">
|
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-bottom: 15px;">
|
<div>
|
||||||
<label for="collectivite" style="display: block; margin-bottom: 5px;">Collectivité / Organisation :</label>
|
<label for="name">Nom et prénom</label>
|
||||||
<input type="text" id="collectivite" name="collectivite" required style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 3px;">
|
<input type="text" id="name" name="name" required autocomplete="name">
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-bottom: 15px;">
|
<div>
|
||||||
<label for="email" style="display: block; margin-bottom: 5px;">Adresse E-mail :</label>
|
<label for="collectivite">Collectivité / organisation</label>
|
||||||
<input type="email" id="email" name="email" required style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 3px;">
|
<input type="text" id="collectivite" name="collectivite" required>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-bottom: 15px;">
|
<div>
|
||||||
<label for="phone" style="display: block; margin-bottom: 5px;">Téléphone (facultatif) :</label>
|
<label for="fonction">Fonction</label>
|
||||||
<input type="tel" id="phone" name="phone" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 3px;">
|
<select id="fonction" name="fonction" required>
|
||||||
|
<option value="">Choisir…</option>
|
||||||
|
<option value="elu">Élu·e</option>
|
||||||
|
<option value="direction-pe">Direction Petite Enfance</option>
|
||||||
|
<option value="rpe">Gestionnaire / RPE</option>
|
||||||
|
<option value="dsi">DSI / informatique</option>
|
||||||
|
<option value="autre">Autre</option>
|
||||||
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-bottom: 15px;">
|
<div>
|
||||||
<label for="message" style="display: block; margin-bottom: 5px;">Votre Message :</label>
|
<label for="taille">Taille (habitants ou nombre d'assistantes maternelles)</label>
|
||||||
<textarea id="message" name="message" rows="6" required style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 3px;"></textarea>
|
<input type="text" id="taille" name="taille" placeholder="ex. 12 000 habitants ou ~40 AM">
|
||||||
</div>
|
</div>
|
||||||
<button type="submit" style="background-color: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 3px; cursor: pointer;">Envoyer Votre Demande</button>
|
<div>
|
||||||
|
<label for="besoin">Besoin principal</label>
|
||||||
|
<select id="besoin" name="besoin">
|
||||||
|
<option value="">Choisir…</option>
|
||||||
|
<option value="mise-en-relation">Mise en relation</option>
|
||||||
|
<option value="rpe">Outil RPE</option>
|
||||||
|
<option value="contractualisation">Contractualisation</option>
|
||||||
|
<option value="pilotage">Pilotage / statistiques</option>
|
||||||
|
<option value="autre">Autre</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="email">E-mail</label>
|
||||||
|
<input type="email" id="email" name="email" required autocomplete="email">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="phone">Téléphone</label>
|
||||||
|
<input type="tel" id="phone" name="phone" autocomplete="tel">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="message">Message</label>
|
||||||
|
<textarea id="message" name="message" rows="5" required></textarea>
|
||||||
|
</div>
|
||||||
|
<button type="submit" class="btn btn--pill">Demander une démonstration</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
Nous avons hâte de collaborer avec vous pour améliorer la gestion de la petite enfance sur votre territoire !
|
<p class="form-note">Après envoi, vous verrez une confirmation. Nous vous rappelons dans les meilleurs délais.</p>
|
||||||
|
|||||||
@@ -0,0 +1,22 @@
|
|||||||
|
---
|
||||||
|
title: "Déploiement on-premise chez la collectivité"
|
||||||
|
description: "Installer P'titsPas chez la collectivité : déploiement on-premise, personnalisation, licence — solution petite enfance on premise."
|
||||||
|
date: 2026-10-08T12:00:00+02:00
|
||||||
|
---
|
||||||
|
|
||||||
|
# Déploiement : installée chez vous
|
||||||
|
|
||||||
|
P'titsPas se déploie **dans votre infrastructure** (serveur Linux / VM municipale ou intercommunale). Ce n'est pas un abonnement SaaS où tout reste chez l'éditeur.
|
||||||
|
|
||||||
|
## Ce que cela implique
|
||||||
|
|
||||||
|
- Instance dédiée à votre collectivité (ou groupement).
|
||||||
|
- Personnalisation : nom, couleurs, logo.
|
||||||
|
- Données sous votre maîtrise.
|
||||||
|
- Licence d'utilisation pour installer et exploiter l'application dans votre périmètre.
|
||||||
|
|
||||||
|
## Pour les communes sans équipe technique lourde
|
||||||
|
|
||||||
|
Le packaging vise une **installation rapide**. Les modalités exactes (accompagnement, hébergement délégué éventuel) se discutent avec vous — le socle reste la maîtrise locale, pas un cloud générique.
|
||||||
|
|
||||||
|
<a href="/contact/" class="cta-button">Parler déploiement</a>
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
---
|
||||||
|
title: "Données et sécurité — P'titsPas on-premise"
|
||||||
|
description: "RGPD, hébergement local, maîtrise des données : P'titsPas s'installe chez la collectivité, pas dans un cloud SaaS opaque."
|
||||||
|
date: 2026-10-08T12:00:00+02:00
|
||||||
|
aliases:
|
||||||
|
- /technique/
|
||||||
|
---
|
||||||
|
|
||||||
|
# Données et sécurité
|
||||||
|
|
||||||
|
P'titsPas est conçu pour un déploiement **on-premise** : l'instance et les données vivent dans l'infrastructure de la collectivité (ou de son opérateur).
|
||||||
|
|
||||||
|
## Maîtrise des données
|
||||||
|
|
||||||
|
- Hébergement local / sous votre responsabilité contractuelle.
|
||||||
|
- Pas de SaaS cloud opaque où vos données partent chez un tiers sans contrôle.
|
||||||
|
- Conception respectueuse du RGPD ; données sensibles (dont NIR le cas échéant) traitées selon des règles strictes de chiffrement et d'accès.
|
||||||
|
|
||||||
|
## Accessibilité
|
||||||
|
|
||||||
|
L'interface est pensée pour le **téléphone, la tablette et l'ordinateur**. L'accessibilité est une exigence de conception (visée AA), sans revendiquer une certification.
|
||||||
|
|
||||||
|
## Disponibilité et installation
|
||||||
|
|
||||||
|
Objectifs indicatifs de conception : haute disponibilité du service et installation rapide sur serveur Linux municipal. Les engagements contractuels se définissent au moment du déploiement.
|
||||||
|
|
||||||
|
Voir aussi [Déploiement](/deploiement/).
|
||||||
+34
-39
@@ -1,54 +1,49 @@
|
|||||||
---
|
---
|
||||||
title: "P'titsPas : Des Fonctionnalités Pensées Pour Chaque Acteur de la Petite Enfance"
|
title: "Fonctionnalités — RPE, assistantes maternelles, parents"
|
||||||
date: 2025-05-24T10:00:00+02:00
|
description: "Logiciel RPE collectivités : un outil pour les gestionnaires, les assistantes maternelles et les parents. Mise en relation simple, agenda, contrats — on-premise."
|
||||||
draft: false
|
date: 2026-10-08T12:00:00+02:00
|
||||||
---
|
---
|
||||||
|
|
||||||
P'titsPas offre une suite complète de fonctionnalités conçues pour simplifier le quotidien de tous les utilisateurs impliqués dans la garde d'enfants au sein de votre collectivité. Notre plateforme est pensée pour être intuitive, sécurisée et parfaitement adaptée aux besoins du service public.
|
# Une plateforme, trois quotidiens
|
||||||
|
|
||||||
## Une Interface Adaptée à Chacun
|
P'titsPas réunit dans un même environnement les **gestionnaires de RPE**, les **assistantes maternelles** et les **familles**. Ci-dessous, ce que chaque parcours est conçu pour simplifier.
|
||||||
|
|
||||||
Nous comprenons que chaque acteur a des besoins spécifiques. C'est pourquoi P'titsPas propose des tableaux de bord et des outils dédiés :
|
## <span id="rpe">Gestionnaires de RPE</span>
|
||||||
|
|
||||||
### Pour les Parents et Assistantes Maternelles : Simplicité et Autonomie
|
Un seul outil pour tout faire : dossiers, agenda, messagerie, événements.
|
||||||
Bien que P'titsPas soit un outil au service de la collectivité, nous avons à cœur de fournir une expérience utilisateur optimale pour les parents et les assistantes maternelles. Une adoption facilitée par ces utilisateurs clés signifie moins de charge de support pour vos services et une plus grande satisfaction citoyenne.
|
|
||||||
* **Recherche facilitée** et mise en relation transparente.
|
|
||||||
* **Gestion simplifiée des contrats** et des avenants.
|
|
||||||
* **Communication directe et tracée.**
|
|
||||||
* **Suivi des heures**, aide à la déclaration Pajemploi.
|
|
||||||
* **Agenda partagé** pour une meilleure organisation.
|
|
||||||
|
|
||||||
### Pour les Gestionnaires de Relais Petite Enfance (RPE) : Supervision et Accompagnement
|
**Fini** le jonglage entre WhatsApp, SMS, téléphone (« abonné absent »), Outlook et Telegram. Ces outils ne sont pas intégrés : on les remplace par un espace de travail commun, tracé, pensé pour le service public.
|
||||||
Vos gestionnaires RPE sont en première ligne. P'titsPas leur donne les moyens d'agir efficacement :
|
|
||||||
* **Validation des comptes** et suivi des dossiers.
|
|
||||||
* **Tableau de bord de supervision** des contrats et des mises en relation.
|
|
||||||
* Outils de **médiation** en cas de désaccord.
|
|
||||||
* Organisation d'**événements RPE** et communication ciblée.
|
|
||||||
* **Alertes** pour une gestion proactive des situations sensibles.
|
|
||||||
|
|
||||||
### Pour les Administrateurs de la Mairie : Contrôle, Personnalisation et Sécurité
|
Vous gagnez du temps pour l'accompagnement humain — pas pour recopier des messages d'un canal à l'autre.
|
||||||
P'titsPas est conçu pour s'intégrer parfaitement à votre gestion administrative et technique, en vous offrant un contrôle complet :
|
|
||||||
|
|
||||||
* **Gestion centralisée des utilisateurs :** Créez, modifiez, et supervisez les comptes (parents, assistantes maternelles, gestionnaires) avec des droits précis.
|
## <span id="am">Assistantes maternelles</span>
|
||||||
* **Personnalisation de la plateforme :** Adaptez l'interface aux couleurs de votre collectivité, intégrez votre logo, et personnalisez le nom de la structure.
|
|
||||||
* **Paramètres avancés :** Configurez les règles de la plateforme, comme l'obligation de photo, les délais de validation, etc.
|
|
||||||
* **Modules Activables :** Étendez les fonctionnalités de P'titsPas selon vos besoins spécifiques (Blog RPE, aide à la reformulation IA, etc.). La plateforme évolue avec vous.
|
|
||||||
* **Statistiques et Rapports :** Accédez à des données clés sur l'utilisation de la plateforme, le nombre de contrats, d'enfants, et exportez des données pour vos analyses.
|
|
||||||
* **Sécurité et Conformité RGPD :** Bénéficiez d'une solution conçue dans le respect strict du RGPD, avec des outils pour la gestion des consentements, la journalisation des accès et la sécurisation des données (NIR chiffré, etc.).
|
|
||||||
* **Architecture Technique Robuste :** Déployez P'titsPas sur votre infrastructure ou explorez nos options d'accompagnement. La solution est pensée pour être portable et maintenable.
|
|
||||||
|
|
||||||
## Des Workflows Clairs et Sécurisés
|
Le professionnel et le personnel restent à leur place.
|
||||||
|
|
||||||
De la recherche d'une assistante maternelle à la fin de contrat, P'titsPas structure chaque étape :
|
- Plus besoin d'un **deuxième téléphone** pour séparer les usages.
|
||||||
* **Recherche et mise en relation** guidées.
|
- Contrats, absences, congés et communications **regroupés** dans P'titsPas.
|
||||||
* **Création et validation de contrats** dématérialisée et collaborative.
|
- Congés et absences **datés** dans l'agenda — plus de dates perdues ou floues.
|
||||||
* **Gestion des avenants** simplifiée.
|
- Accessible sur **téléphone, tablette et ordinateur**.
|
||||||
* **Procédure de fin de contrat** accompagnée, avec calcul du solde de tout compte.
|
|
||||||
|
|
||||||
---
|
## <span id="parents">Parents</span>
|
||||||
|
|
||||||
P'titsPas est plus qu'un logiciel, c'est un partenaire pour votre politique petite enfance.
|
**Fini** d'éplucher 200 feuilles A4 recto-verso pas à jour depuis des années, et d'appeler des numéros aux abonnés absents ou des assistantes maternelles déjà complètes.
|
||||||
|
|
||||||
[Découvrez pourquoi P'titsPas est la solution de confiance pour les collectivités](/pourquoi-ptitspas)
|
- Recherche simple selon le besoin et les disponibilités.
|
||||||
|
- **Sans notation ni classement opaque.**
|
||||||
|
- Tableau de bord simple, structuré, amical.
|
||||||
|
- **Fini** les échanges qui se compliquent à cause de la barrière de la langue — la plateforme peut, en évolution, aider à reformuler ou traduire un message (voir ci-dessous).
|
||||||
|
|
||||||
[Contactez-nous pour échanger sur vos besoins spécifiques](/contact)
|
## Messagerie aidée (évolution, hors socle V1)
|
||||||
|
|
||||||
|
P'titsPas **peut aider** à reformuler ou traduire un message avant son envoi — pour les parents **et** les assistantes maternelles.
|
||||||
|
|
||||||
|
- Ce n'est **pas** le socle V1 : évolution **activable** / payante pour la collectivité.
|
||||||
|
- L'aide ne classe **jamais** les assistantes maternelles et n'en choisit aucune.
|
||||||
|
- Le message aidé est **signalé** comme tel.
|
||||||
|
|
||||||
|
## Pilotage
|
||||||
|
|
||||||
|
Pour les chiffres et le pilotage territorial : voir la page [Pilotage](/pilotage/).
|
||||||
|
|
||||||
|
<a href="/contact/" class="cta-button">Demander une démonstration</a>
|
||||||
|
|||||||
+33
-12
@@ -1,25 +1,46 @@
|
|||||||
---
|
---
|
||||||
title: "Mentions Légales"
|
title: "Mentions légales"
|
||||||
date: 2025-05-24T12:00:00+02:00
|
description: "Mentions légales du site P'titsPas : éditeur, hébergement, propriété intellectuelle et contact."
|
||||||
|
date: 2026-10-08T12:00:00+02:00
|
||||||
draft: false
|
draft: false
|
||||||
---
|
---
|
||||||
|
|
||||||
## Mentions Légales
|
# Mentions légales
|
||||||
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
Conformément aux dispositions applicables aux services de communication au public en ligne.
|
||||||
|
|
||||||
### Éditeur du site
|
## Éditeur du site
|
||||||
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet odio mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
|
Le site vitrine **P'titsPas** (nom de domaine `ptits-pas.fr`) est édité dans le cadre du projet P'titsPas, plateforme Petite Enfance destinée aux collectivités.
|
||||||
|
|
||||||
### Hébergement
|
- **Contact** : [contact@ptits-pas.fr](mailto:contact@ptits-pas.fr)
|
||||||
|
|
||||||
Curabitur sed iaculis dolor, non congue ligula. Maecenas imperdiet ante eget hendrerit posuere. Nunc urna libero, congue porta nibh a, semper feugiat sem.
|
Les informations d'identité complète de l'éditeur (raison sociale, forme juridique, siège, RCS le cas échéant, directeur de la publication) seront précisées ici dès finalisation administrative. En attendant, toute demande peut être adressée à l'adresse ci-dessus.
|
||||||
|
|
||||||
### Propriété Intellectuelle
|
## Hébergement
|
||||||
|
|
||||||
Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla.
|
Le site est hébergé sur l'infrastructure exploitée pour P'titsPas (serveur dédié / VPS, France / UE selon configuration en vigueur).
|
||||||
|
|
||||||
### Responsabilité
|
Pour toute question technique liée à l'hébergement du site vitrine : [contact@ptits-pas.fr](mailto:contact@ptits-pas.fr).
|
||||||
|
|
||||||
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis.
|
L'**application** P'titsPas, lorsqu'elle est déployée **on-premise**, est installée dans l'infrastructure de la collectivité cliente (ou de son opérateur désigné) ; l'hébergeur de ces données est alors celui de la collectivité.
|
||||||
|
|
||||||
|
## Propriété intellectuelle
|
||||||
|
|
||||||
|
L'ensemble des contenus de ce site (textes, éléments graphiques, marques, logos, structure) est protégé. Toute reproduction non autorisée est interdite, hors usage privé et citations conformes au droit.
|
||||||
|
|
||||||
|
La marque et les éléments visuels P'titsPas restent la propriété de leurs titulaires.
|
||||||
|
|
||||||
|
## Responsabilité
|
||||||
|
|
||||||
|
Les informations présentées sur ce site ont un caractère informatif et commercial. Elles décrivent la vision produit de la plateforme ; elles ne constituent pas un engagement contractuel tant qu'un contrat n'a pas été conclu.
|
||||||
|
|
||||||
|
L'éditeur s'efforce d'assurer l'exactitude des contenus et la disponibilité du site, sans garantie d'absence d'erreur ou d'interruption.
|
||||||
|
|
||||||
|
## Données personnelles
|
||||||
|
|
||||||
|
Le traitement des données collectées via ce site (formulaire, mesure d'audience) est décrit dans la [Politique de confidentialité](/politique-de-confidentialite/).
|
||||||
|
|
||||||
|
## Contact
|
||||||
|
|
||||||
|
[contact@ptits-pas.fr](mailto:contact@ptits-pas.fr)
|
||||||
|
|||||||
@@ -0,0 +1,36 @@
|
|||||||
|
---
|
||||||
|
title: "Pilotage Petite Enfance pour les collectivités"
|
||||||
|
description: "P'titsPas aide les collectivités à piloter l'offre Petite Enfance : places, disponibilités des assistantes maternelles, projections, exports — en local, on-premise."
|
||||||
|
date: 2026-10-08T12:00:00+02:00
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pilotage : une vision d'ensemble, sans la collecte fastidieuse
|
||||||
|
|
||||||
|
Les communes doivent **connaître leur offre et leurs besoins** d'accueil du jeune enfant. En tant qu'autorité organisatrice (et, selon le territoire, dans le cadre d'un schéma pluriannuel ou d'une CTG), elles ont besoin d'une photographie fiable — pas d'un patchwork de fichiers et d'appels téléphoniques chaque trimestre.
|
||||||
|
|
||||||
|
P'titsPas est **conçu pour centraliser** ces informations au fil de l'usage de la plateforme, et pour en tirer des indicateurs utiles au pilotage.
|
||||||
|
|
||||||
|
## Ce que le cadre demande — et ce que l'outil apporte
|
||||||
|
|
||||||
|
**Le cadre** : recenser l'offre et les besoins d'accueil sur le territoire, pour organiser la politique Petite Enfance.
|
||||||
|
|
||||||
|
**En complément, P'titsPas est conçu pour permettre de suivre notamment :**
|
||||||
|
|
||||||
|
- les capacités et places auprès des assistantes maternelles ;
|
||||||
|
- les places occupées et disponibles ;
|
||||||
|
- la disponibilité déclarée des assistantes maternelles ;
|
||||||
|
- une projection des sorties liées à l'entrée à l'école (à partir des dates de naissance) ;
|
||||||
|
- des indicateurs agrégés, sans exposer inutilement de données nominatives ;
|
||||||
|
- des **exports** pour vos rapports, schémas et échanges avec les partenaires (dont la Caf).
|
||||||
|
|
||||||
|
Autrement dit : vous devez piloter l'offre ; P'titsPas est conçu pour vous y aider avec des **données exploitables**, au-delà d'un taux théorique figé.
|
||||||
|
|
||||||
|
## Pour qui ?
|
||||||
|
|
||||||
|
Élus, direction Petite Enfance, RPE, DSI : une même lecture du terrain, sans multiplier les fichiers Excel.
|
||||||
|
|
||||||
|
## On-premise
|
||||||
|
|
||||||
|
Ces données restent **chez vous**. La plateforme s'installe dans l'infrastructure de la collectivité — pas un SaaS cloud opaque.
|
||||||
|
|
||||||
|
<a href="/contact/" class="cta-button">Demander une démonstration</a>
|
||||||
@@ -1,29 +1,77 @@
|
|||||||
---
|
---
|
||||||
title: "Politique de Confidentialité"
|
title: "Politique de confidentialité"
|
||||||
date: 2025-05-24T12:05:00+02:00
|
description: "Politique de confidentialité du site P'titsPas : données du formulaire de contact, Google Analytics, cookies et droits RGPD."
|
||||||
|
date: 2026-10-08T12:00:00+02:00
|
||||||
draft: false
|
draft: false
|
||||||
---
|
---
|
||||||
|
|
||||||
## Politique de Confidentialité
|
# Politique de confidentialité
|
||||||
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
La présente politique décrit le traitement des données à caractère personnel réalisé dans le cadre du **site vitrine** P'titsPas (notamment `ptits-pas.fr` et ses éventuels environnements de prévisualisation).
|
||||||
|
|
||||||
### Collecte des données personnelles
|
Elle ne remplace pas la politique de confidentialité propre à **l'application P'titsPas** déployée chez une collectivité (on-premise) : dans ce cas, le **responsable du traitement** est en principe la collectivité ou la structure désignée dans le contrat de déploiement.
|
||||||
|
|
||||||
Nunc vulputate libero et velit interdum, ac aliquet odio mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis.
|
Dernière mise à jour : **8 octobre 2026**.
|
||||||
|
|
||||||
### Utilisation des données
|
## Responsable du traitement (site vitrine)
|
||||||
|
|
||||||
Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla.
|
Pour le site vitrine et le formulaire de contact :
|
||||||
|
|
||||||
### Droits des utilisateurs
|
- **Contact** : [contact@ptits-pas.fr](mailto:contact@ptits-pas.fr)
|
||||||
|
|
||||||
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc.
|
Les mentions d'éditeur détaillées figurent sur la page [Mentions légales](/mentions-legales/).
|
||||||
|
|
||||||
### Cookies
|
## Données collectées sur ce site
|
||||||
|
|
||||||
Maecenas imperdiet ante eget hendrerit posuere. Nunc urna libero, congue porta nibh a, semper feugiat sem. Sed cursus ante dapibus diam.
|
### Formulaire de contact / demande de démonstration
|
||||||
|
|
||||||
### Modifications de la politique
|
Lorsque vous utilisez le formulaire, nous collectons les informations que vous renseignez, notamment : nom, collectivité, fonction, taille approximative, besoin, adresse e-mail, téléphone (facultatif) et message.
|
||||||
|
|
||||||
Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor.
|
Ces données sont utilisées uniquement pour **répondre à votre demande** (prise de contact, démonstration, information commerciale B2G) et pour assurer le suivi de la relation.
|
||||||
|
|
||||||
|
Base légale : **intérêt légitime** (réponse aux sollicitations professionnelles) et, le cas échéant, **mesures précontractuelles**.
|
||||||
|
|
||||||
|
Durée de conservation : le temps nécessaire au traitement de la demande, puis archivage limité si besoin de suivi commercial ou de preuve, dans la limite des durées usuelles (en pratique, suppression ou anonymisation lorsque la relation n'a plus d'objet).
|
||||||
|
|
||||||
|
### Mesure d'audience (Google Analytics 4)
|
||||||
|
|
||||||
|
Ce site utilise **Google Analytics 4** (identifiant de mesure `G-K8BM5FHLF3`) afin de comprendre la fréquentation des pages (pages vues, parcours approximatifs, type d'appareil).
|
||||||
|
|
||||||
|
La configuration retenue vise un traitement restreint : anonymisation de l'adresse IP, désactivation des Google Signals et de la personnalisation publicitaire.
|
||||||
|
|
||||||
|
Destinataire technique : Google Ireland Ltd / Google LLC, selon les conditions du service Analytics. Des transferts hors UE peuvent intervenir ; Google propose des mécanismes contractuels (clauses types) dans le cadre de ce service.
|
||||||
|
|
||||||
|
Vous pouvez limiter certains traceurs via les paramètres de votre navigateur ou des extensions dédiées.
|
||||||
|
|
||||||
|
## Cookies et traceurs
|
||||||
|
|
||||||
|
Le site peut déposer :
|
||||||
|
|
||||||
|
- des traceurs **techniques** nécessaires au fonctionnement ;
|
||||||
|
- des traceurs d'**audience** liés à Google Analytics, dans les conditions ci-dessus.
|
||||||
|
|
||||||
|
## Destinataires
|
||||||
|
|
||||||
|
Les données du formulaire sont destinées à l'équipe P'titsPas en charge des contacts commerciaux et techniques. Elles ne sont pas vendues. Elles peuvent être traitées via notre messagerie (hébergement mail `mail.ptits-pas.fr`) pour l'acheminement des messages.
|
||||||
|
|
||||||
|
## Sécurité
|
||||||
|
|
||||||
|
Des mesures raisonnables sont mises en œuvre pour protéger les échanges (HTTPS sur le site, envoi du formulaire via messagerie sécurisée côté serveur). Aucun système n'étant infaillible, nous vous invitons à ne pas transmettre de données sensibles non nécessaires via le formulaire public.
|
||||||
|
|
||||||
|
## Vos droits (RGPD)
|
||||||
|
|
||||||
|
Conformément au règlement (UE) 2016/679, vous disposez notamment des droits d'accès, de rectification, d'effacement, de limitation, d'opposition et, le cas échéant, de portabilité.
|
||||||
|
|
||||||
|
Pour les exercer concernant le **site vitrine**, contactez : [contact@ptits-pas.fr](mailto:contact@ptits-pas.fr).
|
||||||
|
|
||||||
|
Vous pouvez également introduire une réclamation auprès de la **CNIL** : [https://www.cnil.fr](https://www.cnil.fr).
|
||||||
|
|
||||||
|
Pour les données traitées dans une **instance applicative** déployée chez une collectivité, adressez-vous au responsable du traitement désigné par cette collectivité.
|
||||||
|
|
||||||
|
## Application P'titsPas (on-premise)
|
||||||
|
|
||||||
|
Lorsque P'titsPas est installé chez une collectivité, les données des usagers (parents, assistantes maternelles, agents, etc.) sont hébergées et traitées dans le cadre défini par cette collectivité. La présente page ne constitue pas la politique applicable à ces traitements.
|
||||||
|
|
||||||
|
## Modifications
|
||||||
|
|
||||||
|
Cette politique peut être mise à jour. La date de dernière mise à jour figure en tête de page. En cas de changement substantiel, une information pourra être portée sur le site.
|
||||||
|
|||||||
@@ -1,46 +1,34 @@
|
|||||||
---
|
---
|
||||||
title: "Pourquoi Choisir P'titsPas pour Votre Collectivité ?"
|
title: "Pourquoi P'titsPas — on-premise pour les collectivités"
|
||||||
date: 2025-05-24T10:30:00+02:00
|
description: "Pourquoi choisir P'titsPas : plateforme Petite Enfance on-premise, neutralité, maîtrise des données — pas un SaaS cloud crèche."
|
||||||
draft: false
|
date: 2026-10-08T12:00:00+02:00
|
||||||
---
|
---
|
||||||
|
|
||||||
Dans un monde numérique où les offres se multiplient, P'titsPas se distingue par son **engagement envers le service public** et ses valeurs fondamentales. Nous ne sommes pas une simple plateforme de mise en relation ; nous sommes un partenaire stratégique pour les collectivités qui souhaitent moderniser et humaniser la gestion de la petite enfance sur leur territoire.
|
# Pourquoi P'titsPas ?
|
||||||
|
|
||||||
## Au Service de l'Intérêt Général, Pas des Intérêts Privés
|
Parce que la Petite Enfance d'un territoire n'est pas un marché de notation : c'est un **service public**. Et parce que vos données ne devraient pas vivre dans un cloud SaaS opaque.
|
||||||
|
|
||||||
La différence P'titsPas réside dans son ADN : une solution pensée par et pour le secteur public.
|
## On-premise, pas SaaS
|
||||||
|
|
||||||
* **Neutralité Absolue :**
|
P'titsPas s'**installe chez la collectivité**. Les données sont hébergées localement, sous votre maîtrise.
|
||||||
Contrairement aux plateformes commerciales, P'titsPas n'utilise **aucun système de notation** ni algorithme opaque pour classer ou favoriser certaines assistantes maternelles. Chaque professionnel est présenté de manière équitable, garantissant aux parents un choix libre et éclairé, et aux assistantes maternelles une visibilité non biaisée.
|
|
||||||
|
|
||||||
* **Équité et Accès pour Tous :**
|
Ce n'est pas le modèle des logiciels crèche cloud (abonnements SaaS où l'hébergement et les règles restent chez l'éditeur). Ici : **souveraineté des données**, infrastructure municipale ou intercommunale, service public.
|
||||||
Nous croyons en un service public accessible. P'titsPas est conçu pour être utilisé facilement par tous, quel que soit le niveau d'aisance numérique. Les interfaces sont claires, la navigation intuitive, et nous visons la conformité avec les standards d'accessibilité (RGAA).
|
|
||||||
|
|
||||||
* **Transparence des Processus :**
|
## Quatre principes
|
||||||
Chaque étape, de la création de dossier à la gestion du contrat, est tracée et nécessite la validation des parties concernées. Cette transparence renforce la confiance entre les parents, les assistantes maternelles et les services de la mairie.
|
|
||||||
|
|
||||||
## Une Gouvernance des Données Maîtrisée par Votre Collectivité
|
1. **Neutralité** — pas de notation des professionnelles, pas de préférence algorithmique.
|
||||||
|
2. **Équité** — le même outil pour tout le territoire.
|
||||||
|
3. **Transparence** — parcours lisibles et tracés.
|
||||||
|
4. **Accessibilité** — téléphone, tablette et ordinateur.
|
||||||
|
|
||||||
Avec P'titsPas, vous gardez le contrôle de vos données et de celles de vos administrés.
|
## Pour qui ?
|
||||||
|
|
||||||
* **Conformité RGPD Stricte et Native :**
|
Mairies, EPCI, directions Petite Enfance, RPE, DSI — et, au quotidien, les assistantes maternelles et les familles.
|
||||||
La protection des données personnelles est au cœur de notre conception. Nous appliquons les principes de minimisation des données, de sécurisation des informations sensibles (comme le NIR, stocké chiffré et accessible uniquement aux personnes habilitées), et de gestion rigoureuse des consentements. Vous disposez d'une solution qui respecte les droits des usagers et les obligations légales des collectivités.
|
|
||||||
|
|
||||||
* **Adaptabilité aux Réalités Locales :**
|
## Ce que ça change
|
||||||
P'titsPas n'est pas une solution rigide. Personnalisez l'apparence (logo, couleurs), activez les modules qui correspondent à VOS besoins, et intégrez la plateforme dans l'écosystème de votre collectivité.
|
|
||||||
|
|
||||||
## Plus qu'un Outil, un Levier pour Votre Politique Petite Enfance
|
- Un outil pour les **RPE** à la place d'une mosaïque de messageries.
|
||||||
|
- Un parcours clair pour les **assistantes maternelles** et les **parents**.
|
||||||
|
- Une **vision d'ensemble** pour piloter l'offre (voir [Pilotage](/pilotage/)).
|
||||||
|
|
||||||
En choisissant P'titsPas, vous optez pour :
|
<a href="/contact/" class="cta-button">Demander une démonstration</a>
|
||||||
* La **valorisation du rôle de votre collectivité** comme acteur clé de l'accompagnement des familles.
|
|
||||||
* La **modernisation de vos services** avec une solution performante et sécurisée.
|
|
||||||
* Le **renforcement du lien de confiance** avec vos administrés grâce à un outil transparent et équitable.
|
|
||||||
* Une **solution évolutive**, pensée pour s'adapter aux futurs besoins et aux nouvelles réglementations.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
**P'titsPas, c'est l'assurance d'une gestion de la petite enfance sereine, efficace et conforme à vos valeurs de service public.**
|
|
||||||
|
|
||||||
[Explorez en détail nos fonctionnalités](/fonctionnalites)
|
|
||||||
|
|
||||||
[Prenons contact pour une démonstration adaptée à votre mairie](/contact)
|
|
||||||
|
|||||||
@@ -3,46 +3,39 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
<!-- SEO Meta Tags -->
|
|
||||||
<title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }}</title>
|
<title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }}</title>
|
||||||
<meta name="description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Params.description }}{{ end }}">
|
<meta name="description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Params.description }}{{ end }}">
|
||||||
<meta name="keywords" content="{{ if .Keywords }}{{ delimit .Keywords ", " }}{{ else }}{{ .Site.Params.keywords }}{{ end }}">
|
|
||||||
<meta name="author" content="{{ .Site.Params.author | default .Site.Title }}">
|
<meta name="author" content="{{ .Site.Params.author | default .Site.Title }}">
|
||||||
|
|
||||||
<!-- Prevent indexing of staging site -->
|
|
||||||
{{ if eq .Site.BaseURL "https://staging.ptits-pas.fr/" }}
|
{{ if eq .Site.BaseURL "https://staging.ptits-pas.fr/" }}
|
||||||
<meta name="robots" content="noindex, nofollow">
|
<meta name="robots" content="noindex, nofollow">
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
<!-- Open Graph / Facebook -->
|
|
||||||
<meta property="og:type" content="{{ if .IsHome }}website{{ else }}article{{ end }}">
|
<meta property="og:type" content="{{ if .IsHome }}website{{ else }}article{{ end }}">
|
||||||
<meta property="og:url" content="{{ .Permalink }}">
|
<meta property="og:url" content="{{ .Permalink }}">
|
||||||
<meta property="og:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }}{{ end }}">
|
<meta property="og:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }}{{ end }}">
|
||||||
<meta property="og:description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Params.description }}{{ end }}">
|
<meta property="og:description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Params.description }}{{ end }}">
|
||||||
<meta property="og:image" content="{{ .Site.BaseURL }}images/page_login_4.1.png">
|
<meta property="og:image" content="{{ .Site.BaseURL }}images/icon-192.png">
|
||||||
<meta property="og:locale" content="fr_FR">
|
<meta property="og:locale" content="fr_FR">
|
||||||
|
|
||||||
<!-- Twitter -->
|
<meta name="twitter:card" content="summary">
|
||||||
<meta property="twitter:card" content="summary_large_image">
|
<meta name="twitter:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }}{{ end }}">
|
||||||
<meta property="twitter:url" content="{{ .Permalink }}">
|
<meta name="twitter:description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Params.description }}{{ end }}">
|
||||||
<meta property="twitter:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }}{{ end }}">
|
<meta name="twitter:image" content="{{ .Site.BaseURL }}images/icon-192.png">
|
||||||
<meta property="twitter:description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Params.description }}{{ end }}">
|
|
||||||
<meta property="twitter:image" content="{{ .Site.BaseURL }}images/page_login_4.1.png">
|
|
||||||
|
|
||||||
<!-- Canonical URL -->
|
|
||||||
<link rel="canonical" href="{{ .Permalink }}">
|
<link rel="canonical" href="{{ .Permalink }}">
|
||||||
|
<link rel="icon" href="{{ "favicon.ico" | relURL }}" sizes="any">
|
||||||
<!-- Favicon -->
|
<link rel="icon" type="image/png" sizes="32x32" href="{{ "favicon-32.png" | relURL }}">
|
||||||
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
<link rel="icon" type="image/png" sizes="16x16" href="{{ "favicon-16.png" | relURL }}">
|
||||||
|
<link rel="apple-touch-icon" href="{{ "images/icon-192.png" | relURL }}">
|
||||||
<!-- JSON-LD structured data for Google -->
|
|
||||||
<script type="application/ld+json">
|
<script type="application/ld+json">
|
||||||
{
|
{
|
||||||
"@context": "https://schema.org",
|
"@context": "https://schema.org",
|
||||||
"@type": {{ if .IsHome }}"Organization"{{ else }}"WebPage"{{ end }},
|
"@type": {{ if .IsHome }}"Organization"{{ else }}"WebPage"{{ end }},
|
||||||
{{ if .IsHome }}
|
{{ if .IsHome }}
|
||||||
"name": "{{ .Site.Title }}",
|
"name": "P'titsPas",
|
||||||
"url": "{{ .Site.BaseURL }}",
|
"url": "{{ .Site.BaseURL }}",
|
||||||
"description": "{{ .Site.Params.description }}",
|
"description": "{{ .Site.Params.description }}",
|
||||||
"contactPoint": {
|
"contactPoint": {
|
||||||
@@ -57,22 +50,51 @@
|
|||||||
{{ end }}
|
{{ end }}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<link rel="stylesheet" href="{{ `/css/style.css` | relURL }}">
|
<link rel="stylesheet" href="{{ `/css/style.css` | relURL }}">
|
||||||
|
|
||||||
|
{{/* GA4 G-K8BM5FHLF3 — switch depuis G-65J8GVLCRH le 2026-10-08 */}}
|
||||||
|
<script async src="https://www.googletagmanager.com/gtag/js?id={{ .Site.Params.ga_id }}"></script>
|
||||||
|
<script>
|
||||||
|
window.dataLayer = window.dataLayer || [];
|
||||||
|
function gtag(){dataLayer.push(arguments);}
|
||||||
|
gtag('js', new Date());
|
||||||
|
gtag('config', '{{ .Site.Params.ga_id }}', {
|
||||||
|
'anonymize_ip': true,
|
||||||
|
'allow_google_signals': false,
|
||||||
|
'allow_ad_personalization_signals': false,
|
||||||
|
'restricted_data_processing': true
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<a class="skip-link" href="#contenu-principal">Aller au contenu</a>
|
||||||
<nav>
|
<header class="site-header">
|
||||||
<ul>
|
<div class="site-header__inner">
|
||||||
{{ range .Site.Menus.main }}
|
<a class="site-logo" href="{{ "/" | relURL }}">
|
||||||
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
|
<img class="site-logo__mark" src="{{ "images/app/icon.png" | relURL }}" alt="" width="40" height="40" decoding="async">
|
||||||
{{ end }}
|
<span class="site-logo__text">P'titsPas</span>
|
||||||
</ul>
|
</a>
|
||||||
</nav>
|
<nav class="site-nav" id="site-nav" aria-label="Navigation principale">
|
||||||
|
<button type="button" class="nav-toggle" aria-expanded="false" aria-controls="site-nav-panel" id="site-nav-toggle" aria-label="Ouvrir le menu">
|
||||||
|
<span class="nav-toggle__bar" aria-hidden="true"></span>
|
||||||
|
<span class="nav-toggle__bar" aria-hidden="true"></span>
|
||||||
|
<span class="nav-toggle__bar" aria-hidden="true"></span>
|
||||||
|
</button>
|
||||||
|
<div class="site-nav__panel" id="site-nav-panel">
|
||||||
|
<ul class="site-nav__list">
|
||||||
|
{{ range .Site.Menus.main }}
|
||||||
|
<li><a href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main id="contenu-principal" class="site-main">
|
||||||
{{ block "main" . }}{{ .Content }}{{ end }}
|
{{ block "main" . }}{{ .Content }}{{ end }}
|
||||||
</main>
|
</main>
|
||||||
{{ partial "footer.html" . }}
|
{{ partial "footer.html" . }}
|
||||||
|
<script src="{{ `/js/site.js` | relURL }}" defer></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
{{ define "main" }}
|
{{ define "main" }}
|
||||||
{{ .Content }}
|
<div class="page-shell">
|
||||||
{{ end }}
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|||||||
@@ -1,5 +1,7 @@
|
|||||||
{{ define "main" }}
|
{{ define "main" }}
|
||||||
<article class="content">
|
<div class="page-shell">
|
||||||
{{ .Content }}
|
<article class="content">
|
||||||
</article>
|
{{ .Content }}
|
||||||
{{ end }}
|
</article>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|||||||
@@ -0,0 +1,79 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="home">
|
||||||
|
<section class="hero" aria-labelledby="hero-title">
|
||||||
|
<div class="hero__visual">
|
||||||
|
<picture>
|
||||||
|
<source media="(max-width: 52rem)" srcset="{{ "images/app/river_logo_mobile.png" | relURL }}">
|
||||||
|
<img
|
||||||
|
class="hero__brand-img"
|
||||||
|
src="{{ "images/app/river_logo_desktop.png" | relURL }}"
|
||||||
|
alt="P'titsPas — Grandir pas à pas, sereinement"
|
||||||
|
width="1440"
|
||||||
|
height="1080"
|
||||||
|
fetchpriority="high"
|
||||||
|
decoding="async">
|
||||||
|
</picture>
|
||||||
|
</div>
|
||||||
|
<div class="hero__copy">
|
||||||
|
<h1 id="hero-title" class="hero__title">{{ .Title }}</h1>
|
||||||
|
{{ with .Params.hero_tagline }}
|
||||||
|
<p class="hero__tagline">{{ . }}</p>
|
||||||
|
{{ end }}
|
||||||
|
<p class="hero__actions">
|
||||||
|
<a class="btn btn--pill" href="{{ .Params.cta_primary_url | default "/contact/" | relURL }}">{{ .Params.cta_primary | default "Demander une démonstration" }}</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section experiences" aria-labelledby="exp-title">
|
||||||
|
<div class="section__inner">
|
||||||
|
<h2 id="exp-title">Trois expériences. Une même plateforme.</h2>
|
||||||
|
<p class="section__lead">Sur le terrain, chacun a son parcours — la collectivité garde la vision d'ensemble.</p>
|
||||||
|
<ul class="exp-grid">
|
||||||
|
<li class="exp-card">
|
||||||
|
<h3>Gestionnaires de RPE</h3>
|
||||||
|
<p>Agenda, dossiers, messagerie, événements — un seul outil. Fini le jonglage WhatsApp, SMS, Outlook et Telegram.</p>
|
||||||
|
<a href="{{ "fonctionnalites/" | relURL }}#rpe">Voir le quotidien RPE</a>
|
||||||
|
</li>
|
||||||
|
<li class="exp-card">
|
||||||
|
<h3>Assistantes maternelles</h3>
|
||||||
|
<p>Contrats, absences et congés regroupés. Plus besoin d'un deuxième téléphone pour séparer le pro et le perso.</p>
|
||||||
|
<a href="{{ "fonctionnalites/" | relURL }}#am">Voir le quotidien AM</a>
|
||||||
|
</li>
|
||||||
|
<li class="exp-card">
|
||||||
|
<h3>Parents</h3>
|
||||||
|
<p>Recherche simple selon le besoin, sans notation ni classement opaque. Plus de listes papier périmées.</p>
|
||||||
|
<a href="{{ "fonctionnalites/" | relURL }}#parents">Voir le côté parents</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section pilotage-teaser" aria-labelledby="pil-title">
|
||||||
|
<div class="section__inner section__inner--narrow">
|
||||||
|
<h2 id="pil-title">Et pour votre collectivité, enfin une vision d'ensemble.</h2>
|
||||||
|
<p>Places, disponibilités, projections liées à l'entrée à l'école : sortez de la collecte fastidieuse. P'titsPas est conçu pour centraliser ces indicateurs et les exporter pour votre pilotage.</p>
|
||||||
|
<p class="hero__actions">
|
||||||
|
<a class="btn btn--pill btn--secondary" href="{{ "pilotage/" | relURL }}">Découvrir le pilotage</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section confiance" aria-labelledby="conf-title">
|
||||||
|
<div class="section__inner">
|
||||||
|
<h2 id="conf-title">Installée chez vous. Pas un SaaS cloud.</h2>
|
||||||
|
<p class="section__lead">P'titsPas s'installe chez la collectivité (on-premise). Vos données restent sous votre maîtrise — souveraineté des données, service public, pas un cloud opaque.</p>
|
||||||
|
<ul class="principes">
|
||||||
|
<li><strong>Neutralité</strong> — pas de notation, pas de préférence algorithmique</li>
|
||||||
|
<li><strong>Équité</strong> — le même outil pour tout le territoire</li>
|
||||||
|
<li><strong>Transparence</strong> — parcours lisibles et tracés</li>
|
||||||
|
<li><strong>Accessibilité</strong> — téléphone, tablette et ordinateur</li>
|
||||||
|
</ul>
|
||||||
|
<p class="hero__actions">
|
||||||
|
<a class="btn btn--pill" href="{{ "contact/" | relURL }}">Demander une démonstration</a>
|
||||||
|
<a class="btn btn--text" href="{{ "pourquoi-ptitspas/" | relURL }}">Pourquoi P'titsPas</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
@@ -1,10 +1,9 @@
|
|||||||
<footer style="background-color: #f8f9fa; padding: 20px 0; text-align: center; border-top: 1px solid #e7e7e7; margin-top: 40px;">
|
<footer class="footer-site">
|
||||||
<div class="container">
|
<p>© {{ now.Year }} P'titsPas — Plateforme Petite Enfance on-premise pour les collectivités.</p>
|
||||||
<p>© {{ now.Year }} P'titsPas - Tous droits réservés.</p>
|
<nav class="footer-site__links" aria-label="Liens de pied de page">
|
||||||
<p>
|
<a href="{{ "mentions-legales/" | relURL }}">Mentions légales</a>
|
||||||
<a href="/mentions-legales/" style="margin-right: 15px; text-decoration: none; color: #007bff;">Mentions Légales</a>
|
<a href="{{ "politique-de-confidentialite/" | relURL }}">Politique de confidentialité</a>
|
||||||
<a href="/politique-de-confidentialite/" style="text-decoration: none; color: #007bff;">Politique de Confidentialité</a>
|
<a href="{{ "donnees-et-securite/" | relURL }}">Données et sécurité</a>
|
||||||
</p>
|
<a href="{{ "deploiement/" | relURL }}">Déploiement</a>
|
||||||
<!-- Vous pouvez ajouter ici d'autres informations ou liens si nécessaire -->
|
</nav>
|
||||||
</div>
|
</footer>
|
||||||
</footer>
|
|
||||||
|
|||||||
@@ -0,0 +1 @@
|
|||||||
|
<img class="home-hero__motif home-hero__motif-img" src="{{ "images/motif-trajet.svg" | relURL }}" width="520" height="140" alt="" role="presentation" decoding="async">
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
{{- $title := .Get "title" -}}
|
||||||
|
<div class="feature-card">
|
||||||
|
{{- if $title -}}
|
||||||
|
<h4 class="feature-card__title">{{ $title }}</h4>
|
||||||
|
{{- end -}}
|
||||||
|
<div class="feature-card__body">{{ .Inner | markdownify }}</div>
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
{{- $title := .Get "title" -}}
|
||||||
|
<section class="feature-section">
|
||||||
|
{{- if $title -}}
|
||||||
|
<h3 class="feature-section__title">{{ $title }}</h3>
|
||||||
|
{{- end -}}
|
||||||
|
<div class="feature-section__body">{{ .Inner | markdownify }}</div>
|
||||||
|
</section>
|
||||||
+502
-142
@@ -1,180 +1,540 @@
|
|||||||
/* Charte Graphique P'titsPas */
|
@import url("https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,600;8..60,700&display=swap");
|
||||||
|
|
||||||
/* Variables de Couleurs */
|
/* P'titsPas vitrine V3 — papier, rivière, Merienda marque */
|
||||||
:root {
|
|
||||||
--color-peche-doux: #FFD7A8;
|
@font-face {
|
||||||
--color-menthe-claire: #AEE1CD;
|
font-family: "Merienda";
|
||||||
--color-rose-tendre: #F6B2C4;
|
src: url("/fonts/Merienda-VariableFont_wght.ttf") format("truetype");
|
||||||
--color-jaune-pale: #FFECB3;
|
font-weight: 100 900;
|
||||||
--color-lavande: #E6E6FA; /* Approximation, à ajuster si vous avez un hex exact */
|
font-display: swap;
|
||||||
--color-corail-leger: #FFDAB9; /* Approximation, à ajuster */
|
|
||||||
--color-texte-principal: #333333;
|
|
||||||
--color-texte-secondaire: #555555;
|
|
||||||
--color-blanc: #FFFFFF;
|
|
||||||
--padding-module: 8px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Import des polices (exemple avec Google Fonts) */
|
:root {
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Merienda:wght@400;700&family=Open+Sans:wght@400;700&family=Poppins:wght@700&family=Quicksand:wght@500;700&family=Montserrat:wght@400;700&display=swap');
|
--ink: #2a2622;
|
||||||
/* Si vous avez une police script/brushed spécifique, elle devra être importée ici aussi, potentiellement localement */
|
--ink-soft: #5a524a;
|
||||||
|
--paper: #f7f1e8;
|
||||||
|
--mint: #6bbda3;
|
||||||
|
--mint-deep: #4a9a82;
|
||||||
|
--peach: #f49c6e;
|
||||||
|
--lavender: #b289c9;
|
||||||
|
--yellow: #e9c833;
|
||||||
|
--surface: rgba(255, 252, 247, 0.88);
|
||||||
|
--link: #3d7a6a;
|
||||||
|
--radius-pill: 999px;
|
||||||
|
--font-brand: "Merienda", "Segoe UI", cursive;
|
||||||
|
--font-body: "Source Serif 4", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
|
||||||
|
--font-ui: "Segoe UI", "Helvetica Neue", sans-serif;
|
||||||
|
--header-h: 3.75rem;
|
||||||
|
--max: 78rem;
|
||||||
|
--ease: cubic-bezier(0.22, 1, 0.36, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media (prefers-reduced-motion: reduce) {
|
||||||
|
*, *::before, *::after {
|
||||||
|
animation-duration: 0.01ms !important;
|
||||||
|
animation-iteration-count: 1 !important;
|
||||||
|
transition-duration: 0.01ms !important;
|
||||||
|
scroll-behavior: auto !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
*, *::before, *::after { box-sizing: border-box; }
|
||||||
|
|
||||||
|
html { scroll-behavior: smooth; }
|
||||||
|
|
||||||
/* Styles de Base */
|
|
||||||
body {
|
body {
|
||||||
font-family: 'Open Sans', sans-serif;
|
margin: 0;
|
||||||
color: var(--color-texte-principal);
|
font-family: var(--font-ui);
|
||||||
background-color: var(--color-blanc); /* Ou une teinte pastel très claire comme fond général */
|
font-size: 1rem;
|
||||||
|
line-height: 1.55;
|
||||||
|
color: var(--ink);
|
||||||
|
background-color: var(--paper);
|
||||||
|
background-image: url("/images/app/paper2.jpg");
|
||||||
|
background-size: cover;
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-position: center;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
@media (min-width: 64rem) {
|
||||||
|
body {
|
||||||
|
font-size: 0.95rem;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:focus-visible {
|
||||||
|
outline: 3px solid var(--mint);
|
||||||
|
outline-offset: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skip-link {
|
||||||
|
position: absolute;
|
||||||
|
left: -9999px;
|
||||||
|
z-index: 1000;
|
||||||
|
padding: 0.75rem 1rem;
|
||||||
|
background: var(--ink);
|
||||||
|
color: #fff;
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
.skip-link:focus { left: 1rem; top: 1rem; }
|
||||||
|
|
||||||
|
.visually-hidden {
|
||||||
|
position: absolute;
|
||||||
|
width: 1px; height: 1px;
|
||||||
|
padding: 0; margin: -1px;
|
||||||
|
overflow: hidden; clip: rect(0,0,0,0);
|
||||||
|
white-space: nowrap; border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header */
|
||||||
|
.site-header {
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
z-index: 100;
|
||||||
|
height: var(--header-h);
|
||||||
|
background: rgba(247, 241, 232, 0.92);
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
border-bottom: 1px solid rgba(42, 38, 34, 0.08);
|
||||||
|
}
|
||||||
|
.site-header__inner {
|
||||||
|
max-width: var(--max);
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 1.25rem;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
.site-logo {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.55rem;
|
||||||
|
font-family: var(--font-brand);
|
||||||
|
font-size: 1.45rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--ink);
|
||||||
|
text-decoration: none;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
}
|
||||||
|
.site-logo__mark {
|
||||||
|
width: 2rem;
|
||||||
|
height: 2rem;
|
||||||
|
object-fit: contain;
|
||||||
|
flex-shrink: 0;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.site-logo__text {
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
.site-nav__list {
|
||||||
|
list-style: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
line-height: 1.6;
|
display: flex;
|
||||||
|
gap: 0.25rem 1.25rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
.site-nav__list a {
|
||||||
main {
|
color: var(--ink-soft);
|
||||||
padding: calc(var(--padding-module) * 3); /* 24px */
|
|
||||||
max-width: 960px;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-family: 'Merienda', cursive; /* Police Script pour titres d'impact */
|
|
||||||
color: var(--color-texte-principal);
|
|
||||||
/* Peut nécessiter des ajustements de taille ou de graisse spécifiques */
|
|
||||||
/* font-weight: 700; /* ou 400 selon le style désiré */
|
|
||||||
}
|
|
||||||
|
|
||||||
h2, h3, h4, h5, h6 {
|
|
||||||
font-family: 'Poppins', sans-serif; /* Pour les sous-titres et autres titres */
|
|
||||||
color: var(--color-texte-principal);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Accroches et sous-titres (exemples) */
|
|
||||||
.accroche {
|
|
||||||
font-family: 'Quicksand', sans-serif;
|
|
||||||
font-weight: 700;
|
|
||||||
color: var(--color-texte-secondaire);
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: var(--color-corail-leger); /* Corail léger pour les liens */
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.site-nav__list a:hover { color: var(--mint-deep); }
|
||||||
|
|
||||||
|
.nav-toggle {
|
||||||
|
display: none;
|
||||||
|
background: none;
|
||||||
|
border: 0;
|
||||||
|
padding: 0.5rem;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.nav-toggle__bar {
|
||||||
|
display: block;
|
||||||
|
width: 1.4rem;
|
||||||
|
height: 2px;
|
||||||
|
margin: 5px 0;
|
||||||
|
background: var(--ink);
|
||||||
|
border-radius: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover {
|
@media (max-width: 52rem) {
|
||||||
|
.nav-toggle { display: block; }
|
||||||
|
.site-nav__panel {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
left: 0; right: 0;
|
||||||
|
top: var(--header-h);
|
||||||
|
background: var(--paper);
|
||||||
|
border-bottom: 1px solid rgba(42, 38, 34, 0.1);
|
||||||
|
padding: 1rem 1.25rem 1.5rem;
|
||||||
|
}
|
||||||
|
.site-nav.is-open .site-nav__panel { display: block; }
|
||||||
|
.site-nav__list { flex-direction: column; gap: 0.75rem; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Main */
|
||||||
|
.site-main { min-height: 60vh; }
|
||||||
|
|
||||||
|
.page-shell {
|
||||||
|
max-width: min(56rem, 94vw);
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 2rem 1.25rem 3.5rem;
|
||||||
|
}
|
||||||
|
@media (min-width: 64rem) {
|
||||||
|
.page-shell {
|
||||||
|
max-width: min(68rem, 90vw);
|
||||||
|
padding: 2.5rem 2rem 4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 90rem) {
|
||||||
|
.page-shell {
|
||||||
|
max-width: min(74rem, 86vw);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.page-shell .content {
|
||||||
|
background: var(--surface);
|
||||||
|
padding: clamp(1.25rem, 2.5vw, 2rem) clamp(1.25rem, 3vw, 2.75rem);
|
||||||
|
border-radius: 1.25rem;
|
||||||
|
box-shadow: 0 8px 32px rgba(42, 38, 34, 0.06);
|
||||||
|
}
|
||||||
|
.page-shell .content p,
|
||||||
|
.page-shell .content li {
|
||||||
|
font-size: 0.98rem;
|
||||||
|
}
|
||||||
|
@media (min-width: 64rem) {
|
||||||
|
.page-shell .content p,
|
||||||
|
.page-shell .content li {
|
||||||
|
font-size: 0.92rem;
|
||||||
|
max-width: 62rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.page-shell h1 {
|
||||||
|
font-family: var(--font-brand);
|
||||||
|
font-size: clamp(1.55rem, 1.3rem + 1vw, 2rem);
|
||||||
|
line-height: 1.2;
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
.page-shell h2 {
|
||||||
|
font-family: var(--font-brand);
|
||||||
|
font-size: 1.2rem;
|
||||||
|
margin-top: 1.75rem;
|
||||||
|
}
|
||||||
|
@media (min-width: 64rem) {
|
||||||
|
.page-shell h2 { font-size: 1.15rem; }
|
||||||
|
}
|
||||||
|
.page-shell a { color: var(--link); }
|
||||||
|
.note-validation {
|
||||||
|
margin-top: 2rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
color: var(--ink-soft);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Buttons */
|
||||||
|
.btn, .cta-button {
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
font-family: var(--font-ui);
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 1rem;
|
||||||
|
border: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.btn--pill, .cta-button {
|
||||||
|
padding: 0.85rem 1.6rem;
|
||||||
|
border-radius: var(--radius-pill);
|
||||||
|
background: linear-gradient(135deg, var(--mint) 0%, var(--mint-deep) 100%);
|
||||||
|
color: #fff !important;
|
||||||
|
box-shadow: 0 4px 16px rgba(74, 154, 130, 0.35);
|
||||||
|
transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease);
|
||||||
|
}
|
||||||
|
.btn--pill:hover, .cta-button:hover {
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 8px 24px rgba(74, 154, 130, 0.4);
|
||||||
|
}
|
||||||
|
.btn--secondary {
|
||||||
|
background: linear-gradient(135deg, var(--peach) 0%, #e07a4a 100%);
|
||||||
|
box-shadow: 0 4px 16px rgba(244, 156, 110, 0.35);
|
||||||
|
}
|
||||||
|
.btn--text {
|
||||||
|
background: none;
|
||||||
|
color: var(--link) !important;
|
||||||
|
box-shadow: none;
|
||||||
|
padding: 0.85rem 1rem;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Header / Navigation */
|
/*
|
||||||
header nav {
|
Hero aligné sur le login app :
|
||||||
background-color: var(--color-menthe-claire); /* Menthe claire pour le header */
|
paper2 (body) + river_logo_desktop (rivière + wordmark ensemble).
|
||||||
padding: var(--padding-module) 0;
|
Pas de dégradé coloré.
|
||||||
|
*/
|
||||||
|
.hero {
|
||||||
|
position: relative;
|
||||||
|
/* Pas de plein écran : le contenu suivant doit pointer sous le fold */
|
||||||
|
min-height: 0;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1rem;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 1rem 1.25rem 1.25rem;
|
||||||
|
max-width: var(--max);
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
.hero__visual {
|
||||||
header nav ul {
|
position: relative;
|
||||||
list-style-type: none;
|
z-index: 0;
|
||||||
padding: 0 calc(var(--padding-module) * 2);
|
animation: heroIn 0.9s var(--ease) both;
|
||||||
|
}
|
||||||
|
.hero__brand-img {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
max-height: min(52vh, 28rem);
|
||||||
|
object-fit: contain;
|
||||||
|
object-position: left center;
|
||||||
|
}
|
||||||
|
.hero__copy {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
animation: heroIn 0.8s var(--ease) 0.08s both;
|
||||||
|
}
|
||||||
|
@keyframes heroIn {
|
||||||
|
from { opacity: 0; transform: translateY(0.6rem); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
.hero__title {
|
||||||
|
font-family: var(--font-brand);
|
||||||
|
font-size: clamp(1.45rem, 1.1rem + 1.6vw, 2.4rem);
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 1.22;
|
||||||
|
margin: 0 0 0.75rem;
|
||||||
|
color: var(--ink);
|
||||||
|
}
|
||||||
|
.hero__tagline {
|
||||||
|
margin: 0 0 1.5rem;
|
||||||
|
color: var(--ink-soft);
|
||||||
|
font-size: clamp(1.02rem, 0.95rem + 0.35vw, 1.2rem);
|
||||||
|
line-height: 1.45;
|
||||||
|
}
|
||||||
|
.hero__actions {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.75rem 1rem;
|
||||||
|
justify-content: center;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
header nav ul li {
|
/* Desktop : comme le login — image rivière+logo à gauche, message à droite */
|
||||||
display: inline;
|
@media (min-width: 64rem) {
|
||||||
margin-right: calc(var(--padding-module) * 2.5); /* 20px */
|
.hero {
|
||||||
|
grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
|
||||||
|
column-gap: 1.75rem;
|
||||||
|
padding: 1rem 2.5rem 1.25rem;
|
||||||
|
align-items: center;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
.hero__visual {
|
||||||
|
align-self: stretch;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.hero__brand-img {
|
||||||
|
max-height: min(58vh, 30rem);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.hero__copy {
|
||||||
|
text-align: left;
|
||||||
|
padding-right: 1rem;
|
||||||
|
}
|
||||||
|
.hero__title {
|
||||||
|
font-size: clamp(1.85rem, 1.4rem + 1.1vw, 2.6rem);
|
||||||
|
margin-bottom: 0.75rem;
|
||||||
|
}
|
||||||
|
.hero__tagline {
|
||||||
|
margin-bottom: 1.25rem;
|
||||||
|
max-width: 28rem;
|
||||||
|
}
|
||||||
|
.hero__actions { justify-content: flex-start; }
|
||||||
}
|
}
|
||||||
|
|
||||||
header nav ul li a {
|
@media (max-width: 40rem) {
|
||||||
color: var(--color-texte-principal); /* Texte plus foncé sur fond pastel clair */
|
.hero {
|
||||||
text-decoration: none;
|
min-height: auto;
|
||||||
padding: calc(var(--padding-module) * 1.5) var(--padding-module);
|
padding: 0.75rem 1rem 1.25rem;
|
||||||
display: inline-block;
|
gap: 0.75rem;
|
||||||
font-family: 'Quicksand', sans-serif;
|
}
|
||||||
|
.hero__brand-img {
|
||||||
|
max-height: 40vh;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.hero__title { font-size: 1.3rem; }
|
||||||
|
.hero__tagline { font-size: 0.98rem; margin-bottom: 1rem; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sections */
|
||||||
|
.section {
|
||||||
|
padding: clamp(2rem, 4vw, 3.5rem) 1.25rem;
|
||||||
|
}
|
||||||
|
.home > .section:first-of-type {
|
||||||
|
padding-top: clamp(1.25rem, 2.5vw, 2rem);
|
||||||
|
}
|
||||||
|
.section__inner {
|
||||||
|
max-width: var(--max);
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.section__inner--narrow { max-width: 40rem; text-align: center; }
|
||||||
|
.section h2 {
|
||||||
|
font-family: var(--font-brand);
|
||||||
|
font-size: clamp(1.35rem, 1.15rem + 0.7vw, 1.75rem);
|
||||||
|
margin: 0 0 0.65rem;
|
||||||
|
line-height: 1.25;
|
||||||
|
}
|
||||||
|
.section__lead {
|
||||||
|
color: var(--ink-soft);
|
||||||
|
margin: 0 0 1.75rem;
|
||||||
|
max-width: 42rem;
|
||||||
|
font-size: 0.98rem;
|
||||||
|
}
|
||||||
|
@media (min-width: 64rem) {
|
||||||
|
.section__lead { font-size: 0.92rem; max-width: 48rem; }
|
||||||
|
}
|
||||||
|
.section__inner--narrow .section__lead,
|
||||||
|
.section__inner--narrow > p { margin-left: auto; margin-right: auto; }
|
||||||
|
|
||||||
|
.exp-grid {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: 1.5rem;
|
||||||
|
}
|
||||||
|
@media (max-width: 52rem) {
|
||||||
|
.exp-grid { grid-template-columns: 1fr; }
|
||||||
|
}
|
||||||
|
@media (min-width: 64rem) {
|
||||||
|
.experiences .section__inner,
|
||||||
|
.confiance .section__inner {
|
||||||
|
max-width: var(--max);
|
||||||
|
}
|
||||||
|
.exp-card { padding: 1.75rem 1.6rem; min-height: 12rem; }
|
||||||
|
}
|
||||||
|
.exp-card {
|
||||||
|
background: var(--surface);
|
||||||
|
border-radius: 1.25rem;
|
||||||
|
padding: 1.5rem;
|
||||||
|
box-shadow: 0 6px 24px rgba(42, 38, 34, 0.06);
|
||||||
|
animation: cardIn 0.7s var(--ease) both;
|
||||||
|
}
|
||||||
|
.exp-card:nth-child(2) { animation-delay: 0.08s; }
|
||||||
|
.exp-card:nth-child(3) { animation-delay: 0.16s; }
|
||||||
|
@keyframes cardIn {
|
||||||
|
from { opacity: 0; transform: translateY(0.8rem); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
.exp-card h3 {
|
||||||
|
font-family: var(--font-brand);
|
||||||
|
font-size: 1.2rem;
|
||||||
|
margin: 0 0 0.5rem;
|
||||||
|
}
|
||||||
|
.exp-card p {
|
||||||
|
margin: 0 0 1rem;
|
||||||
|
color: var(--ink-soft);
|
||||||
|
font-size: 0.98rem;
|
||||||
|
}
|
||||||
|
.exp-card a {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
border-radius: calc(var(--padding-module) / 2); /* 4px */
|
color: var(--link);
|
||||||
}
|
|
||||||
|
|
||||||
header nav ul li a:hover {
|
|
||||||
background-color: var(--color-peche-doux); /* Pêche doux au survol */
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
.exp-card a:hover { text-decoration: underline; }
|
||||||
|
|
||||||
/* Style pour l'image du logo sur la page d'accueil */
|
.pilotage-teaser {
|
||||||
.logo-accueil img {
|
background: rgba(255, 252, 247, 0.55);
|
||||||
width: 100%;
|
border-top: 1px solid rgba(42, 38, 34, 0.06);
|
||||||
max-height: 400px;
|
border-bottom: 1px solid rgba(42, 38, 34, 0.06);
|
||||||
object-fit: cover;
|
}
|
||||||
display: block;
|
.pilotage-teaser p { color: var(--ink-soft); }
|
||||||
margin-bottom: calc(var(--padding-module) * 4); /* 32px */
|
|
||||||
border-radius: var(--padding-module); /* Coins arrondis style galet */
|
.confiance .principes {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0 0 2rem;
|
||||||
|
padding: 0;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 0.75rem 1.5rem;
|
||||||
|
}
|
||||||
|
@media (max-width: 40rem) {
|
||||||
|
.confiance .principes { grid-template-columns: 1fr; }
|
||||||
|
}
|
||||||
|
.confiance .principes li {
|
||||||
|
background: var(--surface);
|
||||||
|
padding: 0.85rem 1rem;
|
||||||
|
border-radius: 0.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Boutons */
|
/* Form */
|
||||||
button,
|
.site-form {
|
||||||
input[type="submit"],
|
display: grid;
|
||||||
.cta-button {
|
gap: 1rem;
|
||||||
font-family: 'Quicksand', sans-serif;
|
margin-top: 1.5rem;
|
||||||
font-weight: 700;
|
|
||||||
background-color: var(--color-peche-doux); /* Pêche doux pour les boutons primaires */
|
|
||||||
color: var(--color-texte-principal);
|
|
||||||
border: none;
|
|
||||||
padding: calc(var(--padding-module) * 1.5) calc(var(--padding-module) * 3);
|
|
||||||
border-radius: calc(var(--padding-module) * 3); /* Forme de galet allongé */
|
|
||||||
cursor: pointer;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
margin-top: var(--padding-module);
|
|
||||||
transition: background-color 0.3s ease;
|
|
||||||
}
|
}
|
||||||
|
.site-form label {
|
||||||
button:hover,
|
|
||||||
input[type="submit"]:hover,
|
|
||||||
.cta-button:hover {
|
|
||||||
background-color: var(--color-rose-tendre); /* Rose tendre au survol */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Formulaires (basique) */
|
|
||||||
form div {
|
|
||||||
margin-bottom: calc(var(--padding-module) * 2);
|
|
||||||
}
|
|
||||||
|
|
||||||
form label {
|
|
||||||
display: block;
|
display: block;
|
||||||
margin-bottom: var(--padding-module);
|
font-weight: 600;
|
||||||
font-family: 'Quicksand', sans-serif;
|
margin-bottom: 0.35rem;
|
||||||
|
font-size: 0.95rem;
|
||||||
}
|
}
|
||||||
|
.site-form input,
|
||||||
form input[type="text"],
|
.site-form select,
|
||||||
form input[type="email"],
|
.site-form textarea {
|
||||||
form input[type="tel"],
|
|
||||||
form textarea {
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: var(--padding-module);
|
padding: 0.7rem 0.85rem;
|
||||||
border: 1px solid var(--color-menthe-claire);
|
border: 1px solid rgba(42, 38, 34, 0.18);
|
||||||
border-radius: calc(var(--padding-module) / 2); /* 4px */
|
border-radius: 0.65rem;
|
||||||
box-sizing: border-box; /* Important pour que padding ne change pas la largeur totale */
|
font: inherit;
|
||||||
font-family: 'Open Sans', sans-serif;
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
.site-form .hp {
|
||||||
/* Sections de contenu - style galet */
|
position: absolute;
|
||||||
.content-section {
|
left: -10000px;
|
||||||
background-color: var(--color-blanc);
|
top: auto;
|
||||||
padding: calc(var(--padding-module) * 3);
|
width: 1px;
|
||||||
margin-bottom: calc(var(--padding-module) * 3);
|
height: 1px;
|
||||||
border-radius: calc(var(--padding-module) * 2); /* 16px, angles arrondis */
|
overflow: hidden;
|
||||||
box-shadow: 0 4px 8px rgba(0,0,0,0.05); /* Ombre douce */
|
}
|
||||||
|
.form-note {
|
||||||
|
margin-top: 1.25rem;
|
||||||
|
color: var(--ink-soft);
|
||||||
|
font-size: 0.95rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Footer */
|
/* Footer */
|
||||||
footer {
|
.footer-site {
|
||||||
background-color: var(--color-jaune-pale); /* Jaune pâle pour le footer */
|
padding: 2rem 1.25rem 3rem;
|
||||||
padding: calc(var(--padding-module) * 2.5) 0;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-top: 1px solid var(--color-peche-doux);
|
color: var(--ink-soft);
|
||||||
margin-top: calc(var(--padding-module) * 5);
|
font-size: 0.9rem;
|
||||||
|
border-top: 1px solid rgba(42, 38, 34, 0.08);
|
||||||
|
background: rgba(247, 241, 232, 0.7);
|
||||||
}
|
}
|
||||||
|
.footer-site__links {
|
||||||
footer p {
|
display: flex;
|
||||||
margin: var(--padding-module) 0;
|
flex-wrap: wrap;
|
||||||
font-size: 0.9em;
|
gap: 0.75rem 1.25rem;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 0.75rem;
|
||||||
}
|
}
|
||||||
|
.footer-site__links a {
|
||||||
footer a {
|
color: var(--ink-soft);
|
||||||
color: var(--color-texte-secondaire);
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
.footer-site__links a:hover { color: var(--mint-deep); }
|
||||||
|
|||||||
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 157 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 157 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 146 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 300 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 498 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 305 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
@@ -0,0 +1,3 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 140" preserveAspectRatio="xMidYMid slice" fill="none">
|
||||||
|
<path stroke="#7eb9a4" stroke-width="2.5" stroke-linecap="round" opacity="0.35" d="M20 100 C 90 30, 160 120, 230 70 S 360 20, 500 85"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 257 B |
@@ -0,0 +1,47 @@
|
|||||||
|
(function () {
|
||||||
|
var nav = document.getElementById("site-nav");
|
||||||
|
if (!nav) return;
|
||||||
|
|
||||||
|
var toggle = nav.querySelector(".nav-toggle");
|
||||||
|
var mq = window.matchMedia("(max-width: 51.99rem)");
|
||||||
|
|
||||||
|
function setOpen(open) {
|
||||||
|
nav.classList.toggle("is-open", open);
|
||||||
|
if (toggle) {
|
||||||
|
toggle.setAttribute("aria-expanded", open ? "true" : "false");
|
||||||
|
toggle.setAttribute("aria-label", open ? "Fermer le menu" : "Ouvrir le menu");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (toggle) {
|
||||||
|
toggle.addEventListener("click", function () {
|
||||||
|
var next = !nav.classList.contains("is-open");
|
||||||
|
setOpen(next);
|
||||||
|
if (next) {
|
||||||
|
var first = nav.querySelector(".site-nav__list a");
|
||||||
|
if (first) {
|
||||||
|
window.requestAnimationFrame(function () {
|
||||||
|
first.focus();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener("keydown", function (e) {
|
||||||
|
if (e.key === "Escape" && nav.classList.contains("is-open")) {
|
||||||
|
setOpen(false);
|
||||||
|
if (toggle) toggle.focus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
nav.querySelectorAll(".site-nav__list a").forEach(function (a) {
|
||||||
|
a.addEventListener("click", function () {
|
||||||
|
if (mq.matches) setOpen(false);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
mq.addEventListener("change", function (e) {
|
||||||
|
if (!e.matches) setOpen(false);
|
||||||
|
});
|
||||||
|
})();
|
||||||
Reference in New Issue
Block a user