Mise en exergue - Highlight
La mise en exergue permet à l’utilisateur de distinguer et repérer une information facilement. Elle met en évidence une information déjà présente dans le reste du contenu : soit une reformulation, soit une reprise du texte.
Pour mettre en évidence une information complémentaire, utilisez le composant “Mise en avant”.
La taille du texte peut être adaptée avec le paramètre size: :sm[/md/lg]
.
Vue d’ensemble
Le rendu de base de la mise en exergue
Code
= dsfr_highlight(text: "Ceci est une information mise en avant")
Résultat
Ceci est une information mise en avant
<div class="fr-highlight">
<p class="fr-text--md">
Ceci est une information mise en avant
</p>
</div>
Avec du texte élargi
Rendu avec une taille de texte élargie
Code
= dsfr_highlight(text: "Ceci est une information mise en avant, avec un texte plus large", size: :lg)
Résultat
Ceci est une information mise en avant, avec un texte plus large
<div class="fr-highlight">
<p class="fr-text--lg">
Ceci est une information mise en avant, avec un texte plus large
</p>
</div>