resources/src/jquery.tablesorter.styles/jquery.tablesorter.styles.less

   1 @import 'mediawiki.mixins.less';
   2
   3 /* stylelint-disable selector-class-pattern */
   4
   5 /* Table Sorting */
   6
   7 // Reserve space for table sortable controls
   8 // This selector is not perfect as it will not correctly handle cases with
   9 // merged header cells, so ensure it is removed after the JS has run by using
  10 // the :not( .jquery-tablesorter ) selector.
  11 // It will still prevent a visible jump in the majority of simpler cases.
  12 // The second selector in this rule is for after the JS has run.
  13 .client-js .sortable:not( .jquery-tablesorter ) > * > tr:first-child > th:not( .unsortable ),
  14 .jquery-tablesorter th.headerSort {
  15         background-image: url( images/sort_both.svg );
  16         cursor: pointer;
  17         background-repeat: no-repeat;
  18         background-position: center right;
  19         padding-right: 21px;
  20 }
  21
  22 .jquery-tablesorter {
  23         th.headerSortUp {
  24                 background-image: url( images/sort_up.svg );
  25         }
  26
  27         th.headerSortDown {
  28                 background-image: url( images/sort_down.svg );
  29         }
  30 }
  31
  32 /* forced night mode */
  33 html.skin-theme-clientpref-night.client-js {
  34         @media screen {
  35                 .sortable:not( .jquery-tablesorter ) > * > tr:first-child > th.headerSort,
  36                 .jquery-tablesorter th.headerSort {
  37                         background-image: url( images/sort_both_inverted.svg );
  38                 }
  39
  40                 .jquery-tablesorter {
  41                         th.headerSortUp {
  42                                 background-image: url( images/sort_up_inverted.svg );
  43                         }
  44
  45                         th.headerSortDown {
  46                                 background-image: url( images/sort_down_inverted.svg );
  47                         }
  48                 }
  49         }
  50 }
  51
  52 /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
  53 @media screen and ( prefers-color-scheme: dark ) {
  54         /* automatic mode */
  55         html.skin-theme-clientpref-os.client-js {
  56                 .sortable:not( .jquery-tablesorter ) > * > tr:first-child > th.headerSort,
  57                 .jquery-tablesorter th.headerSort {
  58                         background-image: url( images/sort_both_inverted.svg );
  59                 }
  60
  61                 .jquery-tablesorter {
  62                         th.headerSortUp {
  63                                 background-image: url( images/sort_up_inverted.svg );
  64                         }
  65
  66                         th.headerSortDown {
  67                                 background-image: url( images/sort_down_inverted.svg );
  68                         }
  69                 }
  70         }
  71 }