#

Tailwind CSS

PrettyBlocks implémente désormais un couche CSS afin gérer le style de ces propres composants, la librairie utilisée est Tailwind CSS, afin de ne pas rentrer en conflit avec d'autres composants, themes ou modules PrestaShop, tailwind est préfixé avec un tw_ devant chaque classes.

Exemple:

1<article class="tw_border tw_shadow tw_rounded-md tw_max-w-sm tw_w-full tw_mx-auto tw_pb-2 tw_mb-2" data-id-product="{$product.id_product|escape:'htmlall':'UTF-8'}" data-id-product-attribute="{$product.id_product_attribute|escape:'htmlall':'UTF-8'}">
2...
3</article>

pour modifier les elements PrettyBlocks depuis votre theme enfant, overridez le dossier views/css/_dev

#

Spacings

Dans sa version 3.1, PrettyBlocks vous proposer d'ajouter des margins et paddings directement sur vos Blocks. Sur un range de 1-12, les classes mt-1 ... mt-12, pt-1...pt-12 etc... sont importées automatiquement via Tailwind CSS.

Vous pouvez utilisez votre propres styles, si vous ne souhaitez pas importer le CSS Core de PrettyBlocks (dans la gestion des Settings) Vous trouverez les classes importées dans ce lien