Skip to content

Commit 5c5fdf3

Browse files
jean-guijean-gui
authored
Merge pull request #167 from w3c/template_indentation
Make resulting HTML more readable
2 parents f25ece9 + 8fd186e commit 5c5fdf3

File tree

3 files changed

+49
-40
lines changed

3 files changed

+49
-40
lines changed

‎templates/components/styles/footer.html.twig‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -35,25 +35,27 @@
3535
<div class="global-footer__links">
3636
<div class="l-cluster">
3737
<ul class="clean-list" role="list">
38-
{% for link in links %}
39-
<li>
38+
{%~ for link in links %}
39+
<li>{# -#}
4040
<a href="{{ link.url }}" hreflang="{{ 'footer.links.hreflang'|trans({}, 'w3c_website_templates_bundle') }}">
41-
{{ link.copy|raw }}
42-
</a>
41+
{{- link.copy|raw -}}
42+
</a>{# -#}
4343
</li>
44-
{% endfor %}
44+
{%~ endfor %}
4545
</ul>
4646
</div>
4747
<ul class="clean-list" role="list">
48-
<li><a class="with-icon--larger" href="https://w3c.social/@w3c" hreflang="en">
49-
<img class="icon icon--larger" src="{{ asset('svg/mastodon.svg', 'website-2021') }}" width="20"
50-
height="20" alt aria-hidden="true" loading="lazy"/>
51-
<span class="visuallyhidden">{{ 'footer.links.mastodon'|trans({}, 'w3c_website_templates_bundle')|raw }}</span></a>
48+
<li>
49+
<a class="with-icon--larger" href="https://w3c.social/@w3c" hreflang="en">
50+
<img class="icon icon--larger" src="{{ asset('svg/mastodon.svg', 'website-2021') }}" width="20" height="20" alt aria-hidden="true" loading="lazy"/>
51+
<span class="visuallyhidden">{{ 'footer.links.mastodon'|trans({}, 'w3c_website_templates_bundle')|raw }}</span>
52+
</a>
5253
</li>
53-
<li><a class="with-icon--larger" href="https://github.com/w3c/" hreflang="en">
54-
<img class="icon icon--larger" src="{{ asset('svg/github.svg', 'website-2021') }}" width="20"
55-
height="20" alt aria-hidden="true" loading="lazy"/>
56-
<span class="visuallyhidden">{{ 'footer.links.github'|trans({}, 'w3c_website_templates_bundle')|raw }}</span></a>
54+
<li>
55+
<a class="with-icon--larger" href="https://github.com/w3c/" hreflang="en">
56+
<img class="icon icon--larger" src="{{ asset('svg/github.svg', 'website-2021') }}" width="20" height="20" alt aria-hidden="true" loading="lazy"/>
57+
<span class="visuallyhidden">{{ 'footer.links.github'|trans({}, 'w3c_website_templates_bundle')|raw }}</span>
58+
</a>
5759
</li>
5860
</ul>
5961
</div>

‎templates/components/styles/global_nav.html.twig‎

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -9,44 +9,46 @@
99
<button type="button" class="button button--ghost with-icon--after with-icon--larger" data-trigger="mobile-nav"
1010
style="display: none;"></button>
1111
<ul data-component="nav-double-intro">
12-
{% for navItem in navigation %}
12+
{%~ for navItem in navigation %}
1313
<li class="top-nav-item has-children">
1414
<a href="{{ navItem.titleLink }}" class="nav-link">{{ navItem.title }}</a>
1515
<div class="nav__submenu" data-nav="submenu" style="display: none;">
1616
<div class="l-center">
1717
<div class="nav__submenu__intro">
1818
<h2 class="nav__submenu__intro__heading">{{ navItem.title }}</h2>
1919
<div class="nav__submenu__intro__text">
20-
{% if navItem.introText is defined and navItem.introText %}
20+
{%~ if navItem.introText is defined and navItem.introText %}
2121
<p>{{ navItem.introText }}</p>
22-
{% endif %}
23-
{% for introLink in navItem.introLinks %}
22+
{%~ endif %}
23+
{%~ for introLink in navItem.introLinks %}
2424
<a href="{{ introLink.url }}">{{ introLink.title }}</a>
25-
{% endfor %}
25+
{%~ endfor %}
2626
</div>
2727
</div>
28-
{% if navItem.children is defined and navItem.children|length > 0 %}
28+
{% if navItem.children is defined and navItem.children|length > 0 -%}
2929
<ul>
30-
{% for child in navItem.children %}
31-
<li {{ child.startNewColumn is defined and child.startNewColumn ? 'class="break-after"' : '' }}>
32-
<a href="{{ child.url }}">{{ child.title }}</a>
30+
{%~ for child in navItem.children %}
31+
<li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
32+
<a href="{{ child.url }}">{{ child.title }}</a>{# -#}
3333
</li>
34-
{% endfor %}
34+
{%~ endfor %}
3535
</ul>
36-
{% endif %}
36+
{%~ endif %}
3737
</div>
3838
</div>
3939
</li>
40-
{% endfor %}
40+
{%~ endfor %}
4141
<li class="top-nav-item">
4242
<a hreflang="en" href="https://www.w3.org/help/search/" class="nav-link icon-link">
43-
<img class="icon" src="{{ absolute_url(asset('svg/search.svg', 'website-2021')) }}" width="24" height="24" alt aria-hidden="true"><span class="hide-at-max-width">{{ 'header.search_link'|trans({}, 'w3c_website_templates_bundle') }}</span>
43+
<img class="icon" src="{{ absolute_url(asset('svg/search.svg', 'website-2021')) }}" width="24" height="24" alt aria-hidden="true">{# -#}
44+
<span class="hide-at-max-width">{{ 'header.search_link'|trans({}, 'w3c_website_templates_bundle') }}</span>
4445
</a>
4546
</li>
4647
<li class="top-nav-item">
4748
<a hreflang="en" href="https://www.w3.org/users/myprofile/" id="account-login-link" class="account-login icon-link with-icon--after">
48-
{{ 'header.account_link'|trans({}, 'w3c_website_templates_bundle') }} <span class="avatar avatar--small icon">
49-
<img src="{{ absolute_url(asset('svg/avatar.svg', 'website-2021')) }}" width="24" height="24" alt aria-hidden="true"/>
49+
{{ 'header.account_link'|trans({}, 'w3c_website_templates_bundle') }}
50+
<span class="avatar avatar--small icon">{# -#}
51+
<img src="{{ absolute_url(asset('svg/avatar.svg', 'website-2021')) }}" width="24" height="24" alt aria-hidden="true"/>{# -#}
5052
</span>
5153
</a>
5254
</li>

‎templates/components/styles/lang_nav.html.twig‎

Lines changed: 17 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,19 @@
11
{% if site is defined and site %}
2-
<nav id="lang-nav" aria-label="{{ 'page.lang.options'|trans({}, 'w3c_website_templates_bundle') }}">
3-
<div class="l-center">
4-
<div class="l-cluster">
5-
<ul class="clean-list" role="list">
6-
{% for code, data in site.getData('siteLink', true) %}
7-
{% set targetwebsitename = 'page.lang.targetname.' ~ code %}
8-
<li><a href="{{ data.url }}" hreflang="{{ code }}" lang="{{ code }}">{{ data.label }}<span class="visuallyhidden" lang="{{ site.locale|default('en') }}">{{ targetwebsitename|trans({}, 'w3c_website_templates_bundle') }}</span></a></li>
9-
{% endfor %}
10-
</ul>
2+
<nav id="lang-nav" aria-label="{{ 'page.lang.options'|trans({}, 'w3c_website_templates_bundle') }}">
3+
<div class="l-center">
4+
<div class="l-cluster">
5+
<ul class="clean-list" role="list">
6+
{%~ for code, data in site.getData('siteLink', true) %}
7+
{%- set targetwebsitename = 'page.lang.targetname.' ~ code %}
8+
<li>{#--#}
9+
<a href="{{ data.url }}" hreflang="{{ code }}" lang="{{ code }}">{#- -#}
10+
{{ data.label }}<span class="visuallyhidden" {# -#}
11+
lang="{{ site.locale|default('en') }}">{{ targetwebsitename|trans({}, 'w3c_website_templates_bundle') }}</span>{# -#}
12+
</a>{#- -#}
13+
</li>
14+
{%~ endfor %}
15+
</ul>
16+
</div>
1117
</div>
12-
</div>
13-
</nav>
14-
{% endif %}
18+
</nav>
19+
{% endif %}

0 commit comments

Comments
 (0)