Bienvenue sur le blog. Ceci est le contenu du premier article, rédigé en Markdown et rendu avec le même thème que la liste, pour montrer la continuité de l’identité visuelle.
Une section
Le texte courant utilise Rethink Sans à 24px avec une hauteur de ligne de 1.4em, conformément aux tokens fournis. La largeur de lecture est limitée à 65ch pour un confort optimal.
- Un premier point
- Un deuxième point
- Un troisième point
Une citation, mise en valeur par une bordure violette discrète.
Et un peu de code inline pour la route. On peut aussi insérer un lien qui prend la couleur bleue du thème.
System.out.println("Hello world !");
Un diagramme Mermaid
Voici un exemple de diagramme rendu côté client grâce à l’intégration astro-mermaid :
flowchart LR
A[Rédaction] --> B{Relecture}
B -- OK --> C[Publication]
B -- À revoir --> A
C --> D[(Blog)]
sequenceDiagram
participant web as Web Browser
participant blog as Blog Service
participant account as Account Service
participant mail as Mail Service
participant db as Storage
Note over web,db: The user must be logged in to submit blog posts
web->>+account: Logs in using credentials
account->>db: Query stored accounts
db->>account: Respond with query result
alt Credentials not found
account->>web: Invalid credentials
else Credentials found
account->>-web: Successfully logged in
Note over web,db: When the user is authenticated, they can now submit new posts
web->>+blog: Submit new post
blog->>db: Store post data
par Notifications
blog--)mail: Send mail to blog subscribers
blog--)db: Store in-site notifications
and Response
blog-->>-web: Successfully posted
end
end
Et un diagramme de séquence pour illustrer un échange simple :
sequenceDiagram
participant L as Lecteur
participant B as Blog
participant A as Auteur
L->>B: Ouvre l'article
B-->>L: Rend le contenu Markdown
L->>A: Envoie un retour
A-->>L: Répond par e-mail