feature_request(H021): allow inline styles if templates in styles

[Kristinita]

1. Summary

Possibly, it would be nice, if djLint will allow inline styles if they contain at least one template.

That is, if the value of the style attribute contain {{ braces }}, rule H021 will not apply.

2. Argumentation

The most popular answer on Stack Overflow to the question “What’s so bad about in-line CSS?” says that putting styles into classes can be much easier to maintain.

But in some cases, inline-styles can be easier to maintain. See my real example below. In my opinion, for such cases, it makes sense not to apply rule H021.

3. MCVE

3.1. File to check

• KiraDJLint__inline-styles-with-templates--H021.html

   {# [INFO] MCVE #}
   <div style="background-image: url({{ kira_icon }}.webp)"></div>
  
  
   {# [INFO] Real example.
  
   Templates for the pure CSS fading slideshow:
   https://codeconvey.com/pure-css-fading-slideshow/ #}
   <div class="KiraSlider">
  
   	{% set kira_404_icons_list = [
   			("SashaNose", "1"),
   			("SashaRiver", "2"),
   			("SashaBlueHairs", "3"),
   			("SashaBow", "4"),
   			("SashaPigeon", "5"),
   			("SashaShimskyNovgorodDestrict", "6"),
   			("SashaWeddingOfFriends", "7")
   		]
   	%}
  
   	{% for kira_icon, kira_icon_number in kira_404_icons_list %}
   		<div class="KiraFadeSlideshowIcon{{ kira_icon_number }}" style="background-image: url({{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/404/{{ kira_icon }}.webp)"></div>
   	{% endfor %}
  
   </div>
  

3.2 Desired behavior

No errors

3.3. Current behavior

D:\SashaDebugging\KiraDJLintDebuging>djlint --profile=jinja --lint KiraDJLint__inline-styles-with-templates--H021.html --ignore=T001

Linting 1/1 files ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 00:00


SashaDebugging\KiraDJLintDebuging\KiraDJLint__inline-styles-with-templates--H021.html
───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────── H021 2:0 Inline styles should be avoided. <div style=
H021 24:2 Inline styles should be avoided. <div class="KiraFade

Linted 1 file, found 2 errors.

4. Environment

1. Microsoft Windows [Version 10.0.19041.1415]
2. Python 3.10.6
3. djlint, version 1.11.1
4. Template language — Jinja

5. Checkbox

1. I’m on the latest version of djLint
2. I’ve searched the issues
3. I’ve read the docs

Thanks.

[christopherpickering]

Its a good point.

[christopherpickering]

🎉 This issue has been resolved in version 1.12.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[Kristinita]

Status: FIXED ✔️ for me for djLint 1.12.0.

Thanks.