system-status-report-general-info.css

Same filename in this branch
  1. main core/themes/stable9/css/system/components/system-status-report-general-info.css
  2. main core/themes/claro/css/components/system-status-report-general-info.css
  3. main core/modules/system/css/components/system-status-report-general-info.css
  4. main core/themes/admin/css/components/system-status-report-general-info.css
Same filename and directory in other branches
  1. 10 core/themes/stable9/css/system/components/system-status-report-general-info.css
  2. 10 core/themes/claro/css/components/system-status-report-general-info.css
  3. 11.x core/themes/stable9/css/system/components/system-status-report-general-info.css
  4. 11.x core/themes/claro/css/components/system-status-report-general-info.css
  5. 11.x core/modules/system/css/components/system-status-report-general-info.css
  6. 10 core/modules/system/css/components/system-status-report-general-info.css
  7. 9 core/themes/stable9/css/system/components/system-status-report-general-info.css
  8. 9 core/themes/seven/css/components/system-status-report-general-info.css
  9. 9 core/themes/claro/css/components/system-status-report-general-info.css
  10. 9 core/themes/stable/css/system/components/system-status-report-general-info.css
  11. 9 core/modules/system/css/components/system-status-report-general-info.css
  12. 8.9.x core/themes/seven/css/components/system-status-report-general-info.css
  13. 8.9.x core/themes/claro/css/components/system-status-report-general-info.css
  14. 8.9.x core/themes/stable/css/system/components/system-status-report-general-info.css
  15. 8.9.x core/modules/system/css/components/system-status-report-general-info.css
  16. 11.x core/themes/admin/css/components/system-status-report-general-info.css
  17. 11.x core/themes/default_admin/css/components/system-status-report-general-info.css

Default Admin styles for the System Status general info.

File

core/themes/default_admin/css/components/system-status-report-general-info.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. * @file
  9. * Default Admin styles for the System Status general info.
  10. */
  11. .system-status-general-info {
  12. padding: var(--admin-space-m);
  13. h3 + .divider,
  14. .divider:last-child {
  15. display: none;
  16. }
  17. @media screen and (max-width: 48em) {
  18. margin-block-start: 1.5625rem;
  19. border-block-start: 0;
  20. }
  21. }
  22. .system-status-general-info__header {
  23. padding: var(--admin-space-m) var(--admin-space-l);
  24. text-transform: none;
  25. color: var(--admin-color-primary-active);
  26. border: 0 none;
  27. border-radius: var(--admin-radius-m);
  28. background: var(--admin-color-bg-header);
  29. font-size: var(--admin-font-size-l);
  30. font-weight: var(--admin-font-weight-bold);
  31. margin-block: 0 var(--admin-space-xs);
  32. margin-inline: 0;
  33. @media screen and (max-width: 48em) {
  34. display: none;
  35. }
  36. }
  37. .system-status-general-info__item.card {
  38. display: block;
  39. box-sizing: border-box;
  40. margin-block-end: var(--admin-space-l);
  41. padding: var(--admin-space-m);
  42. @media screen and (min-width: 48em) {
  43. width: 32%;
  44. &:last-of-type {
  45. margin-inline-start: 2%;
  46. }
  47. }
  48. }
  49. .system-status-general-info__item-icon {
  50. display: inline-block;
  51. width: 2.625rem;
  52. height: 2.625rem;
  53. vertical-align: top;
  54. &::before {
  55. display: block;
  56. width: 100%;
  57. height: 100%;
  58. content: "";
  59. border-radius: 2.625rem;
  60. background-color: var(--admin-color-primary);
  61. mask-repeat: no-repeat;
  62. mask-position: center center;
  63. mask-size: 2rem 2rem;
  64. }
  65. }
  66. .system-status-general-info__item-icon--drupal::before {
  67. mask-image: var(--admin-icon-drupal);
  68. }
  69. .system-status-general-info__item-icon--clock::before {
  70. mask-image: var(--admin-icon-clock);
  71. }
  72. .system-status-general-info__item-icon--server::before {
  73. mask-image: var(--admin-icon-server);
  74. }
  75. .system-status-general-info__item-icon--php::before {
  76. mask-image: var(--admin-icon-php);
  77. }
  78. .system-status-general-info__item-icon--database::before {
  79. mask-image: var(--admin-icon-database);
  80. }
  81. .system-status-general-info__item-details {
  82. position: relative;
  83. display: inline-block;
  84. box-sizing: border-box;
  85. width: calc(100% - 3.75rem);
  86. padding-inline-start: 0.625rem;
  87. font-size: var(--admin-font-size-s);
  88. }
  89. .system-status-general-info__item-title {
  90. margin: 0 0 0.5rem;
  91. color: var(--admin-color-text-loud);
  92. font-size: var(--admin-font-size-m);
  93. font-weight: var(--admin-font-weight-semibold);
  94. }
  95. .system-status-general-info__sub-item-title {
  96. margin: 0.875rem 0 0;
  97. font-size: 0.875rem;
  98. font-weight: var(--admin-font-weight-bold);
  99. &::after {
  100. content: ":\00a0";
  101. }
  102. }
  103. .system-status-general-info__sub-item__title {
  104. font-weight: bold;
  105. }
  106. .system-status-general-info__sub-item__value {
  107. display: block;
  108. }
  109. .system-status-general-info__run-cron {
  110. margin: 1em 0 0;
  111. &.button {
  112. margin: 0;
  113. }
  114. }
  115. .system-status-general-info__items {
  116. margin-block: var(--admin-space-m) 0;
  117. margin-inline: 0;
  118. border-block-end: 0 none;
  119. @media screen and (min-width: 48em) {
  120. display: flex;
  121. flex-wrap: wrap;
  122. justify-content: space-between;
  123. &::after {
  124. flex: auto;
  125. content: "";
  126. }
  127. }
  128. }

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