Problem/Motivation
For phase 1 of the consensus banana, we moved all classes from preprocess into the templates. In phase 2, we will copy those templates into the new Classy theme and strip the module version of each template of all unnecessary classes. This meta issue will serve as a place to discuss the process, how we'll group the changes, how we'll group the templates in Classy, and how we will determine what classes get stripped.
Proposed resolution
Copy the templates modified in phase 1 to Classy, and remove the classes from the original template. When done, all core templates should be free of unneeded classes. See Steps and Examples for specifics.
Use this Goggle doc to keep track of the templates and organize them. https://docs.google.com/spreadsheets/d/1vc79t_bwRfMryyo63BCbHblLpJZqRSa2...
Priorities
We want to focus on the templates that matter most. Admin templates, and rarely modified/used templates are low priority. Concentrate on the following:
#2349625: Copy block templates to Classy →
#2349721: Copy node templates to Classy →
#2349759: Copy system templates to Classy →
(The system issue has been broken up into a series of child issues.)
#2349775: Remove classes from Views templates →
#2349715: Copy link templates to Classy →
#2349687: Copy image templates to Classy →
#2349683: Copy forum templates to Classy →
#2349659: Copy comment templates to Classy →
Remaining discussion
How should we group the changes into child issues?
Done. See sidebar for child issues. They are grouped by module.
How do we group the templates in Classy?
Done. They will be placed in module subdirectories of Classy's templates folder. For example, "templates/block/block.html.twig". There is an issue to discuss reorganizing after we are done.
#2349559: [meta] Discuss the organization of subfolders in Classy →
Do we move the hard-coded classes?
<div{{ attributes.addClass('aggregator-item') }}>
{{ title_prefix }}
<h3 class="feed-item-title">
Yes, we will treat these the same as the attribute classes. Remove them for the original template if they are not considered functional.
Do we copy more templates than just the ones touched in phase 1?
Copy all templates.
Steps and Examples
- Copy the templates listed in the issue to 'core/themes/classy/templates'.
- Remove any classes in the original template.
- Determine if the class being removed affects functionality or styling in core. (Check everything. JS, etc, and not just CSS.)
- Discuss in the issue whether the class is important enough to be left in the original template.
Ideally, we don't want core modules setting style rules, so we'll need to discuss solutions for problems that arise.
Examples
Below is the node.html.twig template. Currently, residing in core/modules/node/templates.
{%
set classes = [
'node',
'node--type-' ~ node.bundle|clean_class,
node.isPromoted() ? 'node--promoted',
node.isSticky() ? 'node--sticky',
not node.isPublished() ? 'node--unpublished',
view_mode ? 'node--view-mode-' ~ view_mode|clean_class,
]
%}
<article{{ attributes.addClass(classes) }}>
{{ title_prefix }}
{% if not page %}
<h2{{ title_attributes }}>
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
</h2>
{% endif %}
{{ title_suffix }}
{% if display_submitted %}
<footer class="node__meta">
{{ author_picture }}
<div{{ author_attributes.addClass('node__submitted') }}>
{% trans %}Submitted by {{ author_name|passthrough }} on {{ date|passthrough }}{% endtrans %}
{{ metadata }}
</div>
</footer>
{% endif %}
<div{{ content_attributes.addClass('node__content') }}>
{{ content|without('links') }}
</div>
{% if content.links %}
<div class="node__links">
{{ content.links }}
</div>
{% endif %}
</article>
Copy the template to core/themes/classy/templates. Then, remove the classes in the original template.
New original
<article{{ attributes }}>
{{ title_prefix }}
{% if not page %}
<h2{{ title_attributes }}>
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
</h2>
{% endif %}
{{ title_suffix }}
{% if display_submitted %}
<footer>
{{ author_picture }}
<div{{ author_attributes }}>
{% trans %}Submitted by {{ author_name|passthrough }} on {{ date|passthrough }}{% endtrans %}
{{ metadata }}
</div>
</footer>
{% endif %}
<div{{ content_attributes }}>
{{ content|without('links') }}
</div>
{% if content.links %}
<div>
{{ content.links }}
</div>
{% endif %}
</article>
