Skip to content

Commit

Permalink
Merge pull request #167 from w3c/template_indentation
Browse files Browse the repository at this point in the history
Make resulting HTML more readable
  • Loading branch information
jean-gui authored Dec 20, 2024
2 parents f25ece9 + 8fd186e commit 5c5fdf3
Show file tree
Hide file tree
Showing 3 changed files with 49 additions and 40 deletions.
28 changes: 15 additions & 13 deletions templates/components/styles/footer.html.twig
Original file line number Diff line number Diff line change
Expand Up @@ -35,25 +35,27 @@
<div class="global-footer__links">
<div class="l-cluster">
<ul class="clean-list" role="list">
{% for link in links %}
<li>
{%~ for link in links %}
<li>{# -#}
<a href="{{ link.url }}" hreflang="{{ 'footer.links.hreflang'|trans({}, 'w3c_website_templates_bundle') }}">
{{ link.copy|raw }}
</a>
{{- link.copy|raw -}}
</a>{# -#}
</li>
{% endfor %}
{%~ endfor %}
</ul>
</div>
<ul class="clean-list" role="list">
<li><a class="with-icon--larger" href="https://w3c.social/@w3c" hreflang="en">
<img class="icon icon--larger" src="{{ asset('svg/mastodon.svg', 'website-2021') }}" width="20"
height="20" alt aria-hidden="true" loading="lazy"/>
<span class="visuallyhidden">{{ 'footer.links.mastodon'|trans({}, 'w3c_website_templates_bundle')|raw }}</span></a>
<li>
<a class="with-icon--larger" href="https://w3c.social/@w3c" hreflang="en">
<img class="icon icon--larger" src="{{ asset('svg/mastodon.svg', 'website-2021') }}" width="20" height="20" alt aria-hidden="true" loading="lazy"/>
<span class="visuallyhidden">{{ 'footer.links.mastodon'|trans({}, 'w3c_website_templates_bundle')|raw }}</span>
</a>
</li>
<li><a class="with-icon--larger" href="https://github.com/w3c/" hreflang="en">
<img class="icon icon--larger" src="{{ asset('svg/github.svg', 'website-2021') }}" width="20"
height="20" alt aria-hidden="true" loading="lazy"/>
<span class="visuallyhidden">{{ 'footer.links.github'|trans({}, 'w3c_website_templates_bundle')|raw }}</span></a>
<li>
<a class="with-icon--larger" href="https://github.com/w3c/" hreflang="en">
<img class="icon icon--larger" src="{{ asset('svg/github.svg', 'website-2021') }}" width="20" height="20" alt aria-hidden="true" loading="lazy"/>
<span class="visuallyhidden">{{ 'footer.links.github'|trans({}, 'w3c_website_templates_bundle')|raw }}</span>
</a>
</li>
</ul>
</div>
Expand Down
32 changes: 17 additions & 15 deletions templates/components/styles/global_nav.html.twig
Original file line number Diff line number Diff line change
Expand Up @@ -9,44 +9,46 @@
<button type="button" class="button button--ghost with-icon--after with-icon--larger" data-trigger="mobile-nav"
style="display: none;"></button>
<ul data-component="nav-double-intro">
{% for navItem in navigation %}
{%~ for navItem in navigation %}
<li class="top-nav-item has-children">
<a href="{{ navItem.titleLink }}" class="nav-link">{{ navItem.title }}</a>
<div class="nav__submenu" data-nav="submenu" style="display: none;">
<div class="l-center">
<div class="nav__submenu__intro">
<h2 class="nav__submenu__intro__heading">{{ navItem.title }}</h2>
<div class="nav__submenu__intro__text">
{% if navItem.introText is defined and navItem.introText %}
{%~ if navItem.introText is defined and navItem.introText %}
<p>{{ navItem.introText }}</p>
{% endif %}
{% for introLink in navItem.introLinks %}
{%~ endif %}
{%~ for introLink in navItem.introLinks %}
<a href="{{ introLink.url }}">{{ introLink.title }}</a>
{% endfor %}
{%~ endfor %}
</div>
</div>
{% if navItem.children is defined and navItem.children|length > 0 %}
{% if navItem.children is defined and navItem.children|length > 0 -%}
<ul>
{% for child in navItem.children %}
<li {{ child.startNewColumn is defined and child.startNewColumn ? 'class="break-after"' : '' }}>
<a href="{{ child.url }}">{{ child.title }}</a>
{%~ for child in navItem.children %}
<li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
<a href="{{ child.url }}">{{ child.title }}</a>{# -#}
</li>
{% endfor %}
{%~ endfor %}
</ul>
{% endif %}
{%~ endif %}
</div>
</div>
</li>
{% endfor %}
{%~ endfor %}
<li class="top-nav-item">
<a hreflang="en" href="https://www.w3.org/help/search/" class="nav-link icon-link">
<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>
<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>
</a>
</li>
<li class="top-nav-item">
<a hreflang="en" href="https://www.w3.org/users/myprofile/" id="account-login-link" class="account-login icon-link with-icon--after">
{{ 'header.account_link'|trans({}, 'w3c_website_templates_bundle') }} <span class="avatar avatar--small icon">
<img src="{{ absolute_url(asset('svg/avatar.svg', 'website-2021')) }}" width="24" height="24" alt aria-hidden="true"/>
{{ 'header.account_link'|trans({}, 'w3c_website_templates_bundle') }}
<span class="avatar avatar--small icon">{# -#}
<img src="{{ absolute_url(asset('svg/avatar.svg', 'website-2021')) }}" width="24" height="24" alt aria-hidden="true"/>{# -#}
</span>
</a>
</li>
Expand Down
29 changes: 17 additions & 12 deletions templates/components/styles/lang_nav.html.twig
Original file line number Diff line number Diff line change
@@ -1,14 +1,19 @@
{% if site is defined and site %}
<nav id="lang-nav" aria-label="{{ 'page.lang.options'|trans({}, 'w3c_website_templates_bundle') }}">
<div class="l-center">
<div class="l-cluster">
<ul class="clean-list" role="list">
{% for code, data in site.getData('siteLink', true) %}
{% set targetwebsitename = 'page.lang.targetname.' ~ code %}
<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>
{% endfor %}
</ul>
<nav id="lang-nav" aria-label="{{ 'page.lang.options'|trans({}, 'w3c_website_templates_bundle') }}">
<div class="l-center">
<div class="l-cluster">
<ul class="clean-list" role="list">
{%~ for code, data in site.getData('siteLink', true) %}
{%- set targetwebsitename = 'page.lang.targetname.' ~ code %}
<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>
{%~ endfor %}
</ul>
</div>
</div>
</div>
</nav>
{% endif %}
</nav>
{% endif %}

0 comments on commit 5c5fdf3

Please sign in to comment.