Listes de prêts et réservation responsive
De WIKI-BOKEH
Révision datée du 4 septembre 2019 à 15:48 par Jcgachod (discussion | contributions)
Voici le code qui permet de transformer les tableaux de la zone "Mon compte" en liste afin d'avoir un meilleur affichage sur les terminaux mobiles Avant ajout des lignes CSS
@media screen and (max-device-width: 1024px) { /*responsive tableaux compte lecteur*/ /*démentellement du tableau et centrage des textes*/ #borrower_loans tbody, table.reservations tbody, .tablesorter-default tbody { display: grid; text-align:center; } /* transformation des colonnes du tableau en lignes*/ #borrower_loans tbody tr, table.reservations tbody tr, .tablesorter-default tbody tr { width: auto; display: inline-grid; } /*centrer le nom de l'auteur dans liste réservation*/ table.reservations td:nth-child(5) { text-align: center; } /*centrer les images dans les fiches de prêts et réservations*/ #borrower_loans tbody img, table.reservations tbody img, #borrower_loans tbody .nothumbnail_wrapper, table.reservations tbody .nothumbnail_wrapper { width: 50% !important; margin: 0 auto; } /* désactive la règle ci dessus sur l'image de désinscription*/ table.reservations tbody a img { width:auto!important; } /*masquer les entêtes de tableaux*/ .tablesorter-headerRow { display: none; } /*centrer nom de l'emprunteur et réservataire*/ table.loans td:first-child, table.reservations td:first-child { width: auto; } }