update.pcss.css

Same filename and directory in other branches
  1. 11.x core/themes/default_admin/css/components/update.pcss.css
/*
 * @file
 * Styles for Available Updates report.
 */

.project-update__version {
  padding-block: 0;
}

.project-update__version-links {
  padding-inline-end: 0;
}

.project-update__details {
  padding: 0;
  color: var(--gin-color-text-light);
  font-size: var(--gin-font-size-s);
}

.project-update__status {
  .gin-status-icon {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    mask-position: center right;
    mask-repeat: no-repeat;
    mask-size: 100% 100%;

    &:dir(rtl) {
      mask-position: center left;
    }

    img {
      display: none;
    }
  }
}

.project-update__status--security-error {
  color: var(--gin-color-danger);
}

.color-success,
tr.color-success,
.color-checked,
.drupal-upgrade-status-summary-form tr.no-known-error {
  border-inline-start: var(--gin-border-xs) solid var(--gin-color-green);
  background-color: transparent;

  &:hover,
  &:active,
  &:focus {
    background-color: var(--gin-bg-green-light);
  }
}

.color-warning,
tr.color-warning,
.upgrade-status-next-step-remove tr,
.drupal-upgrade-status-summary-form tr.known-warnings {
  border-inline-start: var(--gin-border-xs) solid var(--gin-color-warning);
  background-color: transparent;

  &:hover,
  &:active,
  &:focus {
    background-color: var(--gin-bg-warning-light);

    .gin--dark-mode & {
      color: var(--gin-color-warning);
    }
  }
}

.color-error,
tr.color-error,
.drupal-upgrade-status-summary-form tr.known-errors {
  border-inline-start: var(--gin-border-xs) solid var(--gin-color-danger);
  background-color: transparent;

  &:hover,
  &:active,
  &:focus {
    background-color: var(--gin-bg-danger-light);

    .gin--dark-mode & {
      color: var(--gin-color-danger);
    }
  }
}

.color-success,
.color-warning,
.color-error,
.color-checked {
  box-sizing: border-box;
  color: var(--gin-color-text);
}

.update {
  margin: 0;
  border: 0 none;

  tbody {
    tr:last-child {
      border-block-end: 0 none;
    }
  }
}

#update-status > p {
  margin-block-end: var(--gin-spacing-xl);
}

File

View on git.drupalcode.org

core/themes/default_admin/css/components/update.pcss.css

View source 
  1. /*

  2.  * @file

  3.  * Styles for Available Updates report.

  4.  */

  5. 

  6. .project-update__version {

  7.   padding-block: 0;

  8. }

  9. 

  10. .project-update__version-links {

  11.   padding-inline-end: 0;

  12. }

  13. 

  14. .project-update__details {

  15.   padding: 0;

  16.   color: var(--gin-color-text-light);

  17.   font-size: var(--gin-font-size-s);

  18. }

  19. 

  20. .project-update__status {

  21.   .gin-status-icon {

  22.     display: inline-block;

  23.     width: 1rem;

  24.     height: 1rem;

  25.     mask-position: center right;

  26.     mask-repeat: no-repeat;

  27.     mask-size: 100% 100%;

  28. 

  29.     &:dir(rtl) {

  30.       mask-position: center left;

  31.     }

  32. 

  33.     img {

  34.       display: none;

  35.     }

  36.   }

  37. }

  38. 

  39. .project-update__status--security-error {

  40.   color: var(--gin-color-danger);

  41. }

  42. 

  43. .color-success,

  44. tr.color-success,

  45. .color-checked,

  46. .drupal-upgrade-status-summary-form tr.no-known-error {

  47.   border-inline-start: var(--gin-border-xs) solid var(--gin-color-green);

  48.   background-color: transparent;

  49. 

  50.   &:hover,

  51.   &:active,

  52.   &:focus {

  53.     background-color: var(--gin-bg-green-light);

  54.   }

  55. }

  56. 

  57. .color-warning,

  58. tr.color-warning,

  59. .upgrade-status-next-step-remove tr,

  60. .drupal-upgrade-status-summary-form tr.known-warnings {

  61.   border-inline-start: var(--gin-border-xs) solid var(--gin-color-warning);

  62.   background-color: transparent;

  63. 

  64.   &:hover,

  65.   &:active,

  66.   &:focus {

  67.     background-color: var(--gin-bg-warning-light);

  68. 

  69.     .gin--dark-mode 
  70.   }

  71. }

  72. 

  73. .color-error,

  74. tr.color-error,

  75. .drupal-upgrade-status-summary-form tr.known-errors {

  76.   border-inline-start: var(--gin-border-xs) solid var(--gin-color-danger);

  77.   background-color: transparent;

  78. 

  79.   &:hover,

  80.   &:active,

  81.   &:focus {

  82.     background-color: var(--gin-bg-danger-light);

  83. 

  84.     .gin--dark-mode 
  85.   }

  86. }

  87. 

  88. .color-success,

  89. .color-warning,

  90. .color-error,

  91. .color-checked {

  92.   box-sizing: border-box;

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

  94. }

  95. 

  96. .update {

  97.   margin: 0;

  98.   border: 0 none;

  99. 

  100.   tbody {

  101.     tr:last-child {

  102.       border-block-end: 0 none;

  103.     }

  104.   }

  105. }

  106. 

  107. #update-status > p {

  108.   margin-block-end: var(--gin-spacing-xl);

  109. }

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