messages.css

Same filename in this branch
  1. 11.x core/misc/dialog/off-canvas/css/messages.css
  2. 11.x core/themes/olivero/css/components/messages.css
  3. 11.x core/themes/claro/css/components/messages.css
  4. 11.x core/themes/starterkit_theme/css/components/messages.css
Same filename in other branches
  1. 9 core/profiles/demo_umami/themes/umami/css/components/messages/messages.css
  2. 9 core/themes/olivero/css/components/messages.css
  3. 9 core/themes/seven/css/components/messages.css
  4. 9 core/themes/seven/css/classy/components/messages.css
  5. 9 core/themes/claro/css/components/messages.css
  6. 9 core/themes/bartik/css/components/messages.css
  7. 9 core/themes/bartik/css/classy/components/messages.css
  8. 9 core/themes/starterkit_theme/css/components/messages.css
  9. 9 core/themes/classy/css/components/messages.css
  10. 8.9.x core/profiles/demo_umami/themes/umami/css/components/messages/messages.css
  11. 8.9.x core/themes/seven/css/components/messages.css
  12. 8.9.x core/themes/seven/css/classy/components/messages.css
  13. 8.9.x core/themes/claro/css/components/messages.css
  14. 8.9.x core/themes/bartik/css/components/messages.css
  15. 8.9.x core/themes/bartik/css/classy/components/messages.css
  16. 8.9.x core/themes/classy/css/components/messages.css
  17. 10 core/profiles/demo_umami/themes/umami/css/components/messages/messages.css
  18. 10 core/misc/dialog/off-canvas/css/messages.css
  19. 10 core/themes/olivero/css/components/messages.css
  20. 10 core/themes/claro/css/components/messages.css
  21. 10 core/themes/starterkit_theme/css/components/messages.css

Styles for system messages.

File

core/profiles/demo_umami/themes/umami/css/components/messages/messages.css

View source
  1. /**
  2. * @file
  3. * Styles for system messages.
  4. */
  5. .messages {
  6. padding: 20px;
  7. word-wrap: break-word;
  8. color: inherit;
  9. overflow-wrap: break-word;
  10. }
  11. .messages__content {
  12. padding-inline-start: 24px;
  13. background-image: var(--umami-message-icon);
  14. background-repeat: no-repeat;
  15. background-position-x: left;
  16. background-position-y: center;
  17. }
  18. [dir="rtl"] .messages__content {
  19. background-position-x: right;
  20. }
  21. .messages--status {
  22. --umami-message-icon: url(/core/misc/icons/73b355/check.svg);
  23. border: 1px solid #cbdebc;
  24. background-color: #e6eee0;
  25. }
  26. .messages--warning {
  27. --umami-message-icon: url(/core/misc/icons/e29700/warning.svg);
  28. border: 1px solid #fae2a4;
  29. background-color: #fcf1d4;
  30. }
  31. .messages--error {
  32. --umami-message-icon: url(/core/misc/icons/e32700/error.svg);
  33. border: 1px solid #f8c8d5;
  34. background-color: #f9e6eb;
  35. }
  36. .messages--error .error {
  37. color: inherit;
  38. }
  39. .messages a {
  40. color: #cc2a00;
  41. }
  42. .messages__list {
  43. margin: 0;
  44. padding: 0;
  45. list-style: none;
  46. }
  47. .messages__item + .messages__item {
  48. margin-top: 0.769em;
  49. }
  50. .messages__wrapper {
  51. display: grid;
  52. gap: 1.538em;
  53. }

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