Move classes out of the preprocess functions and into the Twig templates. Use the addClass() attribute method to add classes in the template. Use the clean_class filter to filter class names, if necessary. Maintain all existing functionality and ensure all existing class names are still in the markup, even ones that are inherited.

See the following issues for more detailed examples:
#2217731: Move field classes out of preprocess and into templates
#2254153: Move node classes out of preprocess and into templates

See this change record for information about using the addClass() method:
https://www.drupal.org/node/2315471

See this change record for more information about the phase 1 process of moving class from preprocess to templates:
https://www.drupal.org/node/2325067

Preprocess Functions Modified

template_preprocess_user
template_preprocess_username

Twig Templates Modified

user.html.twig
username.html.twig

Files: 
CommentFileSizeAuthor
#5 move_user_classes_from-2329779-5.patch2.1 KBlauriii
PASSED: [[SimpleTest]]: [PHP 5.4 MySQL] 76,065 pass(es). View

Comments

davidhernandez’s picture

Issue tags: +FUDK
lauriii’s picture

Status: Active » Needs review
FileSize
2.22 KB
PASSED: [[SimpleTest]]: [PHP 5.4 MySQL] 75,608 pass(es). View
davidhernandez’s picture

Status: Needs review » Needs work

Thanks, lauriii. Just one comment. If there is only one class, you don't need to use a variable. You can add the class name directly. Like this:

<article{{ attributes.addClass('username') }}>

davidhernandez’s picture

For future reference, more than one can be added. Like so: <article{{ attributes.addClass('red', 'blue') }}>

If there are three or more, or some logic needed to create the class name, than it is better to use the variable.

lauriii’s picture

FileSize
2.1 KB
PASSED: [[SimpleTest]]: [PHP 5.4 MySQL] 76,065 pass(es). View

I updated the patch for the simpler way to apply classes.

lauriii’s picture

Status: Needs work » Needs review

Sending to testbot also!

Cottser’s picture

@davidhernandez and @lauriii, thanks! Is that rule from #4 documented on the parent meta? Maybe we could have a couple examples in that issue summary showing a smaller conversion like this and a more complex one like node and explaining when to use which method (basically #4 with another code sample for a longer one).

davidhernandez’s picture

Most of that is in the draft change record, but I can copy it to the meta as instructions.

mdrummond’s picture

Status: Needs review » Reviewed & tested by the community

This looks good to me.

Cottser’s picture

+1

Cottser’s picture

I just manually tested both of these templates as well, the only thing that changes is the position of the class attribute within the tag.

  • alexpott committed 94201c5 on 8.0.x
    Issue #2329779 by lauriii | davidhernandez: Move user classes from...
alexpott’s picture

Status: Reviewed & tested by the community » Fixed

Committed 94201c5 and pushed to 8.0.x. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.