breadcrumb.css

Same filename in this branch
  1. 11.x core/profiles/demo_umami/themes/umami/css/classy/components/breadcrumb.css
  2. 11.x core/themes/olivero/css/components/breadcrumb.css
  3. 11.x core/themes/claro/css/layout/breadcrumb.css
  4. 11.x core/themes/starterkit_theme/css/components/breadcrumb.css
Same filename and directory in other branches
  1. 9 core/profiles/demo_umami/themes/umami/css/classy/components/breadcrumb.css
  2. 9 core/themes/olivero/css/components/breadcrumb.css
  3. 9 core/themes/seven/css/components/breadcrumb.css
  4. 9 core/themes/seven/css/classy/components/breadcrumb.css
  5. 9 core/themes/claro/css/components/breadcrumb.css
  6. 9 core/themes/claro/css/layout/breadcrumb.css
  7. 9 core/themes/bartik/css/components/breadcrumb.css
  8. 9 core/themes/bartik/css/classy/components/breadcrumb.css
  9. 9 core/themes/starterkit_theme/css/components/breadcrumb.css
  10. 9 core/themes/classy/css/components/breadcrumb.css
  11. 8.9.x core/profiles/demo_umami/themes/umami/css/classy/components/breadcrumb.css
  12. 8.9.x core/themes/seven/css/components/breadcrumb.css
  13. 8.9.x core/themes/seven/css/classy/components/breadcrumb.css
  14. 8.9.x core/themes/claro/css/components/breadcrumb.css
  15. 8.9.x core/themes/claro/css/layout/breadcrumb.css
  16. 8.9.x core/themes/bartik/css/components/breadcrumb.css
  17. 8.9.x core/themes/bartik/css/classy/components/breadcrumb.css
  18. 8.9.x core/themes/classy/css/components/breadcrumb.css
  19. 10 core/profiles/demo_umami/themes/umami/css/classy/components/breadcrumb.css
  20. 10 core/themes/olivero/css/components/breadcrumb.css
  21. 10 core/themes/claro/css/components/breadcrumb.css
  22. 10 core/themes/claro/css/layout/breadcrumb.css
  23. 10 core/themes/starterkit_theme/css/components/breadcrumb.css

Breadcrumbs.

File

core/themes/claro/css/components/breadcrumb.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. * Breadcrumbs.
  10. */
  11. .breadcrumb {
  12. padding: 0;
  13. color: var(--color-text);
  14. font-size: 0.79rem;
  15. }
  16. .breadcrumb__list,
  17. [dir="rtl"] .breadcrumb__list {
  18. margin: 0;
  19. padding: 0;
  20. list-style-type: none;
  21. }
  22. .breadcrumb__item,
  23. .breadcrumb__link {
  24. display: inline;
  25. -webkit-text-decoration: none;
  26. text-decoration: none;
  27. color: var(--color-text);
  28. font-weight: bold;
  29. }
  30. .breadcrumb__item + .breadcrumb__item::before {
  31. display: inline-block;
  32. padding: 0 0.75rem;
  33. content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='8' width='5'%3e%3cpath fill='currentColor' d='M1.207.647L.5 1.354 3.146 4 .5 6.647l.707.707L4.561 4z'/%3e%3c/svg%3e");
  34. }
  35. [dir="rtl"] :is(.breadcrumb__item + .breadcrumb__item::before) {
  36. transform: scaleX(-1);
  37. }
  38. @media (forced-colors: active) {
  39. .breadcrumb__item + .breadcrumb__item::before {
  40. width: 0.3125rem; /* Width and height of the SVG. */
  41. height: 0.5rem;
  42. content: "";
  43. background-color: canvastext;
  44. -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='8' width='5'%3e%3cpath fill='currentColor' d='M1.207.647L.5 1.354 3.146 4 .5 6.647l.707.707L4.561 4z'/%3e%3c/svg%3e");
  45. mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='8' width='5'%3e%3cpath fill='currentColor' d='M1.207.647L.5 1.354 3.146 4 .5 6.647l.707.707L4.561 4z'/%3e%3c/svg%3e");
  46. -webkit-mask-size: contain;
  47. mask-size: contain;
  48. -webkit-mask-repeat: no-repeat;
  49. mask-repeat: no-repeat;
  50. -webkit-mask-position: center;
  51. mask-position: center;
  52. }
  53. }
  54. .breadcrumb__link:hover,
  55. .breadcrumb__link:focus {
  56. -webkit-text-decoration: none;
  57. text-decoration: none;
  58. }

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