Commit initial

md/pages/a-propos.md

@@ -0,0 +1,6 @@
+::Date:07/03/2026
+::Auteur:Kawa
+::Categories:Racine
+::Titre:A propos
+
+Salut, moi c'est Kawa, j'aime les piles.

md/pages/exemple-article.md

@@ -0,0 +1,111 @@
+::Titre:Exemple d'article — toutes les fonctionnalités
+::Date:01/01/2026
+::Auteur:Votre Nom
+::Categories:Blog
+::Image:/images/cover.jpg
+
+Ceci est un **article d'exemple** montrant toutes les fonctionnalités disponibles dans PageMark. Supprimez ce fichier quand vous n'en avez plus besoin.
+
+## Métadonnées
+
+Les métadonnées se placent en tête de fichier avec la syntaxe `::Clé:Valeur`. Elles définissent le titre, la date, l'auteur et la catégorie de l'article.
+
+## Mise en forme du texte
+
+Le texte supporte toute la syntaxe Markdown :
+
+- **Gras** avec `**texte**`
+- *Italique* avec `*texte*`
+- ~~Barré~~ avec `~~texte~~`
+- `Code inline` avec des backticks
+- [Lien](https://example.com) avec `[texte](url)`
+
+## Titres et ancres
+
+Les titres `h1` à `h4` génèrent automatiquement une ancre cliquable `#` au survol, permettant de créer des liens directs vers une section :
+
+```
+https://monsite.com/exemple-article#images
+```
+
+### Niveau 3
+
+#### Niveau 4
+
+## Images
+
+Placez vos images dans `md/images/` et insérez-les ainsi :
+
+```markdown
+![Description de l'image](/images/photo.jpg)
+```
+
+L'image de couverture (affichée dans les cards de la page d'accueil) se définit avec `::Image:/images/cover.jpg`.
+
+## Blocs de code
+
+Les blocs de code supportent la coloration syntaxique pour la plupart des langages :
+
+```python
+def saluer(nom: str) -> str:
+    return f"Bonjour, {nom} !"
+
+print(saluer("PageMark"))
+```
+
+```bash
+# Générer le site
+python3 build.py
+
+# Test local
+python3 -m http.server 3000
+```
+
+```javascript
+document.addEventListener("DOMContentLoaded", () => {
+  console.log("PageMark chargé !");
+});
+```
+
+## Tableaux
+
+| Fonctionnalité    | Syntaxe               | Résultat              |
+|-------------------|-----------------------|-----------------------|
+| Titre             | `::Titre:Mon titre`   | h1 avant l'article    |
+| Date              | `::Date:dd/mm/YYYY`   | Tri chronologique     |
+| Catégorie         | `::Categories:A-B`    | Dossier `a/b/`        |
+| Image couverture  | `::Image:/img/x.jpg`  | Card sur l'accueil    |
+
+## Citations
+
+> Les blockquotes s'écrivent avec `>` en début de ligne.
+> Elles peuvent s'étendre sur plusieurs lignes.
+
+## HTML personnalisé
+
+Vous pouvez insérer du HTML directement dans le Markdown — utile pour des mises en forme avancées, des iframes, des widgets, etc.
+
+<div style="background: var(--accent-soft); border-left: 3px solid var(--accent); padding: 1rem 1.4rem; border-radius: 0 8px 8px 0; margin: 1.5rem 0;">
+  <strong>Astuce :</strong> utilisez les variables CSS <code>var(--accent)</code>, <code>var(--bg)</code>, <code>var(--text)</code>, etc. pour que votre HTML s'adapte automatiquement au dark mode.
+</div>
+
+## Listes
+
+Liste non ordonnée :
+
+- Élément A
+- Élément B
+  - Sous-élément
+  - Sous-élément
+
+Liste ordonnée :
+
+1. Première étape
+2. Deuxième étape
+3. Troisième étape
+
+Liste de tâches :
+
+- [x] Tâche terminée
+- [ ] Tâche en cours
+- [ ] Tâche à faire