gin-pager.css

Same filename and directory in other branches
  1. 11.x core/themes/default_admin/migration/css/base/gin-pager.css
/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */

.pager__link {
  color: var(--gin-color-text);
  background-color: transparent;
}

.pager__link.is-active,
.pager__item--current {
  color: var(--gin-bg-app);
}

.pager__link:hover,
.pager__link.is-active:hover {
  color: var(--gin-color-button-text);
  background: var(--gin-color-primary-hover);
}

.pager__item--first .pager__link::before {
  mask-image: var(--admin-icon-first);
}

.pager__item--previous .pager__link::before {
  mask-image: var(--admin-icon-prev);
}

.pager__item--next .pager__link::after {
  mask-image: var(--admin-icon-next);
}

.pager__item--last .pager__link::after {
  mask-image: var(--admin-icon-last);
}

.pager__item--first .pager__link,
.pager__item--previous .pager__link,
.pager__item--next .pager__link,
.pager__item--last .pager__link {
  &::before,
  &::after {
    background: var(--gin-color-text-light);
  }

  &:hover::before,
  &:hover::after {
    background: var(--gin-bg-app);
  }
}

.pager__link.is-active,
.pager__item--current {
  background-color: var(--gin-color-primary);
}

File

View on git.drupalcode.org

core/themes/default_admin/migration/css/base/gin-pager.css

View source 
  1. /*

  2.  * DO NOT EDIT THIS FILE.

  3.  * See the following change record for more information,

  4.  * https://www.drupal.org/node/3084859

  5.  * @preserve

  6.  */

  7. 

  8. .pager__link {

  9.   color: var(--gin-color-text);

  10.   background-color: transparent;

  11. }

  12. 

  13. .pager__link.is-active,

  14. .pager__item--current {

  15.   color: var(--gin-bg-app);

  16. }

  17. 

  18. .pager__link:hover,

  19. .pager__link.is-active:hover {

  20.   color: var(--gin-color-button-text);

  21.   background: var(--gin-color-primary-hover);

  22. }

  23. 

  24. .pager__item--first .pager__link::before {

  25.   mask-image: var(--admin-icon-first);

  26. }

  27. 

  28. .pager__item--previous .pager__link::before {

  29.   mask-image: var(--admin-icon-prev);

  30. }

  31. 

  32. .pager__item--next .pager__link::after {

  33.   mask-image: var(--admin-icon-next);

  34. }

  35. 

  36. .pager__item--last .pager__link::after {

  37.   mask-image: var(--admin-icon-last);

  38. }

  39. 

  40. .pager__item--first .pager__link,

  41. .pager__item--previous .pager__link,

  42. .pager__item--next .pager__link,

  43. .pager__item--last .pager__link {

  44.   &::before,

  45.   &::after {

  46.     background: var(--gin-color-text-light);

  47.   }

  48. 

  49.   &:hover::before,

  50.   &:hover::after {

  51.     background: var(--gin-bg-app);

  52.   }

  53. }

  54. 

  55. .pager__link.is-active,

  56. .pager__item--current {

  57.   background-color: var(--gin-color-primary);

  58. }

Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.