-131 Removals
+43 Additions

Created by:phpboost

/* -------------------------------------- /* --------------------------------------
table.css table.css
Contient les elements pour l'affichage des tableaux HTML et responsive. Contient les elements pour l'affichage des tableaux HTML et responsive.
- Affichage des tableaux basic - Affichage des tableaux basic
- Table responsive basictable.js - Table responsive basictable.js
--------------------------------------*/ -------------------------------------- */
/* -- Affichage des tableaux basic -- */ /* -- Affichage des tableaux basic -- */
/* --------------------------------- */ /* ---------------------------------- */
table { table {
margin: 8px 0; margin: 0.618em 0;
padding: 0; padding: 0;
width: 100%; width: 100%;
border-spacing: 0; border-spacing: 0;
border-width: 1px;
border-style: solid;
border-color: transparent;
} }
/* --- Entete du tableau --- */ /* --- Entete du tableau --- */
table caption { table caption {
margin: 5px 0 5px 20px; margin: 0.456em 0 0.456em 1.482em;
border-bottom: 1px solid #DDDDDD; border-width: 0 0 1px;
color: #777777; border-style: solid;
font-size: 13px; border-color: transparent;
font-size: 0.8em;
text-align: left; text-align: left;
} }
table thead th, table thead th,
.table-head { .table-head {
padding: 8px; padding: 0.228em;
background-color: #366493; font-size: 0.9em;
color: #F1F1F1;
font-size: 1.1em;
text-align: center; text-align: center;
font-weight: normal; font-weight: normal;
} }
table thead th a { color: #EEEEEE; }
table thead th a:hover { color: #FFFFFF; }
/* --- Contenu du tableau --- */ /* --- Contenu du tableau --- */
table tbody td, table tbody td,
.table-element-container { .table-element-container {
padding: 8px; padding: 0.228em;
background-color: #F1F1F1; font-size: 0.9em;
text-align: center;
border-width: 0 0 1px;
border-style: solid; border-style: solid;
border-color: #DDDDDD; border-color: transparent;
border-width: 1px 0 0 1px;
color: #777777;
text-align: center;
} }
.table-element-container a { table.bt tbody tr td {
color: #777777; border-bottom-width: 0;
} }
tr:nth-child(even) td { table.bt tbody tr td:last-child {
background-color: #FAFAFA; border-width: 0 0 1px;
}
table tbody tr:last-child td {
border-bottom: 1px solid #DDDDDD;
}
table.bt tbody tr:last-child td {
border-bottom: none;
}
table.bt tbody tr:last-child td:last-child {
border-bottom: 1px solid #DDDDDD;
}
table tbody tr td:last-child {
border-right: 1px solid #DDDDDD;
}
table tbody tr.no-separator td {
border-top: none;
}
table tbody tr td.no-separator {
border-left: none;
}
table tbody tr td.no-separator:first-child {
border-left: 1px solid #DDDDDD;
} }
/* --- Pied de tableau --- */ /* --- Pied de tableau --- */
table tfoot tr th { table tfoot tr td {
padding: 8px; padding: 0.228em;
background-color: #F0F0F0; font-size: 0.9em;
border-bottom: 1px solid #DDDDDD;
color: #AAAAAA;
}
table tfoot tr th:first-child {
border-left: 1px solid #DDDDDD;
} }
table tfoot tr th:last-child { table tfoot tr td:only-child {
border-right: 1px solid #DDDDDD;
}
table tfoot tr th:only-child {
text-align: right; text-align: right;
} }
table tfoot tr th * { table tfoot tr td * {
vertical-align: middle; vertical-align: middle;
} }
table tfoot tr th a { table tfoot tr td select {
color: #676A74; padding: 0.1618 0.309em;
} }
table tfoot tr th select { @media (min-width: 769px) {
padding: 2px 5px; table thead th,
table tbody td,
table tfoot tr td {
padding: 0.309em;
font-size: 1em;
}
} }
/* --- Patch thead tableaux formates --- */ /* --- Patch thead tableaux formates --- */
table.formatter-table th.formatter-table-head { table.formatter-table th.formatter-table-head {
padding: 8px; padding: 0.618em;
background-color: #444444; font-size: 1.482em;
color: #F1F1F1;
font-size: 1.4em;
text-align: center; text-align: center;
font-weight: normal; font-weight: normal;
} }
table.formatter-table th.formatter-table-head a { color: #F1F1F1; }
table.formatter-table th.formatter-table-head a:hover { color: #FAFAFA; }
table.formatter-table th.formatter-table-head p { table.formatter-table th.formatter-table-head p {
margin-bottom: 0; margin-bottom: 0;
} }
/* --- Taille des colonnes --- */ /* --- Taille des colonnes --- */
.col-smaller { width: 3em; } .col-smaller { width: 3em; }
.col-small { width: 6em; } .col-small { width: 6em; }
.col-large { width: 9em; } .col-large { width: 9em; }
.col-larger { width: 12em; } .col-larger { width: 12em; }
.col-xlarge { width: 15em; } .col-xlarge { width: 15em; }
/* --- mini tableaux --- */
table.mini th,
table.mini td {
padding: 3px 1px;
font-size: 11px;
}
@media (max-width: 768px) {
table.mini th,
table.mini td {
padding: 7px 1px;
}
}
table.mini th a,
table.mini td a {
font-size: 11px;
}
/* --- Pagination footer tableaux --- */
table tfoot nav.pagination a {
color: #777777;
text-decoration: none;
padding: 3px 3px;
}
table tfoot nav.pagination a span.current-page {
color: #555555;
text-decoration: none;
}
/* --- Affichage des tableaux responsive sur les petits ecrans --- */
@media (max-width: 768px) {
table thead th,
table tbody td,
table tfoot tr th {
padding: 4px;
font-size: 0.9em;
}
}
/* -- Table responsive basictable.js -- */ /* -- Table responsive basictable.js -- */
/* ------------------------------------ */ /* ------------------------------------ */
table.bt thead th { table.bt thead th {
display: none; display: none;
} }
table.bt thead th:first-child{ table.bt thead th:first-child{
display: block; display: block;
} }
table.bt tbody td { table.bt tbody td {
display: block; display: block;
width: 100%; width: 100%;
border-right: 1px solid #DDDDDD;
text-align: left; text-align: left;
vertical-align: top; vertical-align: top;
} }
table.bt tbody td.no-separator {
border-left: 1px solid #DDDDDD;
}
table.bt tbody td:before { table.bt tbody td:before {
display: inline-block; display: inline-block;
width: 35%; width: 35%;
content: attr(data-th) " "; content: attr(data-th) " ";
font-weight: bold; font-weight: bold;
} }
table.bt tbody td.bt-hide { table.bt tbody td.bt-hide {
display: none; display: none;
} }
table.bt tbody td .bt-content { table.bt tbody td .bt-content {
display: inline-block; display: inline-block;
padding-left: 6px; padding-left: 0.309em;
max-width: 100%; max-width: 100%;
vertical-align: top; vertical-align: top;
} }
.bt-wrapper.active { .bt-wrapper.active {
max-height: 310px; max-height: 310px;
overflow: auto; overflow: auto;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
} }
Editor
Original Text
Changed Text
Recommended videos