Skip to content

Commit

Permalink
Support last_updated and last_reviewed dates in footer
Browse files Browse the repository at this point in the history
  • Loading branch information
remibetin committed Oct 31, 2024
1 parent 4da3547 commit 16567e2
Show file tree
Hide file tree
Showing 8 changed files with 188 additions and 108 deletions.
6 changes: 6 additions & 0 deletions _components/document-notes/document-notes.css
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@
}

.doc-note-translation {
border: 2px solid var(--wai-green);
font-size: .8125rem;
& p {
margin-block-start: 5px;
Expand All @@ -65,4 +66,9 @@
margin-block-end: 0;
}
}
& .translation-needs-update {
background-color: var(--gold-light);
padding: 8px;
margin: 0 -8px -8px -8px;
}
}
35 changes: 21 additions & 14 deletions _components/footer.md
Original file line number Diff line number Diff line change
@@ -1,25 +1,31 @@
---
title: "Footers (Page and Site)"
lang: en
# translators: # Uncomment (remove #) for translations, one - name line per translator.
# - name: Translator 1
# - name: Translator 2
# contributors:
# - name: Contributor 1
# - name: Contributor 2
footer: > # Text in footer in HTML
<p> This is the text in the footer </p>
inline_css: |
custom_changelog: /writing/changelogs/example/
last_updated: 2024-09-24
---

