Différences entre versions de « Listes de prêts et réservation responsive »
De WIKI-BOKEH
(Page créée avec « 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 @media screen and (ma... ») |
|||
Ligne 1 : | Ligne 1 : | ||
− | |||
− | |||
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 | 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 | ||
− | @media screen and (max-device-width: 1024px) { | + | <pre>@media screen and (max-device-width: 1024px) { |
/*responsive tableaux compte lecteur*/ | /*responsive tableaux compte lecteur*/ | ||
Ligne 45 : | Ligne 43 : | ||
} | } | ||
+ | </pre> | ||
[[Catégorie:Documentation_utilisateur]] | [[Catégorie:Documentation_utilisateur]] |
Version du 4 septembre 2019 à 15:42
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
@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; } }