improve the accessibility of the aio-select component so that it is
clear for screen reader users its functionality (currently it is
presented as a simple button), following the WAI-ARIA authoring
practices (see: https://www.w3.org/TR/wai-aria-practices/#combobox)
A first attempt in improving the accessibility of the component has been
tried in PR #45937 by replacing it with the material select component,
such implementation has however been scrapped since the increase of
payload sizes has proven prohibitively large
(also note that given native select elements haven't been used given the lack
of syling options for such elements)
PR Close#46013
add proper aria-labels for the twitter and website link of contributors
(which being icons they have no text) so that they can be correctly read
by screenreaders
also add aria-labels to the view-bio buttons for a better user
experience
PR Close#46324
This commit adds a tag processor for `@developerPreview`. Adding this tag to
an exported symbol or to a decorator parameter causes an API status tag to
be shown for the API which links to the Developer Preview documentation.
PR Close#46050
add a role and an aria-label to the aio-notification component so that
it can be handled better by assistive technologies
resolves#44345
PR Close#45770
Update angular.io to the latest prerelease versions of Angular CLI and
framework (v14.0.0-rc.0).
Also update angular.io to more closely align with new CLI apps. See also
the [diff][1] between a basic v13.0.0-next.9 CLI app and a v14.0.0-rc.0
one.
[1]: https://github.com/cexbrayat/angular-cli-diff/compare/13.0.0-next.9...14.0.0-rc.0
PR Close#45997
in the aio resources page there is a main h1 heading and then the next
headings used are h3 and h4, thus h2 is being skipped, change such
headings so that there is no heading skipping (which is a bad practice
and can result to confusing experiences from screen reader users)
PR Close#45822
currently the aio home page presents a single h1 which is ignored by
assistive technologies since it has its display set none, so replace it
with a new h1 containing the main text of the page instead
PR Close#45740
replace the generic `*` selector used in the alert styling with
`p` (which is what gets generated from the markdown) as the styling adds
margins which are not always wanted
PR Close#45761
use border-top-width instead of padding-top as the strategy for moving
the search-results panel down, this fixes the issue of the panel going
behind the toolbar (which causes either overlapping text in the home
page or the results scrollbar to be hidden behind the toolbar in other
pages)
PR Close#45579
The footer uses `h3` elements out of order, which causes a "Heading
elements are not in a sequentially-descending order" a11y error.
Replace the `h3` elements with `div` to improve a11y.
Fixes#44338
PR Close#45510
Previously, only `language="sh"` and `language="bash"` would be
recognized (and formatted) as cli commands in `<code-example>`.
This commit adds `shell` to the list of languages recognized as cli
commands.
(NOTE: This will fix the [CI failures][1] in #45325.)
[1]: https://circleci.com/gh/angular/angular/1145559
PR Close#45551
currently if a user tries to navigate via keyboard, once the are
presented with search results, the search results panel remains
present and can potentially hide most of the content on the page,
in such case keyboard navigation will be severly hindered and
the only option for the user would be to go back to the seach input
text and clear its value, fix such inconvenience by looping the
focus in the header area close to the search results and the
results panel itself
note: an alternative implementation using the cdkTrapFocus has been
attempted in PR #45194, such alternative implementation presented a
number of (minor) drawbacks (including the increase main bundle size
due to the inclusion of the A11yModule), so it was agreed to proceed
with the manual implementation present in these changes instead.
PR Close#44989
assign different aria labels to the primary nav and the one used for
guides and docs, so that impaired users can more easily distinguish the
two
PR Close#45209
remove redundant main role as pages should always have a
single element with a main role (also remove the role assigne
to the main tag as that is implied)
PR Close#45209
currently the navigation ul used in aio-top-menu has a role of
navigation, but listitems should be owned by list parents
(see more: https://www.w3.org/TR/wai-aria-1.1/#listitem)
so wrap the ul in a nav and remove the role="navigation" from the
ul element to fix such issue
resolves#44562resolves#16938 (the second point)
PR Close#45209
.substr() is deprecated so we replace it with functions which work similarily but aren't deprecated
Signed-off-by: Tobias Speicher <rootcommander@gmail.com>
PR Close#45397
the header hamburger menu gets removed from the page by moving it
outside the screen, it can however still be accessed via keyboard
navigation, add a visibility hidden to the element to prevent such
behavior
PR Close#45067
Previously, when the notification text did not fit on the viewport
width, it got truncated and it was not possible to see the whole text.
This commit fixes this by making the notification scrollable when the
text overflows.
PR Close#44900
On smaller screens, the action button in `NotificationComponent` is
hidden (due to limited horizontal screen "real estate"). Thus, the only
way to perform the action is to click on the notification message, which
is typically a link.
Previously, the link inside the notification did not take up the whole
height of the notification bar. As a result, clicking outside the link
would dismiss the notification without following the link.
This commit makes it easier to interact with the notification (esp. on
smaller screens) by ensuring the link covers the whole notification bar
(width and height).
PR Close#44900
The survey id is used as a key in the local storage to keep the state (don't show the message again). Reusing this survey id will make the message invisible to some users who already have that key in local storage.
PR Close#44865
The jasmine types for `spyObj.calls().all()` seem to be more specific,
relying on `ThisType<Fn>` to determine the context/receiver for an invoked
spy. This type does not work as expected with class members as it seems.
This commit fixes three of these type checking failures by explicitly casting
the spy context to the actual class owning the method member.
PR Close#44735
Refs #42966.
Look for changes in error docs (i.e. docs under `aio/content/error/`) in
`authors-package`, so that such docs are tracked when running the
`serve-and-sync` script.
PR Close#44704
Mock dates in EventsComponent tests are parsed in inconsistent ways
across platforms/browsers, which makes the comparison to the mocked
UTC "now" date behave differently causing the test to fail. This fix
ensures that the mocked "now" date is parsed in the same way as the
test dates to avoid inconsistencies.
PR Close#44763
since IE11 is no longer a supported browser, remove angular.io code
implemented specifically for IE11 support
this change reverts the following PRs:
- #26059 (slightly)
- #28188 (fully)
- #32871 (fully)
- #41183 (partially)
PR Close#44570
the height of code links (anchors inside code tags or
code tags inside anchors) is inconsistent, fix such
issue by also making sure that code links to external
resources do not get wrongly styled
PR Close#44376
improve aio-footer's layout by using grid instead of flexbox,
such change makes it so that we have four columns on wide window
sizes (desktop), two columns on medium window sizes (desktop/tablet)
and a single column on small window sizes (mobile), compared to the
flex implementation which could only have either 4 columns or 1
this makes the footer look generally nicer for various window sizes
(especially in the middle range in which one column was too little
and four were too much)
note: also a scroll of auto has been added so we that we can be sure
that overflowing footer content never creates a global layout issue
PR Close#44532
The year has advanced by one cycle. In accordance with this
practice, we increment the value of the bounding set of our
license year by one.
PR Close#44590
safari handles rem based media queries differently so in order to
provide a similar user-experience to safari users, add a new
safari-only media query for the footer's flex container
resolves#44242
PR Close#44266
The `.code-anchor` styling was overriding the `.deprecated-api-item` styling.
The `text-decoration` is not needed on `.code-anchor` since it inherits this from the `a` rule in the typography.scss file.
Fixes#44264
PR Close#44275
currently the aio footer sits outside the mat-sidenav-container, as a
result when the mat-sidenav in over mode appears, the footer is not
placed under the sidenav backdrop, move the footer inside the
mat-sidenav-container so that it does
PR Close#44236
remove the top padding for the homepage article, instead of
having that top padding and moving the element up via a
negative bottom margin in the intro section
note: the result is identical except for when the article's media query
is applied, the difference is barely noticeable anyways
PR Close#44126
the aio homepage has a fixed width for its hero content,
that is not handling well certain window widths, fix that by removing
the fixed width and tweaking related media queries
PR Close#44126
dario-piotrowicz
