Early Bird Registration for DrupalCon Portland 2024 is open! Register by 23:59 PST on 31 March 2024, to get $100 off your ticket.
Follow-up to #2489394: Refactor the Search module markup to be inline with our standards.
Problem/Motivation
The parent issue updated the search result markup (search-result.html.twig) in Classy to follow BEM standards:
+<h3{{ title_attributes.addClass('search-result__title') }}>
<a href="{{ url }}">{{ title }}</a>
</h3>
{{ title_suffix }}
<div class="search-result__snippet-info">
{% if snippet %}
<p{{ content_attributes.addClass('search-result__snippet') }}>{{ snippet }}</p>
{% endif %}
{% if info %}
<p class="search-result__info">{{ info }}</p>
{% endif %}
</div>
The class names were not great before, and even with the BEMmification could be improved and made less ambiguous.
Beta phase evaluation
Issue category | Task because it is a markup improvement. |
---|---|
Unfrozen changes | Unfrozen because it only changes CSS and markup |
Disruption | Will affect any contributed themes deriving from Classy that include CSS for search result items and do not have their own template file. Should not affect anything else. |
Proposed resolution
Discuss some alternative class names to replace/partially replace these:
search-result__snippet-info
search-result__snippet
search-result__info
Remaining tasks
Discuss
Patch
Patch review
Visual regression tests
User interface changes
n/a
API changes
n/a
Comments
Comment #2
damondt CreditAttribution: damondt as a volunteer commentedThe most succinct BEM guide I found is here. For those who are unfamiliar.