search-results.css

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

Search results specific styles.

File

core/themes/olivero/css/components/search-results.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. * Search results specific styles.
  10. */
  11. .search-results {
  12. margin-block-end: var(--sp2);
  13. padding-block: 0;
  14. padding-inline-start: 0;
  15. padding-inline-end: 0;
  16. list-style: none;
  17. }
  18. @media (min-width: 43.75rem) {
  19. .search-results {
  20. margin-block-end: var(--sp3);
  21. }
  22. }
  23. .search-result__title {
  24. margin-block: 0;
  25. margin-inline-start: 0;
  26. margin-inline-end: 0;
  27. color: var(--color-text-neutral-loud);
  28. font-size: 1.25rem;
  29. line-height: var(--line-height-base);
  30. }
  31. .search-result__title a {
  32. padding-block-end: 0.1875rem;
  33. transition:
  34. background-size 0.2s,
  35. color 0.2s;
  36. -webkit-text-decoration: none;
  37. text-decoration: none;
  38. background-color: transparent;
  39. background-image: linear-gradient(var(--color--primary-50), var(--color--primary-50)); /* Two values are needed for IE11 support. */
  40. background-repeat: no-repeat;
  41. background-position: bottom left; /* LTR */
  42. background-size: 0 0.1875rem;
  43. }
  44. .search-result__title a:hover {
  45. color: var(--color-text-primary-medium);
  46. }
  47. @media (min-width: 62.5rem) {
  48. .search-result__title {
  49. margin-block-end: var(--sp1);
  50. font-size: 1.875rem;
  51. line-height: var(--sp3);
  52. }
  53. }
  54. [dir="rtl"] .search-result__title a {
  55. background-position: bottom right;
  56. }
  57. .search-result__snippet {
  58. padding-block-end: calc(var(--sp1-5) - 2px);
  59. }
  60. @media (min-width: 62.5rem) {
  61. .search-result__snippet {
  62. padding-block-end: var(--sp3);
  63. }
  64. }
  65. .search-result__meta {
  66. display: flex;
  67. align-items: center;
  68. margin-block-end: var(--sp1);
  69. color: var(--color-text-neutral-soft);
  70. font-size: 0.875rem;
  71. line-height: var(--sp);
  72. }
  73. .search-result__meta a {
  74. color: var(--color-text-primary-medium);
  75. font-weight: bold;
  76. }
  77. .search-results__item {
  78. position: relative; /* Anchor after pseudo-element. */
  79. margin-block-end: var(--sp1-5);
  80. }
  81. .search-results__item::after {
  82. position: absolute;
  83. inset-block-end: 0;
  84. width: var(--sp3);
  85. height: 0;
  86. content: "";
  87. /* Intentionally not using CSS logical properties. */
  88. border-top: solid 2px var(--color--gray-95);
  89. }
  90. .search-results__item:last-child {
  91. margin-block-end: 0;
  92. }
  93. @media (min-width: 62.5rem) {
  94. .search-results__item {
  95. margin-block-end: var(--sp3);
  96. }
  97. }
  98. .empty-search-results-text {
  99. color: var(--color-text-neutral-loud);
  100. font-family: var(--font-sans);
  101. font-size: 1.25rem;
  102. font-weight: bold;
  103. font-style: normal;
  104. line-height: var(--sp1-5);
  105. margin-block: var(--sp);
  106. }
  107. @media (min-width: 43.75rem) {
  108. .empty-search-results-text {
  109. margin-block: var(--sp2);
  110. font-size: 1.5rem;
  111. line-height: var(--sp2);
  112. }
  113. }

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