Lorsque vous utilisez des designs par défaut, le système appliquera différents points de rupture lors du passage du mobile à la tablette et à l'ordinateur de bureau. Les points de rupture sont les suivants :

Minimal

• Taille d'écran inférieure à 321 px de largeur ou 321 px de hauteur
• La taille de la police est réglée sur 0,38.
• La hauteur de ligne est réglée sur 1,05 em
• Le remplissage de la boîte est réduit à 5 px
• Taille d'écran inférieure à 450×450 : la boîte est redimensionnée à 100 % x 100 %.

Mobile: Portrait

• Taille d'écran inférieure à 480 px de largeur et 926 px de hauteur
• Largeur de la boîte étendue à 100 % et hauteur minimale de 300 px
• Les boutons sont placés sous le contenu
• Le logo est masqué
• Les espaces de remplissage sont réduits
• Remarque : si la taille de l'écran est inférieure à 414×736 ou 736×414 (par exemple, iPhone 6/7/8), le remplissage de la zone est réduit

Mobile : mode paysage

• Taille d'écran inférieure à 926 px de largeur et 480 px de hauteur
• Largeur de la boîte étendue à 100 % et hauteur minimale de 150 px
• Les boutons sont placés à droite du contenu et ont une largeur de 250 px.
• Le logo est masqué
• Les espaces de remplissage sont réduits
• Remarque : si la taille de l'écran est inférieure à 414×736 ou 736×414 (par exemple, iPhone 6/7/8), le remplissage de la boîte est réduit

Ordinateur de bureau et tablette

• Taille d'écran supérieure à 926×480 ou 480×926

Requêtes de médias supplémentaires

Calques positionnés comme « bas/pleine largeur », « haut/pleine largeur » et « Pousser vers le bas » :

• Largeur maximale 1500px : le contenu (titre, texte et objectifs) de la couche de consentement sera réduit à « 100 % – 450px » afin d'afficher les boutons à droite du contenu.
• Largeur maximale 1200px : le contenu (titre, texte et objectifs) de la couche de consentement sera réduit à « 100 % – 250px » afin d'afficher les boutons à droite du contenu. Ceci
• Largeur maximale 800 px : le contenu (titre, texte et objectifs) de la couche de consentement sera étendu à 100 % afin d'afficher les boutons sous le contenu.

Calques positionnés comme suit : « bas/droite », « bas/centre », « milieu/centre » et « haut/centre » :

• Largeur maximale 600 px : la boîte est redimensionnée à 100 % de la largeur.

Calques positionnés en « milieu/centre » :

• Hauteur maximale de 600 px et largeur minimale de 926 px : la boîte est redimensionnée à sa hauteur maximale et le contenu est défini en flex avec overflow auto afin d'éviter que la boîte ne soit trop haute pour la fenêtre.

Calques positionnés sur « droite/hauteur totale » et « gauche/hauteur totale » :

• Largeur maximale 400 px : la boîte est redimensionnée à 100 % de la largeur.

Page des paramètres personnalisés :

• Largeur maximale 570 px : la navigation est déplacée en haut de la page afin de laisser suffisamment d'espace au contenu