Discussion :

[Ushuango]

Bonjour,

j'ai utilisé le bundle Knp_paginator pour paginer une liste d'utilisateur lorsqu'elle s'affiche.
Sur un écran, j'ai ma pagination:



Mais sur le plus petit portable ( 320 px de largeur ) ça donne:



Donc , pour l'instant, j'ai changé dans les paramètres de configuration de knp_paginator: page_range: 5 mis à 1
Avec rajout de propriétés css dans l'élément ul ça fait le travail...ça passe sans être coupé !
Mais, à tout hasard, comment faire pour changer ce paramètre uniquement lorsque l'écran fait une taille de 320 pixels ??


Je suppose qu'il faut passer par le controller, mais je ne sais pas comment atteindre cette variable !
Et bien sûr , il faudra aussi savoir quand l'écran a une taille de 320 pixels maximum.

Bonne fin de journée
Laurent.

[Ushuango]

Je précise , au cas où:
page_range: 1 permet de ne pas avoir les chiffres de 1 à 5 dans la pagination.
Au lieu de ça on se retrouve avec



c'est plus petit et ça passe mieux en version portable...

Donc modifier ce paramètre lorsqu'on est sur un écran de 320 pixels ?.....?

sinon, je le laisse à 1, ça ira très bien , mais ça fait un peu moche !

[mathieu]

peut être que ce serait plus accessible si les liens "suivant" et "précédent" étaient sur des lignes différentes.
suivant la façon dont est construit le code html, cela pourra peut-être se faire uniquement en css.

[Ushuango]

Oui, on peut essayer ça:

- une ligne précédent
- une ligne chiffre de pages
- une ligne suivant

Mais il faut que ça reste joli à voir: pour montrer que j'ai tenté de gérer le responsive à ce niveau
Je vais aller bidouiller le bootstrap, ça devrait le faire !!

[Ushuango]

Après bidouillage et calculs:

page_range: 3 et arrangement du fichier twig pour la pagination ( fourni par Knp_paginator ): un li>ul pour les chiffres,
et des d-flex , flex-sm-column et flex-row bien placés dans les ul.

Il faut surtout bien repérer où sont traités les "Précédent" et "Suivant" ainsi que les chiffres de page dans le twig et ça passe en 320 pixels:



Je vais m'arrêter là !!