Commit Graph

767 Commits

Author SHA1 Message Date
Sonu Kapoor 1b17722091 refactor(docs-infra): Lazy-loads SVG icons (#38268)
Prior to this commit, SVG icons were all loaded in the constructor
of the `CustomIconRegistry`. This commit avoids that, and loads SVG
icons on demand.

PR Close #38268
2020-07-29 10:32:54 -07:00
George Kalpakas b280d54470 refactor(docs-infra): simplify/improve `CopierService` hidden textarea creation (#38244)
This commit simplifies the creation of the temporary, hidden
`<textarea>` element used by `CopierService` by switching from absolute
to fixed positioning and not requiring page's scroll offset.

It also makes the following minor improvements:
- Make the element invisible (via `opacity: 0`).
- Instruct screen-readers to ignore the element (via
  `aria-hidden: true`).

NOTE: These improvements are based on Angular CDK's [PendingCopy][1]
      class and the changes proposed in PR angular/components#20073.

[1]: https://github.com/angular/components/blob/89b5fa89d1437c3054c5/src/cdk/clipboard/pending-copy.ts

PR Close #38244
2020-07-29 10:32:05 -07:00
George Kalpakas d96824acdb fix(docs-infra): preserve focus on copy (and prevent scrolling to bottom on IE11) (#38244)
The `CopierService` is used for copying text to the user's clipboard. It
is, for example, used in `CodeComponent` to copy example code snippets.
This is implemented by creating a temporary, hidden `<textarea>`
elements, setting its value to the text that needs to be copied,
executing the `copy` command and finally removing the element from the
DOM.

Previously, as a result of `CopierService`'s implementation, the focused
element would lose focus, while the temporary `<textarea>` element would
implicitly gain focus when selecting its contents. This had an even
worse side-effect on IE11, which seems to scroll to the bottom of the
containing element (here `<body>`) when the focused element is removed.

This commit fixes these issues by keeping track of the previously
focused element and restoring its focus after the copy operation.

NOTE: This fix is inspired by Angular CDK's [PendingCopy][1] class.

[1]: https://github.com/angular/components/blob/89b5fa89d1437c3054c5/src/cdk/clipboard/pending-copy.ts

Fixes #37796

PR Close #38244
2020-07-29 10:32:05 -07:00
George Kalpakas 9ebd461a22 refactor(docs-infra): improve code readability of `CopierService` (#38244)
This commit improves the code readability of the `CopierService` by:
- Adding/Improving JSDoc comments for methods.
- Avoiding unnecessary instance-wide properties.
- Fixing indentation to be consistent (at two spaces).
- Clearly separating the logic for creating and populating a
  `<textarea>` from the logic for selecting and copying its contents.

PR Close #38244
2020-07-29 10:32:05 -07:00
Saif ee22aa592e fix(docs-infra): correctly display copy button in IE11 (#38186)
Fix button top portion was clipped in IE11 by setting overflow to visible

Fixes #37816

PR Close #38186
2020-07-23 11:07:28 -07:00
George Kalpakas 7491b854b3 build(docs-infra): remove obsolete `typings.d.ts` files from angular.io and docs examples (#38173)
There were two `typings.d.ts` files with SystemJS module definitions in
`aio/src/` and `aio/tools/examples/shared/boilerplate/cli/`. These are
remnants from old CLI versions that used SystemJS and are no longer
needed. For docs examples specifically, these files were never copied
over to example projects and thus not included in StackBlitz projects
and ZIP archives.

This commit removes these obsolete files.

PR Close #38173
2020-07-22 10:15:09 -07:00
Saif b3b03c35b5 fix(docs-infra): correctly display SVG icons in IE11 (#38046)
Fix two issues that affected displaying of SVG icons in IE11:

1. All SVG icons except for one appeared empty. This was related how the
CustomIconRegistry re-used the same <div> element to create all
SVG elements.

2. The GitHub and Twitter buttons next to the search bar were not sized
properly.

Fixes #37847

PR Close #38046
2020-07-17 11:44:34 -07:00
Sonu Kapoor 6ea2d1e20e build(docs-infra): upgrade lighthouse to 6.1.0 (#37899)
To take advantage of lazy loaded images `img[loading=lazy]`, this commit
upgrades lighthouse to version 6.1.0.

Closes #35965

PR Close #37899
2020-07-15 12:38:07 -07:00
George Kalpakas 0a3dbc1e8a build(docs-infra): update @angular/cli to 10.0.1 (#37898)
This commit updates the version of Angular CLI used in angular.io to
version 10.0.1. It also reverts some changes (namely commits 38dfbc775f
and eee2fd22e0) which were made due to an older bug that is fixed in
the latest version. See #37688 for more details.

Fixes #37699

PR Close #37898
2020-07-08 16:02:46 -07:00
George Kalpakas b24a24ec58 refactor(docs-infra): avoid Material style duplication warning (#37898)
This commit removes some duplicate imports of Material themes and
theming-related utilities. While this change does not have any impact on
the size of the generated `styles.css` file, it silences a build warning
pointing to [Avoiding duplicated theming styles][1].

[1]: db4b0cd1bf/guides/duplicate-theming-styles.md

PR Close #37898
2020-07-08 16:02:46 -07:00
George Kalpakas 13ef5d6c7d build(docs-infra): update @angular/material to 10.0.1 (#37898)
This commit updates the version of Angular Components used in angular.io
to version 10.0.1. It also updates the angular.io app to adapt to
breaking changes.

PR Close #37898
2020-07-08 16:02:46 -07:00
George Kalpakas 79850983e6 fix(docs-infra): prevent search-bar from overlapping nav-items (#37938)
As part of angular.io's responsive layout, the menu shown in the top-bar
is collapsed into the sidenav on narrow screens at the point where the
search-bar (on the right side of the top-bar) would overlap with the
menu's nav-items.

Previously, the value used as break-point would work on marketing pages,
where the hamburger button is not shown on wide screens. However, on
docs pages (where the hamburger button is always shown, pushing the menu
further to the right), the search-bar would still overlap the menu
nav-items on some resolutions.

This commit fixes it by raising the screen width threshold at a value
that ensures there is no overlap even on pages where the hamburger
button is visible alongside the top-bar menu.

Fixes #37937

PR Close #37938
2020-07-06 13:57:37 -07:00
George Kalpakas fc7e77934f refactor(docs-infra): decouple showing the top-menu in top-bar from showing the sidenav (#37938)
As part of angular.io's responsive layout, the following rules are
applied:
- On wide screens, a menu is shown in the top-bar and the sidenav is
  shown side-by-side with the docs content.
- On narrow screens, the top-menu is moved from the top-bar to the
  sidenav and the sidenav is closed by default and floats over the
  content when manually opened.

Previously, the break-points at which the top-menu was shown in the
top-bar and the sidenav was shown side-by-side with the content were the
same (using a single variable).

This commit decouples the two break-points to make it possible to use
different values in the future.

PR Close #37938
2020-07-06 13:57:37 -07:00
George Kalpakas 90b93da743 refactor(docs-infra): use Sass variable for top-bar hamburger button show/hide threshold (#37938)
Use a Sass variable for the screen width break-point at which the
top-bar hamburger button is hidden/shown. This allows more easily
updating the break-point.

PR Close #37938
2020-07-06 13:57:37 -07:00
George Kalpakas 38dfbc775f ci(docs-infra): disable flaky tests (#37673)
I could not figure out the root cause of the flakes, so disabling the
flaky tests for now. See
https://github.com/angular/angular/pull/37637#issuecomment-647608149 for
more info.

Fixes #37629

PR Close #37673
2020-06-23 12:45:11 -07:00
Sonu Kapoor d330cd85ac refactor: move `hover` into a proper `@media` hover (#37320)
This commit moves the contributor hover into the `@media(hover:hover)`
query. This will help to identify if the user's primary input mechanism
can hover over elements.

PR Close #37320
2020-06-15 09:39:17 -07:00
Ajit Singh a075260751 docs: document how external link icons work (#37025)
After PR #36601 which added icons to all external links. Documented how this is happening via comments in scss file. For details visit PR #36601

PR Close #37025
2020-06-12 08:50:18 -07:00
Charles Lyding e836eaf448 fix(docs-infra): preconnect to analytics origins (#37400)
Lighthouse recommends preconnecting to important third-party origins.
See: https://web.dev/uses-rel-preconnect

PR Close #37400
2020-06-10 11:51:43 -07:00
Sonu Kapoor deac994517 refactor(docs-infra): remove `rev` property from `Resource` interface and data (#37181)
The `rev` property has been in the initial commit that introduced
`resources.json` (196203f6d7) and has been
added to all new entries since (always with the value `true`). This
field is a remnant from back when this data was stored in a Firebase
Database and the `rev` field indicated whether the entry has been
reviewed/approved by a DevRel lead or something. Now that the data is
kept in the repository and the reviewing is done as part of the
corresponding PR, this field is no longer necessary.

PR Close #37181
2020-05-19 10:10:56 -07:00
Alan Agius 1689f9378b test: fix AIO doc-viewer.component tests (#37129)
Some tests currently fail with a TS error
```
TS2783: 'id' is specified more than once, so this usage will be overwritten.
```

This changes fixes that.

PR Close #37129
2020-05-18 09:13:38 -07:00
Alan Agius 011fdfa94f build: improve types of `animateProp` (#37129)
Some properties in the DOM lib interface `CSSStyleDeclaration` are not assignable such as `getPropertyPriority` and `getPropertyValue`. With this change we filter out properties which type is not `string` to fix the below error;

```ts
ERROR in src/app/layout/doc-viewer/doc-viewer.component.ts:202:43 - error TS2322: Type 'string' is not assignable to type 'string & ((property: string) => string) & ((property: string) => string) & ((index: number) => string) & ((property: string) => string) & ((property: string, value: string | null, priority?: string | undefined) => void)'.
  Type 'string' is not assignable to type '(property: string) => string'.

202               ? this.void$.pipe(tap(() => elem.style[prop] = to))
                                              ~~~~~~~~~~~~~~~~
```

PR Close #37129
2020-05-18 09:13:38 -07:00
Ajit Singh ed1b4a8f19 docs: add migration guides to sidenav in updating to Version 9 (#34979)
All migration guides did not have a direct link to access them so added them to the side nav in the section updating to version 9 for direct access, it also helps to add right side nav to these migration guides

Fixes #33582

PR Close #34979
2020-05-08 14:45:17 -07:00
ajitsinghkaler bd30c37040 fix(docs-infra): add visual signal for external links (#36601)
Clicking on a link may take us to an extenal source, which may lead to user leaving angular.io unintentionally.

Added visual cues on external links so that user knows which links are external and which are intenal to angular.io.

Fixes #17620

PR Close #36601
2020-05-08 14:43:19 -07:00
Ajit Singh 39e066add1 refactor(docs-infra): change class to interface where class properties not used (#36958)
In resource.model.ts the interfaces of the resources were defined as classes, these do not use any class properties and are only used for type checking. So, changed them from class to interface.

PR Close #36958
2020-05-08 09:41:56 -07:00
George Kalpakas a468f11c7c build(docs-infra): update @angular/cli to 10.0.0-next.3 (#36145)
Update the Angular CLI and Angular framework packages to latest `@next`
versions. Also, update the app to look more closely to how a newly
generated app with the latest CLI would look like.

PR Close #36145
2020-05-05 11:50:29 -07:00
ajitsinghkaler d972821889 fix(docs-infra): contribute page not visible correctly on mobile devices (#36573)
on mobile devices screen size < 600px the contribute page is not visible in correct form changed styles to make it visible correctly

PR Close #36573
2020-04-13 08:19:01 -07:00
ajitsinghkaler 2d16b4711e fix(docs-infra): fix About page button text being truncated on small screens (#36576)
On small screens (e.g. on mobile), the text on some of the buttons in
the About page was truncated. Changed the text size, margin and
padding so that the the whole text is visible on such screens (320px to
480px).

PR Close #36576
2020-04-13 08:18:11 -07:00
Ajit Singh 96a3de6364 style(docs-infra): removed extra , from _resources.scss file (#35935)
there was a typo in _resourcess.scss file there was an extra comma added some spaces too that were needed for proper styling of the code

PR Close #35935
2020-04-07 15:08:57 -07:00
Ajit Singh 00027130ea fix(docs-infra): fix resources page tabs text which is not visible on small screens (#35935)
on small mobile screens the top tab bar contains text which was not visible on small screens changed text size, margin and padding so that the text could be contained in these screens (320px to 480px)

PR Close #35935
2020-04-07 15:08:57 -07:00
Alan Agius 04f61c0c3e build: enable `strictTemplates` in AIO (#36391)
PR Close #36391
2020-04-02 10:53:12 -07:00
Stephen Fluin ec8bae1b27 docs: update end date of survey to middle of April (#36339)
PR Close #36339
2020-04-01 11:10:58 -07:00
Stephen Fluin 0d806c84e2 docs: add developer survey 2020 (#35655)
PR Close #35655
2020-03-11 16:10:47 -07:00
George Kalpakas d8f9ec5291 refactor(docs-infra): merge `.api-body` style blocks (#31574)
This commit merges the two `.api-body` style blocks, removing duplicate
styles and re-ordering sub-blocks (to group relevant styles together).
It should not affect styling.

PR Close #31574
2020-03-11 14:47:16 -04:00
George Kalpakas 7bd5368d8b refactor(docs-infra): remove duplicate `.github-links` styles (#31574)
PR Close #31574
2020-03-11 14:47:16 -04:00
Stefanie Fluin cffbaba914 fix(docs-infra): make API member name bold (#31574)
- Return API member name bold font weight
- SCSS formatting cleanup

Closes #31494

PR Close #31574
2020-03-11 14:47:16 -04:00
Ajit Singh 876aa5a78a fix(docs-infra): in 404 page some text is not visible (#35866)
In pr #34978 colors were not properly set, if we type wrong url in the browser and we are directed to the 404 page there some text is set to white color which as not visible set it to dark gray for visibility

PR Close #35866
2020-03-05 16:00:52 -05:00
Sonu Kapoor 3b0b90527e fix(docs-infra): add top level folders into `topLevelFolders` (#35815)
Closes #35676

PR Close #35815
2020-03-03 08:59:10 -08:00
Sonu Kapoor 0a5a841994 test(docs-infra): add proxy to fake images in tests (#35741)
Previously, when running the unit tests for aio on Windows, many 404s
are logged for images, resulting in progress logs being spread over
multiple lines. This commit fixes this by adding a `proxy` to point
the fake image to a real image within the `src` folder.

Closes #29775

PR Close #35741
2020-03-02 08:16:34 -08:00
Sonu Kapoor de4e17b76e fix(docs-infra): fix redirect in angular version selector (#35632)
Closes #35630

PR Close #35632
2020-02-28 07:11:33 -08:00
ajitsinghkaler 01ab168774 feat(docs-infra): add useful links if landed on 404 page and no search results found (#34978)
Added additional links which can help user find the things they are
looking for when there are no search results (when searching or on a 404
page).

Note:
This commit increases the main bundle's payload size due to the extra
content of the `aio-search-results` component.

Fixes #31532

PR Close #34978
2020-02-27 11:01:59 -08:00
Sonu Kapoor 0b97d07ad6 test(docs-infra): fix tests with new `topics` property (#35539)
PR Close #35539
2020-02-27 10:47:52 -08:00
Sonu Kapoor 7ca2a2a863 feat(docs-infra): add `searchKeywords` preprocessor (#35539)
This commit adds a new preprocessor to use `${@searchKeywords}`, allowing
the docs to use a list of custom search phrases that will be
prioritized over the keywords found in the content.

Closes #35449

PR Close #35539
2020-02-27 10:47:52 -08:00
George Kalpakas 975a11b37f fix(docs-infra): do not break when cookies are disabled in the browser (#35557)
Whenever cookies are disabled in the browser, `window.localStorage` is
not avaialable to the app (i.e. even trying to access
`window.localStorage` throws an error).

To avoid breaking the app, we use a no-op `Storage` implementation if
`window.localStorage` is not available.

(This is similar to #33829, but for `localStorage` instead of
`sessionStorage`.)

Fixes #35555

PR Close #35557
2020-02-26 12:54:54 -08:00
George Kalpakas 2aa940f55c fix(docs-infra): highlight the currently active node in top-bar (#33351)
Related to #33239 and #33255.

PR Close #33351
2020-02-20 10:52:54 -08:00
George Kalpakas 34b84f61e0 fix(docs-infra): use `.tooltip` in `aio-top-menu` items (#33351)
The top-menu items have both a `title` and a `tooltip` property. The
`title` is used as text content, so there is little point in using it as
"tooltip" (via the HTMLElement's `title` property) too.

This commit switches to using the `tooltip` property to populate the
`title`. Note that in many cases, the `tooltip` property is derived from
`title` anyway (so there is no practical change in behavior in these
cases).

PR Close #33351
2020-02-20 10:52:53 -08:00
Stefanie Fluin 1997b86a00 fix(docs-infra): improve focus styles in topnav and footer (#33255)
Fixes #33239

PR Close #33255
2020-02-19 12:51:27 -08:00
Sonu Kapoor 183a8629a4 fix(docs-infra): set `th`/`td` to proper width (#35437)
Previously, the tables on the event page were misaligned. This commit
fixes this by setting the width of all `td`'s and `th`'s.

PR Close #35437
2020-02-18 12:48:31 -08:00
Sonu Kapoor 2f18e8565e style(docs-infra): properly format files (#35318)
PR Close #35318
2020-02-18 12:45:07 -08:00
Sonu Kapoor a788d585f8 fix(docs-infra): preserves query and hash when switching angular versions (#35318)
Previously, when switching angular versions through the
version selector in the sidenav, the query and hash is lost.
The user has to manually navigate to the original location again.

This commit fixes this issue and preserves the query and hash
when navigating between different versions.

Closes #24495

PR Close #35318
2020-02-18 12:45:07 -08:00
ajitsinghkaler 7b56daffe6 fix(docs-infra): add fallback to web fonts so downloading does not block rendering (#35352)
Light house was reporting that 'Ensure text remains visible during webfont load' solution to this problem was adding &swap to the end of web fonts this leads to our first text showing before web-font download and improves the performance of site link to article: https://web.dev/font-display/\?utm_source\=lighthouse\&utm_medium\=lr

PR Close #35352
2020-02-18 12:43:16 -08:00