Styles blocks Osuny

Hello la team,

Une petite update pour vous montrer où j’en suis sur les styles de blocks d’Osuny !
J’ai tout poussé sur la branche style/theme, mais ce n’est pas encore merge sur develop.

Tous les blocks fonctionnent :tada: et possèdent un style :art: (une première version en tout cas), sauf :

  • les tableaux blocks/datatable : il semble qu’ils soient implémentés dans la dernière version d’Osuny mais je ne sais pas si Benoit a fait la mise à jour depuis ou non.
  • les pages blocks/pages : j’ai encore un bug pour le moment, je n’arrive pas à récupérer correctement les objets pages, mais ça doit pouvoir se résoudre.
  • les partners blocks/partners : c’est en cours, j’ai presque terminé.

Pour le reste, voilà à quoi ça ressemble pour le moment – le titre est optionnel pour chaque block, mais là j’en ai mis un à chaque fois pour tester :

Chapitre

blocks/chapter
Pour l’instant, il n’est possible d’ajouter des h3 qu’en passant par le code, ce n’est pas idéal.

Image

blocks/image
Possibilité d’ajouter un titre, une légende et un crédit.

Video

blocks/video
Possibilité d’ajouter un titre et une transcription.

Key figures

blocks/key_figures

Gallery

blocks/gallery

Grille

blocks/gallery/layout-grid
Quand on clique sur une image, ça lance une visionneuse type lightbox via la bibliothèque GLightbox (c’est celle utilisée par Noesya).

Carrousel

blocks/gallery/layout-carousel
La vue en carrousel utilise la bibliothèque Splide (idem, c’est elle utilisée par Noesya).

Call to action

blocks/call_to_action
3 types de boutons : pimary, secondary, tertiary

Testimonials

blocks/testimonials
Si il y en a plusieurs, ça crée un carrousel (même bibliothèque que pour la galerie).
On peut aussi ajouter un image avatar qui vient se caler à gauche de l’auteur.

Timeline

blocks/timeline
J’ai repris le style des liste à puce ul on ajoutant simplement une ligne pour relier les points, je trouve que ça marche plutôt bien.

Definitions

blocks/definitions

Files

blocks/files
J’ai ajouté une petite icône devant pour que ça se distingue des liens classiques.

Embed

blocks/embed
Possibilité d’ajouter une titre. La dimension dépend des attributs width et height de l’<iframe>, avec la possibilité de mettre 100% en width (comme c’est le cas ici).

1 « J'aime »