Advertisement

We're Getting Mutants in the MCU - The Loop

01:36

Par défaut, les flèches de tri sur les tables sont noires sur les wikis utilisant Hydra et blanches pour les wikis utilisant Hydradark. Si vos flèches sont difficiles à voir, utilisez le code suivant pour changer la couleur.

Utiliser des flèches blanches

/* Flèches de tri blanches sur les tables triables */
table.jquery-tablesorter th.headerSort {
    background-image: url(/skins/HydraDark/images/dark/sort_both.png?8a792) !important;
}

table.jquery-tablesorter th.headerSortUp {
    background-image: url(/skins/HydraDark/images/dark/sort_up.png?a6fb9) !important;
}

table.jquery-tablesorter th.headerSortDown {
    background-image: url(/skins/HydraDark/images/dark/sort_down.png?5514d) !important;
}

Utiliser des flèches noires

/* Flèches de tri noires sur les tables triables */
table.jquery-tablesorter th.headerSort {
    background-image: linear-gradient(transparent,transparent),url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2021%209%22%20height%3D%229%22%20width%3D%2221%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M14.5%205l-4%204-4-4zM14.5%204l-4-4-4%204z%22%2F%3E%0A%3C%2Fsvg%3E%0A) !important;
}

table.jquery-tablesorter th.headerSortUp {
    background-image: linear-gradient(transparent,transparent),url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2021%204%22%20height%3D%224%22%20width%3D%2221%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M6.5%204l4-4%204%204z%22%2F%3E%0A%3C%2Fsvg%3E%0A) !important;
}

table.jquery-tablesorter th.headerSortDown {
    background-image: linear-gradient(transparent,transparent),url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2021%204%22%20height%3D%224%22%20width%3D%2221%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M14.5%200l-4%204-4-4z%22%2F%3E%0A%3C%2Fsvg%3E%0A) !important;
}

Entêtes de table avec image ou dégradé

Si vos entêtes de table ont une image ou un dégradé, ces sélecteurs doivent également avoir ce style. Par exemple, pour des flèches blanches:

.skin-hydradark table.jquery-tablesorter th.headerSort {
    background-attachment: scroll;
    background-image: url(/skins/HydraDark/images/dark/sort_both.png?8a792), linear-gradient(to bottom, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 100%) !important;
    background-repeat: no-repeat, repeat;
    background-position: center right, center center;
    padding-right: 21px;
}

.skin-hydradark table.jquery-tablesorter th.headerSortUp {
    background-attachment: scroll;
    background-image: url(/skins/HydraDark/images/dark/sort_up.png?a6fb9), linear-gradient(to bottom, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 100%) !important;
    background-repeat: no-repeat, repeat;
    background-position: center right, center center;
    padding-right: 21px;
}

.skin-hydradark table.jquery-tablesorter th.headerSortDown {
    background-attachment: scroll;
    background-image: url(/skins/HydraDark/images/dark/sort_down.png?5514d), linear-gradient(to bottom, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 100%) !important;
    background-repeat: no-repeat, repeat;
    background-position: center right, center center;
    padding-right: 21px;
}
Sauf mention contraire, le contenu de la communauté est disponible sous licence CC BY-NC-SA 3.0.