-
Notifications
You must be signed in to change notification settings - Fork 321
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix landmarks #1454
Fix landmarks #1454
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done self-reviewing! I left a lot of inline comments that I hope will be helpful to reviewers 😄
@@ -481,7 +481,7 @@ function showVersionWarningBanner(data) { | |||
inner.appendChild(bold); | |||
inner.appendChild(document.createTextNode(".")); | |||
inner.appendChild(button); | |||
document.body.prepend(outer); | |||
(documment.querySelector("header") || document.body).prepend(outer); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
One other thing to think about. We currently make this version warning very visually prominent. If we are making it this prominent for sighted users, should we also make it prominent for blind users by wrapping it in its own landmark, possibly with the <aside>
tag?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
should we also make it prominent for blind users by wrapping it in its own landmark
yes
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@@ -81,14 +81,18 @@ | |||
<div class="search-button__overlay"></div> | |||
<div class="search-button__search-container">{% include "../components/search-field.html" %}</div> | |||
</div> | |||
|
|||
<header> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This also had to do with All page content should be contained by landmarks.
Note that this PR does not fix all instances of this error everywhere in the theme. (For example, the Read The Docs switcher violates this rule.)
@@ -107,7 +111,7 @@ | |||
{% block docs_body %} | |||
{# This is empty and only shows up if text has been highlighted by the URL #} | |||
{% include "components/searchbox.html" %} | |||
<article class="bd-article" role="main"> | |||
<article class="bd-article"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Duplicate main landmark (there should only be one on the page). If you look just a few lines above, you'll find a <main>
tag.
I think this was an oversight of #1019.
{%- if theme_announcement -%} | ||
{% include "sections/announcement.html" %} | ||
{%- endif %} | ||
{% block docs_navbar %} | ||
<nav class="bd-header navbar navbar-expand-lg bd-navbar"> | ||
<div class="bd-header navbar navbar-expand-lg bd-navbar"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The <nav>
that I change here used to contain a nav. Nesting navs is bad practice.
This outer nav contains the logo, the version switcher, the list of header links, the search bar, the theme switcher, and the icon links to Twitter, GitHub, PyPI and PyData.
The inner nav contains the list of header links, so I think it better matches the nav element semantics.
Furthermore, on mobile this outer nav changes so that it only shows the left hamburger (site and section navigation), the logo, the search, and the right hamburger (page navigation). Whereas the inner nav (based on the Jinja navbar-nav.html component), contains the same content on desktop and mobile.
On mobile, the semantics become very clear. On mobile the sidebar contains two navigation sections: one for the site, one for the section of the site that you're in:
So I think the inner nav should keep the nav semantics, whereas the nav semantics here on this line should be removed.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
As an aside, there's something that feels not quite right to me about putting external links under a heading that says "Site Navigation" but maybe that's an issue for another day.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
As an aside, there's something that feels not quite right to me about putting external links under a heading that says "Site Navigation" but maybe that's an issue for another day.
yes let's punt on that. Users like to do it (have external links in the main topbar nav) and would be mad if we removed the ability to do that.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Right. But maybe the heading should be "Main Navigation" or something like that instead of "Site Navigation"? Or maybe we get rid of the visible heading altogether and set aria-label="Main" on the nav tag.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm OK with "Main navigation" instead of "Site navigation"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
After thinking about this some more, may I make an argument to simply remove the heading?
- Consistency between mobile and desktop, because this heading is not shown on desktop, but is shown on mobile
- Frees up valuable screen real estate
- Reduces number of strings to translate
- Solves the problem of screen reader noise: "Site Navigation navigation" or "navigation Site navigation"
- I'm not sure it's really needed in the mobile sidebar as the row of icon links followed by a horizontal line already creates strong visual break between the two nav sections:
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can you open a new issue to discuss further the idea of removing the "Site navigation" title?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
#1588 :)
@@ -1,5 +1,6 @@ | |||
<nav class="sidebar-indices-items"> | |||
<p class="sidebar-indices-items__title" role="heading" aria-level="1">{{ _("Indices") }}</p> | |||
{#- TODO use unique html id generator since components can be included in multiple places -#} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The TODO comments are because of #1425
<nav class="sidebar-indices-items"> | ||
<p class="sidebar-indices-items__title" role="heading" aria-level="1">{{ _("Indices") }}</p> | ||
{#- TODO use unique html id generator since components can be included in multiple places -#} | ||
<nav class="sidebar-indices-items" aria-labelledby="pst-indices-navigation-heading"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We may have too many navigation landmarks in the theme. Online guides say to use landmarks sparingly.
But I decided to punt on that question for now and just try to improve the existing landmarks and only remove landmarks when they were actually bugs (nav inside nav, two mains, etc.)
aria-label="{{ _('Section Navigation') }}"> | ||
<p class="bd-links__title" role="heading" aria-level="1">{{ _("Section Navigation") }}</p> | ||
aria-labelledby="pst-section-navigation-heading"> | ||
<p id="pst-section-navigation-heading" class="bd-links__title" role="heading" aria-level="1">{{ _("In this section") }}</p> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I needed to change the label on the nav because it was noisy, causing screen readers to say "Section Navigation navigation."
I also thought that "Section Navigation" as a label/header was a bit ambiguous. Section of what? section of the site? section of the page?
My first instinct was to change the heading to "Pages," which means it would be announced by screen readers as "Pages navigation." But then I noticed that the navigation for sections of the page was called "On this page," so I thought maybe it makes sense to call this nav group "In this section," leading to the screen reader announcements "On this page navigation" and "In this section navigation," respectively.
Taken all together, this means that with this PR the PST site has the following navigation landmarks:
- navigation (no label implies top-level site navigation, I think)
- In this section navigation
- Breadcrumb navigation
- On this page navigation
What do folks think? Should it perhaps be "Pages in this section navigation?"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
just a note that changing translated strings (strings inside _(...)
) should not be done lightly (they will need to get re-translated, which is not automatic). I'm not insisting to change it back because it seems like you have good reason to do it here.
"section" here means "section of the site", refers to the top-level menu item (user guide is a section, contributor guide is another section, etc). So I think your choice of "in this section" makes sense here.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Indeed. I'm already regretting my decision. It's complicating my PR 😭
cc @trallard |
seeems like this is waiting on #1425, I'll mark as draft until that one is in |
I think I'm going to need some help with the translation system. I changed the string "Section Navigation" to "In this section" but I'm not exactly sure what I need to do to get the translation files in order. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
My last few commits reverted the cascade of changes resulting from changing the translatable string "Section Navigation" to "In this section."
In order not to stall this PR, I would like to address that issue (and other translation issues) in subsequent PRs.
If that sounds good, then this PR should be ready to go now (assuming the checks pass).
@@ -473,7 +473,9 @@ function showVersionWarningBanner(data) { | |||
return; | |||
} | |||
// now construct the warning banner | |||
var outer = document.createElement("div"); | |||
var outer = document.createElement("aside"); | |||
// TODO: add to translatable strings |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I want to do this in a follow-up PR not this one because this PR has been open for a while and has gotten stuck on translation stuff, so I would like to tackle the translation issues separately.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sorry what is the translation issue ?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's been a while so I don't actually remember what issues I was running into, but in a previous version of this PR, I had changed a translatable string, so then I tried to go through the nox -s translate -- extract
and nox -s translate -- update
steps but I ran into issues or didn't understand what was going on. So I decided to revert the change to the translatable string _("Section Navigation")
.
Similarly, here I don't know how to mark this string as translatable (because it's a .js
file) and even if I did know how to mark it as translatable, I would still want to defer the work of putting it through the translation machinery until later, in the interest of getting this PR merged now and handling translation stuff in a subsequent PR. Does that make sense?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The string here, "Version warning", is used to label the landmark (<aside>
=> role = complementary) that I added to the version warning banner. (The rationale is that since we make the version warning banner so visually prominent, we should also make it prominent for assistive tech, hence the landmark.)
Eventually the string needs to be translated. It will be surfaced by assistive tech when showing or announcing landmarks on the page: "Version warning, complementary" (something like that)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you open a new issue to remind us to come back to this (question about marking strings as translatable if they're generated within JavaScript) please?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
#1587 😃
{%- if theme_announcement -%} | ||
{% include "sections/announcement.html" %} | ||
{%- endif %} | ||
{% block docs_navbar %} | ||
<nav class="bd-header navbar navbar-expand-lg bd-navbar"> | ||
<div class="bd-header navbar navbar-expand-lg bd-navbar"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can you open a new issue to discuss further the idea of removing the "Site navigation" title?
@@ -473,7 +473,9 @@ function showVersionWarningBanner(data) { | |||
return; | |||
} | |||
// now construct the warning banner | |||
var outer = document.createElement("div"); | |||
var outer = document.createElement("aside"); | |||
// TODO: add to translatable strings |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you open a new issue to remind us to come back to this (question about marking strings as translatable if they're generated within JavaScript) please?
thanks @gabalafou! |
* docs: add instructions for custom SVG icons (#1490) * docs: add instructions for custom SVG icons * docs: minor tweaks in SVG icon instructions * docs: some more tweaks to SVG icon instructions * Update docs/user_guide/header-links.rst Co-authored-by: Rambaud Pierrick <[email protected]> * Change literalinclude to code-block in header links * Update docs/user_guide/header-links.rst Co-authored-by: Daniel McCloy <[email protected]> * Update docs/user_guide/header-links.rst * Update docs/user_guide/header-links.rst * Update docs/user_guide/header-links.rst * Update docs/user_guide/header-links.rst * Update docs/user_guide/header-links.rst --------- Co-authored-by: tgresavage <[email protected]> Co-authored-by: Rambaud Pierrick <[email protected]> Co-authored-by: Daniel McCloy <[email protected]> * fix: make table background transparent (#1546) * fix: make table background transparent * fix: make table background transparent * fix: add color-theme option to html tag (#1536) * Silence warnings (#1542) * avoid webpack warning during asset compile * avoid frozen modules warning during import * try to make jupyterlite quieter * add config option to silence warnings * fix tests * add docs * hide conditional warning logic in utils * bump: 0.14.2 → 0.14.3 * chore: back to dev * docs: add the list of component using a directive (#1476) * fix: create the component list automatically * fix: read the first comment as documentation * docs: add disclaimer on .html suffix * docs: document every component with a simple one liner * fix: use regex to identify comments * update component branch (#15) * Change default logo alt text (#1472) * Default logo alt text only if no extra text * change default logo * use docstitle as default logo alt text * update docs to reflect change * Apply suggestions from code review Co-authored-by: Daniel McCloy <[email protected]> * use string formatting operator * Update docs/user_guide/branding.rst * docs fixes * Update docs/user_guide/branding.rst * add test * Update pyproject.toml * revert to original --------- Co-authored-by: Daniel McCloy <[email protected]> Co-authored-by: Rambaud Pierrick <[email protected]> * chore(i18n) catalan (#1488) i18n: Translate sphinx.po in ca 100% translated source file: 'sphinx.po' on 'ca'. Co-authored-by: transifex-integration[bot] <43880903+transifex-integration[bot]@users.noreply.github.com> * Build(deps): Bump postcss and css-loader (#1494) Bumps [postcss](https://github.com/postcss/postcss) to 8.4.31 and updates ancestor dependency [css-loader](https://github.com/webpack-contrib/css-loader). These dependencies need to be updated together. Updates `postcss` from 8.4.21 to 8.4.31 - [Release notes](https://github.com/postcss/postcss/releases) - [Changelog](https://github.com/postcss/postcss/blob/main/CHANGELOG.md) - [Commits](postcss/postcss@8.4.21...8.4.31) Updates `css-loader` from 3.6.0 to 6.8.1 - [Release notes](https://github.com/webpack-contrib/css-loader/releases) - [Changelog](https://github.com/webpack-contrib/css-loader/blob/master/CHANGELOG.md) - [Commits](webpack-contrib/css-loader@v3.6.0...v6.8.1) --- updated-dependencies: - dependency-name: postcss dependency-type: indirect - dependency-name: css-loader dependency-type: direct:development ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Revert "Build(deps): Bump postcss and css-loader" (#1509) Revert "Build(deps): Bump postcss and css-loader (#1494)" This reverts commit 185a37a. * Update pst docs buttons (#1502) * call them button-links * copy edit * docs: link back to GitHub from PyPI metadata (#1504) This will add a "Source" link in the PyPI page. * navigation_with_keys = False (#1503) * navigation_with_keys = False * None -> False * Apply suggestions from code review --------- Co-authored-by: Daniel McCloy <[email protected]> * fix: convert "stable" to actual version number (#1512) * convert "stable" to actual version number * fix tests re: navigation_with_keys * try bumping autoapi * refactor: use nbsphinx as the default execution lib (#1482) * refactor: use nbsphinx as the default execution lib * add nbstripout to the pre-commits' * add pandoc to the readthedocs deps * refactor: clean the notebook * move the example to the correct folder * fix: solve link issue * install pandoc in the test environment * fix: display of large table in executed cells * avoid Userwarnings from matplotlib * hide the matplotlib wrning management cell * Update readthedocs.yml * build: use pandoc_binary to install pandoc * docs: add reference to pandoc in the setup * update docs * remove pypandoc_binary * Update pyproject.toml Co-authored-by: gabalafou <[email protected]> * ci: use back setup-pandoc * Trigger CI build --------- Co-authored-by: Gabriel Fouasnon <[email protected]> * BUG - Clear alt_text in conf.py (#1471) * comment out alt_text in conf.py * set alt_text to empty string * remove alt_text from conf.py * fix: use 12rambau fork until it's merged with nikeee repo (#1517) * deps: drop support for Sphinx 5 (#1516) * remove ref to myst-nb * update minimal supported version of sphinx * Fix: (webpack.config.js) css-loader API change (#1508) * Fix: (webpack.config.js) css-loader API change The build was broken in <https://github.com/pydata/pydata-sphinx-theme/commit/185a37aa36820f77bffa4c87a772092e9e7cc380>/<https://github.com/pydata/pydata-sphinx-theme/pull/1494>. This change fixes the build, and it seems to be in accordance with the current API as described at <https://github.com/webpack-contrib/css-loader/blob/c6f36cf91ac61743a70e81cfb077faa0f8730ebe/README.md#boolean>. Closes <#1507>. * dedup * restore version bump --------- Co-authored-by: Daniel McCloy <[email protected]> * Fix duplicate HTML IDs (#1425) * Fix duplicate HTML IDs * fix tests * Do not animate the version admonitions colors. (#1424) Otherwise a delay has to be added to the accessibility color contrast checks, to wait for the colors to fully transition. * BUG - Remove redundant ARIA in breadcrumb navigation (#1426) * style(i18n): French Typo fixed (#1430) * Add the ability to add a center section to the footer (#1432) * Add a center section for the footer * Add docs for footer_center * Add a test site for the center footer * test it in our own docs * remove new test site * add footer test --------- Co-authored-by: Daniel McCloy <[email protected]> * Build(deps): Bump actions/checkout from 3 to 4 (#1433) Bumps [actions/checkout](https://github.com/actions/checkout) from 3 to 4. - [Release notes](https://github.com/actions/checkout/releases) - [Changelog](https://github.com/actions/checkout/blob/main/CHANGELOG.md) - [Commits](actions/checkout@v3...v4) --- updated-dependencies: - dependency-name: actions/checkout dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Add dropdown_text argument to generate_header_nav_html (#1423) * Add dropdown_text argument to generate_header_nav_html * Add a test, fix typo in theme.conf and remove header_dropdown_text from docs/conf.py * fixed? --------- Co-authored-by: Daniel McCloy <[email protected]> * fix: rollback ref and Id changes (#1438) * bump: version 0.13.3 → 0.14.0 (#1440) * bump version * update version switcher * back to dev * fix: change the z-index of the dropdown (#1442) In order to be on top of the primary sidebar on small screens. * fix: set the same background for dark/light (#1443) * fix: set the same background for dark/light et the same background color for all state of the search field. It is currently only applied when hovered * fix: wrong css selector * Update src/pydata_sphinx_theme/assets/styles/components/_search.scss * Update src/pydata_sphinx_theme/assets/styles/components/_search.scss * Fix duplicate HTML IDs * fix tests * unique_html_id * backwards-compat generate_header_nav_html * feedback review * update fixture * ughhhh...caching * code cleanup * fix test snapshot * put comment inside def --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Denis Bitouzé <[email protected]> Co-authored-by: Stuart Mumford <[email protected]> Co-authored-by: Daniel McCloy <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Alenka Frim <[email protected]> Co-authored-by: Rambaud Pierrick <[email protected]> * chore: build the devcontainer automatically in codespace (#1483) * chore: build the devcontainer automaticallyin codespace * refactor: lint * add pandoc to the environment * Fix font color in search input box (#1524) * Fix color * Use --pst-color-text-base * docs: add DecentralChain (#1528) Co-authored-by: jourlez <[email protected]> * Updates for file src/pydata_sphinx_theme/locale/en/LC_MESSAGES/sphinx.po in ru [Manual Sync] (#1527) i18n: Translate sphinx.po in ru [Manual Sync] 96% of minimum 20% translated source file: 'sphinx.po' on 'ru'. Sync of partially translated files: untranslated content is included with an empty translation or source language content depending on file format Co-authored-by: transifex-integration[bot] <43880903+transifex-integration[bot]@users.noreply.github.com> * ignore transient errors in windows build CI (#1520) * use warning list * clean up notebook * refactor to pass on all platforms? * simplify * fix logic * iterate backwards * fix plaform detection? also don't log unnecessarily�[H * ignore empty string warnings * remove notebook metawarning * Revert "remove notebook metawarning" This reverts commit 42f4672. * try again * debug the mysterious empty warning * escape color codes * import * triage by intermittency, not by platform; better var names * simplify * fix list.remove * undo what I broke * Update tests/utils/check_warnings.py * refactor: remove extention on component set-up (#1529) * use event.key for search shortcut (#1525) * use event.key for search shortcut * suggestions from review * caps lock --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: gabalafou <[email protected]> Co-authored-by: Daniel McCloy <[email protected]> Co-authored-by: transifex-integration[bot] <43880903+transifex-integration[bot]@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Ned Batchelder <[email protected]> Co-authored-by: Adam Porter <[email protected]> Co-authored-by: Denis Bitouzé <[email protected]> Co-authored-by: Stuart Mumford <[email protected]> Co-authored-by: Alenka Frim <[email protected]> Co-authored-by: Harutaka Kawamura <[email protected]> Co-authored-by: jourlez <[email protected]> * fix: use a directive instead of raw html * fix: make links externals * fix: set reference in paragraphs * fix: missing parameter * fix: use the stem for the component name * refactor: remove never used variables * standardize component descriptions --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: gabalafou <[email protected]> Co-authored-by: Daniel McCloy <[email protected]> Co-authored-by: transifex-integration[bot] <43880903+transifex-integration[bot]@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Ned Batchelder <[email protected]> Co-authored-by: Adam Porter <[email protected]> Co-authored-by: Denis Bitouzé <[email protected]> Co-authored-by: Stuart Mumford <[email protected]> Co-authored-by: Alenka Frim <[email protected]> Co-authored-by: Harutaka Kawamura <[email protected]> Co-authored-by: jourlez <[email protected]> * fix: primer link in docs (#1556) * docs: add data-content (#1559) Reproduce the change made in Sphinx 7 sphinx-doc/sphinx@8e730ae#diff-a5066e933cbf65adc46e0d1ab9a0b44e0a53ca64cc95dca7e6aa902aed6bd468R105 * Obviate background-from-color-variable (#1558) * Obviate background-from-color-variable * backwards compatibility * fix: increase margins of autosummary tables (#1560) * fix: increase margins of autosummary tables * fix: the dl is not part of the table * use the real API selector * increase margin to 3rem * Fix control + k keyboard shortcut (#1571) * Fix control + k keyboard shortcut * Update src/pydata_sphinx_theme/assets/scripts/pydata-sphinx-theme.js * bump: 0.14.3 → 0.14.4 * back to dev * fix: install pandoc in the a11y tests (#1576) * Flip chevrons when subtree is expanded (#1584) * Fix landmarks (#1454) * add header * fix nav landmarks * only one main * label indices nav * few landmarks * unique id todos * fix test fixtures * fix translations * translations? * make version warning a landmark * revert translation changes * revert changes to noxfile.py * update tests to reflect translation reversal * add TODO comment to make string translatable --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: gresavage <[email protected]> Co-authored-by: tgresavage <[email protected]> Co-authored-by: Rambaud Pierrick <[email protected]> Co-authored-by: Daniel McCloy <[email protected]> Co-authored-by: transifex-integration[bot] <43880903+transifex-integration[bot]@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Ned Batchelder <[email protected]> Co-authored-by: Adam Porter <[email protected]> Co-authored-by: Denis Bitouzé <[email protected]> Co-authored-by: Stuart Mumford <[email protected]> Co-authored-by: Alenka Frim <[email protected]> Co-authored-by: Harutaka Kawamura <[email protected]> Co-authored-by: jourlez <[email protected]> Co-authored-by: Chris Holdgraf <[email protected]> Co-authored-by: Pierrick Rambaud <[email protected]>
* add header * fix nav landmarks * only one main * label indices nav * few landmarks * unique id todos * fix test fixtures * fix translations * translations? * make version warning a landmark * revert translation changes * revert changes to noxfile.py * update tests to reflect translation reversal * add TODO comment to make string translatable
Partially addresses #1428.
This PR fixes some Axe errors related to landmarks (duplicate main landmark, indistinct landmarks, and some content not contained within a landmark).
After
Here's how the browser "sees" the landmarks after this PR:
(the above screenshot was taken with the "landmarks" ad hoc tool in the Accessibility Insights browser extension)
Here's how the landmarks are shown in the VoiceOver rotor (Caps Lock + U):
Before
Here's how the browser sees landmarks before this PR
Landmarks in VoiceOver rotor: