Limiter l’affichage d’une molécule à certaines tailles d'écran

Il peut être utile de limiter l’affichage de molécule à certains dispositifs en fonction de l'écran utilisé par l'internaute. À partir de la version 1.1.1, Atomic permet une gestion d'écran, à travers la molécule “Container”, en considérant 3 types de dimension :

Desktop - appareils de taille moyenne ou large (992 pixels et plus)

Tablettes - petits appareils (entre 768px et 992px)

Mobiles - très petits appareils (moins de 768 pixels)

Exemples d’utilisation :

• Vous pouvez avoir besoin d’afficher une molécule uniquement sur les appareils mobiles (tablettes et smartphones)

• Vous avez besoin d’ajouter une bannière uniquement aux internautes qui visitent le site avec un ordinateur “desktop”.

La molécule “Container” est souvent utilisée pour afficher certains éléments en mode “pleine écran” ou à l'inverse - avoir une largeur limitée à certains éléments. Pour limiter l'affichage seulement à certains appareils, il suffira donc de créer un conteneur et spécifier l’option “visibilité” sur les appareils souhaités.