BjCard

Conteneur carte React avec forwardRef, modificateurs horizontal, flat, highlight et lien ; la balise racine est article par défaut, ou div ou lien via la prop as.

Utilisation

import { BjCard, BjCardBody, BjCardFooter, BjCardImg } from '@flrxnt/dsbj/react'

export function Example() {
  return (
    <BjCard>
      <BjCardImg background="var(--bj-surface-alt)" />
      <BjCardBody>
        <p className="bj-card__detail">Actualité</p>
        <h3 className="bj-card__title">Titre</h3>
        <p className="bj-card__desc">Résumé de l’article.</p>
      </BjCardBody>
      <BjCardFooter>
        <span className="bj-card__start">12 mars 2025</span>
      </BjCardFooter>
    </BjCard>
  )
}

Aperçu

Actualité

Titre

Résumé de l’article.

12 mars 2025

Props

PropDescription
horizontalDisposition image à gauche, contenu à droite.
flatSans bordure ni ombre.
highlightBordure gauche d’accent.
linkStyle carte interactive.
asÉlément racine : article par défaut, div ou a.