***Note:** This is only a visual design reference. [The content is defined in the frontmatter](/writing/frontmatter/#footer-).*

## Page Footer

### With last updated date

<footer class="page-footer default-grid">
<div class="inner">
<p><strong>Updated:</strong> {{ 'now' | date: "%d %B %Y" }}. <a href="{{ '/writing/changelogs/example/' | relative_url }}">Latest changes</a>.</p>
<p>Editors: Jane Doe. Previously John Doe. Contributors: Jan Doe.</p>
<p>First developed with support from ONE Project, then updated with support of the TWO Project and later the THREE Project.</p>
</div>
</footer>

### With a more recent date of review

<footer class="page-footer default-grid">
<div class="inner">
<p>Status: XXX updated Month 20XX</p>
<p>Editors: Xxxxxx Yxxxxx; previously Xxxxxx Yxxxxx and Xxxxxx Yxxxxx. Developed by the Education and Outreach Working Group. Contributors: Xxxxxx Yxxxxx, Xxxxxx Yxxxxx , and Xxxxxx Yxxxxx. First developed with support from ONE Project, then updated with support of the TWO Project and later the THREE Project.</p>
<p><strong>This page has been reviewed and is current as of</strong> {{ 'now' | date: "%d %B %Y" }}. <a href="{{ '/writing/changelogs/example/' | relative_url }}">Latest changes</a>.</p>
<p>Editors: Jane Doe. Previously John Doe. Contributors: Jan Doe.</p>
<p>First developed with support from ONE Project, then updated with support of the TWO Project and later the THREE Project.</p>
</div>
</footer>

Expand All @@ -33,14 +39,15 @@ inline_css: |
</div>
<div class="social" lang="en" dir="auto" translate="no">
<ul>
<li><a href="https://twitter.com/w3c_wai">{% include_cached icon.html name="twitter" %} Twitter</a></li>
<li><a href="https://w3c.social/@wai">{%include_cached icon.html name="mastodon" %} Mastodon</a></li>
<li><a href="https://www.linkedin.com/company/w3c-wai/">{%include_cached icon.html name="linkedin" %} LinkedIn</a></li>
<li><a href="https://www.w3.org/WAI/feed.xml">{% include_cached icon.html name="rss" %} Feed</a></li>
<li><a href="https://www.youtube.com/channel/UCU6ljj3m1fglIPjSjs2DpRA/playlistsv">{% include_cached icon.html name="youtube" %} YouTube</a></li>
<li><a href="https://www.youtube.com/channel/UCU6ljj3m1fglIPjSjs2DpRA/playlists/">{% include_cached icon.html name="youtube" %} YouTube</a></li>
<li><a href="https://www.w3.org/WAI/news/subscribe/" class="button">Get News in Email</a></li>
</ul>
</div>
<div lang="en" dir="auto" translate="no">
<p>Copyright © 2019 W3C <sup>®</sup> (<a href="https://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="https://www.ercim.eu/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>, <a href="https://www.keio.ac.jp/">Keio</a>, <a href="https://ev.buaa.edu.cn">Beihang</a>) <a href="/WAI/about/using-wai-material/">Permission to Use WAI Material</a>.</p>
<p>Copyright © {{ 'now' | date: "%Y" }} World Wide Web Consortium (<a href="https://www.w3.org/">W3C</a><sup>®</sup>). See <a href="{{ "/about/using-wai-material/" | relative_url }}">Permission to Use WAI Material</a>.</p>
</div>
</div>
<div class="q4-start q4-end">
Expand Down
140 changes: 96 additions & 44 deletions _includes/footer.html
Original file line number Diff line number Diff line change
@@ -1,62 +1,68 @@
{%- assign col = site.collections | where: "label", page.collection | first -%}
{%- if page.changelog -%}
{%- assign changelogpage=site.documents | where:"ref", page.changelog | first -%}
{%- unless changelogpage.ref -%}
{%- assign changelogpage=site.pages | where:"ref", page.changelog | first -%}
{%- endunless -%}
{% assign changelogpageurl = changelogpage.url | relative_url %}
{%- capture changelogtext -%}
{%- include_cached t.html t="Changelog" lang=page.lang -%}
{%- comment -%}
Find the page language.
{%- endcomment -%}
{%- assign page_lang = 'en' -%}
{%- if page.lang -%}
{%- assign page_lang = page.lang -%}
{%- endif -%}
{%- comment -%}
Get the changelog page:
- Use the `custom_changelog` value when existing. Also supports the legacy `changelog` frontmatter variable for now.
- Else, append "changelog/` to the page `ref` or `url` to check if it matches a page.
{%- endcomment -%}
{%- if page.custom_changelog -%}
{%- assign changelog_url = page.custom_changelog -%}
{%- elsif page.changelog -%}
{%- assign changelog_url = page.changelog -%}
{%- elsif page.ref -%}
{%- assign changelog_url = page.ref | append: "changelog/" -%}
{%- else -%}
{%- assign changelog_url = page.url | append: "changelog/" -%}
{%- endif -%}
{%- assign all_docs = site.documents | concat: site.pages -%}
{%- assign changelog_page = all_docs | where: "url", changelog_url | first -%}
{%- comment -%}
Build the link to the Changelog
{%- endcomment -%}
{%- if changelog_page -%}
{%- capture changelog -%}
<a href="{{ changelog_page.url | relative_url }}">{%- include_cached t.html t="Latest changes" lang=page_lang -%}</a>
{%- endcapture -%}
{%- assign changelog = '<a href="' | append: changelogpageurl | append: '">' | append: changelogtext | append: '</a>' -%}
{%- else -%}
{%- assign changelog = "" -%}
{%- endif -%}
{%- comment -%}
Build the link to the Acknowledgements page
{%- endcomment -%}
{%- if page.acknowledgements -%}
{%- assign acknowledgementspage=site.documents | where:"ref", page.acknowledgements | first -%}
{%- unless acknowledgementspage.ref -%}
{%- assign acknowledgementspage=site.pages | where:"ref", page.acknowledgements | first -%}
{%- endunless -%}
{% assign acknowledgementspageurl = acknowledgementspage.url | relative_url %}
{%- capture acknowledgementstext -%}
{%- include_cached t.html t="Acknowledgements" lang=page.lang -%}
{%- assign acknowledgements_page = all_docs | where:"ref", page.acknowledgements | first -%}
{%- capture acknowledgements -%}
<a href="{{ acknowledgements_page.url | relative_url }}">{%- include_cached t.html t="Acknowledgements" lang=page_lang -%}</a>
{%- endcapture -%}
{%- assign acknowledgements = '<a href="' | append: acknowledgementspageurl | append: '">' | append: acknowledgementstext | append: '</a>' -%}
{%- else -%}
{%- assign acknowledgements = "" -%}
{%- endif -%}
{% if col.footer %}
{%- comment -%}
COLLECTION PAGE FOOTER
For collections, we use the collection footer when set.
{%- endcomment -%}
{%- assign col = site.collections | where: "label", page.collection | first -%}
{%- if col.footer -%}
<footer id="wai-page-footer" class="page-footer default-grid" aria-label="Page">
<div class="inner"
{% if include.inner-style %}
style="{{ include.inner-style }}"
{% endif %}>
{{ col.footer | replace: "CHANGELOG", changelog | replace: "ACKNOWLEDGEMENTS", acknowledgements }}
{%- if page.license == 'creative-commons' -%}<p>{% include_cached icon.html name="creative-commons" %} This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</p>{%- endif -%}
{%- if page.license == 'creative-commons' -%}<p>{% include_cached icon.html name="creative-commons" %} This work is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</p>{%- endif -%}
</div>
</footer>
{% else %}
{% if page.footer %}
<footer id="wai-site-footer" class="page-footer default-grid" aria-label="Page">
<div class="inner"
{% if include.inner-style %}
style="{{ include.inner-style }}"
{% endif %}>
{{ page.footer | replace: "CHANGELOG", changelog | replace: "ACKNOWLEDGEMENTS", acknowledgements }}
{%- if page.license == 'creative-commons' -%}<p>{% include_cached icon.html name="creative-commons" %} This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</p>{%- endif -%}
</div>
</footer>
{% endif %}
{% endif %}

{% comment %}

{%- comment -%}
META FOOTER

For the tutorials, we used data to form the footer. This way of constructing the footer is now called “metafooter” and needs to be enabled by setting `metafooter: true` in the frontmatter. Do NOT use with raw html `footer: ` frontmatter.

{% endcomment %}
{% if page.metafooter %}
For the tutorials, we use multiple frontmatter variables to form the page footer. This way of constructing the footer is called “metafooter” and needs to be enabled by setting `metafooter: true` in the frontmatter.
Do NOT use with raw html `footer: ` frontmatter.
{%- endcomment -%}
{%- elsif page.metafooter -%}
<footer id="wai-site-footer" class="page-footer default-grid" aria-label="Page">
<div class="inner">
<div><strong>Status:</strong>
Expand Down Expand Up @@ -91,7 +97,6 @@
{% endfor %}
&nbsp;
{% if page.update_editors %}

{% include t.html t='Update Editor:' %}
{% for updateeditor in page.update_editors %}
{% if forloop.first %}<ul class="sentence">{% endif %}
Expand Down Expand Up @@ -133,7 +138,54 @@
{%- if page.license == 'creative-commons' -%}<p>{% include_cached icon.html name="creative-commons" %} This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</p>{%- endif -%}
</div>
</footer>
{% endif %}
{%- comment -%}
DEFAULT PAGE FOOTER
Most pages use this page footer.
{%- endcomment -%}
{%- else -%}
{%- comment -%}
Convert dates into integers to compare them later.
{%- endcomment -%}
{%- assign last_updated = page.last_updated | date: '%s' | plus: 0 | default: 0 -%}
{%- assign last_reviewed = page.last_reviewed | date: '%s' | plus: 0 | default: 0 -%}
{% if page.footer or page.last_updated or page.last_reviewed %}
<footer id="wai-site-footer" class="page-footer default-grid" aria-label="Page">
<div class="inner"
{%- if include.inner-style -%}
style="{{ include.inner-style }}"
{%- endif -%}>
{%- if page.last_updated or page.last_reviewed -%}
<p>
{%- if last_updated >= last_reviewed -%}
{%- if page_lang == "en" %}<strong>{%- include_cached t.html t="Updated:" lang=page.lang %}</strong> {{ page.last_updated | date: '%e %B %Y' }}.
{%- elsif page_lang != "en" -%}<strong>{%- include_cached t.html t="English version updated:" lang=page.lang %}</strong> {{ page.last_updated | date: '%Y-%m-%d' }}.
{%- endif -%}
{%- elsif last_reviewed > last_updated -%}
{%- if page_lang == "en" -%}<strong>{%- include_cached t.html t="This page has been reviewed and is current as of" lang=page.lang %}</strong> {{ page.last_reviewed | date: '%e %B %Y' }}.
{%- endif -%}
{%- endif -%}
{%- if changelog_page %}
{{ changelog }}.
{%- endif -%}
{%- if page_lang != 'en' and page.translation.last_updated %}
({%- include_cached t.html t="Translated:" lang=page.lang %} {{ page.translation.last_updated | date: '%Y-%m-%d' }}).
{%- endif -%}
{%- if page.first_published %}
{{ page.first_published }}
{%- endif -%}
</p>
{%- endif -%}
{%- comment -%}
For now, we continue to support replacing "CHANGELOG" with the changelog link. But that should soon be removed.
{%- endcomment -%}
{%- if page.footer -%}
{{ page.footer | replace: "CHANGELOG", changelog | replace: "ACKNOWLEDGEMENTS", acknowledgements }}
{%- endif -%}
{%- if page.license == 'creative-commons' -%}<p>{% include_cached icon.html name="creative-commons" %} This work is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</p>{%- endif -%}
</div>
</footer>
{% endif %}
{%- endif -%}

<footer class="site-footer grid-4q" aria-label="Site">
<div class="q1-start q3-end about">
Expand All @@ -146,7 +198,7 @@
<li><a href="https://w3c.social/@wai">{%include_cached icon.html name="mastodon" %} Mastodon</a></li>
<li><a href="https://www.linkedin.com/company/w3c-wai/">{%include_cached icon.html name="linkedin" %} LinkedIn</a></li>
<li><a href="https://www.w3.org/WAI/feed.xml">{%include_cached icon.html name="rss" %} Feed</a></li>
<li><a href="https://www.youtube.com/channel/UCU6ljj3m1fglIPjSjs2DpRA/playlistsv">{%include_cached icon.html name="youtube" %} YouTube</a></li>
<li><a href="https://www.youtube.com/channel/UCU6ljj3m1fglIPjSjs2DpRA/playlists/">{%include_cached icon.html name="youtube" %} YouTube</a></li>
<li><a href="https://www.w3.org/WAI/news/subscribe/" class="button">Get News in Email</a></li>
</ul>
</div>
Expand Down
6 changes: 2 additions & 4 deletions _includes/t-status.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,12 +12,10 @@
{%- endif -%}
{%- endcapture -%}

{% capture translation-date %}{{ translation.last_updated | date: '%s' | plus: 0 }}{% endcapture %}
{% capture original-date %}{{ original.last_updated | date: '%s' | plus: 0 }}{% endcapture %}
{%- capture t-status -%}
{%- if translation == nil -%}none
{%- elsif translation.size != 0 and translation-date < original-date -%}outdated
{%- elsif translation.size != 0 and translation-date >= original-date -%}uptodate
{%- elsif translation.translation.status == "outdated" -%}outdated
{%- else -%}uptodate
{%- endif -%}
{%- endcapture -%}

Expand Down
Loading

0 comments on commit 16567e2

Please sign in to comment.