Fixes error: `TS2564: Property 'heroes' has no initializer and is not definitely assigned in the constructor`
and makes `hero` property consistent with ch 3 (ref: #40942)
PR Close#40970
Increases contrast of example copy.
Explicitly references inputs from labels.
Updates screenshot of styles that aren't accessible.
Removes the term master.
Provides more detailed alternate text for the image.
Adds padding to input so it is an easier target for touch or pointer.
PR Close#40575
Previously, in order to apply some styles to marketing (i.e. non-docs)
pages, we listed the various `.page-*` classes that corresponded to docs
pages. This meant that adding/removing a marketing page required updates
in several places, which is error-prone.
This commit avoids this by using a Sass mixin for applying styles to
marketing pages.
PR Close#40881
Previously, some of the marketing pages had different styles for the
top-nav than others (even if they had the same layout and
blue-background header). More specifically, the top-nav had a box-shadow
and it was absolutely positioned on some marketing pages, while it had
no box-shadow and was statically positioned on others.
This commit makes the appearance of marketing pages wrt the top-nav
consistent across all marketing pages by changing the styles for the
remaining pages:
- Contributors (`/about`)
- Contribute (`/contribute`)
- Press kit (`/presskit`)
Before: ![contribute topnav shadow before][1]
After: ![contribute topnav shadow after][2]
[1]: https://user-images.githubusercontent.com/8604205/107984898-a6aaee00-6fd1-11eb-8bf3-79393c8983ff.png
[2]: https://user-images.githubusercontent.com/8604205/107984900-a7438480-6fd1-11eb-8d9b-a643d69ab692.png
PR Close#40881
Previously, in order to apply some styles to docs (i.e. non-marketing)
pages, we listed the various `.folder-*` classes that corresponded to
docs pages. This meant that adding/removing a docs area required updates
in several places, which is error-prone.
This commit avoids this by using a Sass mixin for applying styles to
docs pages.
PR Close#40881
This commit removes some unnecessary styles setting `font-family` to
`$main-font`. These styles are redundant, because the targeted elements
already inherit this style from `<body>`.
PR Close#40881
This commit removes some CSS rules targeting `.doc-version select` in
the sidenav. These rules do not match any elements any more, since now
we use a custom `<aio-select>` component (instead of the `<select>`
element).
PR Close#40881
Previously, some of the links on the error pages had URLs prefixed with
`https://angular.io/`. This caused them to be treated as external URLs,
which had the following downsides:
- Links would always point to `angular.io` instead of the same version
as the error page (e.g. `next.angular.io` or `v11.angular.io`).
- Dgeni would not be able to check that the URLs are valid (i.e. point
to existing pages).
- An external link icon would incorrectly be shown next to the links on
`angular.io`.
This commit fixes the links to use relative URLs.
PR Close#40881
Our approach for handling cyclic imports results in code that is
not easy to tree-shake, so it is not suitable for publishing in a
library.
When compiling in partial compilation mode, we are targeting
such library publication, so we now create a fatal diagnostic
error instead of trying to handle the cyclic import situation.
Closes#40678
PR Close#40782
ChromeDriver now supports Apple Silicon ARM processors.
`webdriver-manager` versions 12.1.7 and earlier will, however,
incorrectly download the arm64 ChromeDriver regardless of the
system's architecture. This results in failure to run Protractor tests
on macOS with the error: `spawn Unknown system error -86`
This commit fixes the problem by upgrading `webdriver-manager` to
version 12.1.8, which includes a fix.
See also https://stackoverflow.com/questions/65618558.
PR Close#40756
In #40419 we move the code that creates the `heroes` object
above the code that updates the message service. But this moved
that line of code outside of the docregion that is displayed in
the tutorial ealier on, making it non-sensical.
This commit ensures that this line of code is now rendered in the
tutorial be moving it within the correct docregion.
Closes#40788
PR Close#40789
On larger screens the top-bar has a height of 64px. On screens smaller
than 600px, the top-bar has a height of 56px. As a result, the sidenav
should have a top position of 56px on screens smaller than 600px and
64px on other screens.
Previously, the style setting the top position to 56px was tied to the
presence of the `.collapsed` class, which depends on whether the sidenav
is docked or not. The change from docked to collapsed sidenav, however,
happens at 992px. As a result, the sidenav had an incorrect top position
(56px instead of 64px) on screens between 600px and 991px.
This commit fixes this by ensuring the change of the top position for
the sidenav happens at 600px.
PR Close#40802
Both `CodeExampleComponent` and `CodeTabsComponent` components receive
some code via content projection, grab the projected content and pass it
through to a `CodeComponent` instance for formatting and displaying.
Previously, the projected content was kept in the DOM (hidden). This
unnecessarily increased the number of DOM nodes.
This commit fixes this by clearing the projected DOM nodes once their
content has been captured.
PR Close#40802
Update the HTTP guide and associated example to demonstrate
how an interceptor can be used to provide a custom JSON parser.
Resolves#21079
PR Close#40645
After the docs UI redesign `h2` tags got a border top.
`border-top: 1px solid #dbdbdb;`;
In the sections of Getting Started guide in order to separate
`What's next` from above content an `<hr />` tag was used,
that now becomes unnecessary.
This commit removes unnecessary `<hr />` tags.
PR Close#40693
The "Usage Notes" section is often at the bottom of a long page of content
which can make it difficult to discover. This commit adds a link at the
end of the "Description" if there is a "Usage Notes" section on the page.
This link should help the reader to discover that there is more information
available further down the page.
This is basically a marginal fix. The longer term fix should be to
consider what content goes in which sections and how they should
be laid out on the page.
See #40753
PR Close#40835
The CDK has had a service for copying strings to the clipboard. These changes switch
AIO to it, rather than having to maintain a custom solution.
PR Close#40840
Initially raised due to #39509, this change updates our
"Support policy and schedule" with the same disclaimer
from the "Release frequency" section above.
PR Close#40770
`@angular/platform-server` provides the foundation for rendering an
Angular app on the server. In order to achieve that, it uses a
server-side DOM implementation (currently [domino][1]).
For rendering on the server to work as closely as possible to running
the app on the browser, we need to make DOM globals (such as `Element`,
`HTMLElement`, etc.), which are normally provided by the browser,
available as globals on the server as well.
Currently, `@angular/platform-server` achieves this by extending the
`global` object with the DOM implementation provided by `domino`. This
assignment happens in the [setDomTypes()][2] function, which is
[called in a `PLATFORM_INITIALIZER`][3]. While this works in most cases,
there are some scenarios where the DOM globals are needed sooner (i.e.
before initializing the platform). See, for example, #24551 and #39950
for more details on such issues.
This commit provides a way to solve this problem by exposing a
side-effect-ful entry-point (`@angular/platform-server/init`), that
shims the `global` object with DOM globals. People will be able to
import this entry-point in their server-rendered apps before
bootstrapping the app (for example, in their `main.server.ts` file).
(See also [#39950 (comment)][4].)
In a future update, the [`universal` schematics][5] will include such an
import by default in newly generated projects.
[1]: https://www.npmjs.com/package/domino
[2]: https://github.com/angular/angular/blob/0fc8466f1be392917e0c/packages/platform-server/src/domino_adapter.ts#L17-L21
[3]: https://github.com/angular/angular/blob/0fc8466f1be392917e0c/packages/platform-server/src/server.ts#L33
[4]: https://github.com/angular/angular/issues/39950#issuecomment-747598403
[5]: https://github.com/angular/angular-cli/blob/cc51432661eb4ab4b6a3/packages/schematics/angular/universal
PR Close#40559
The removed bit was copied and pasted from a previous section. Not relevent for the particular step of the tutorial.
The removed bit can we found as intended in __Adding Navigation__ section.
PR Close#40812
Observables are not the only async mechanism that Angular employs.
This change respects that application developers are not required to
use Observables in their own application architecture.
Closes#39155
PR Close#39237
This commit updates the documentation style guide
so that it is in line with current standards, those
of Google as well as those within the Angular docs.
PR Close#36281
Previously, if an entry-point had no public exports (such as the
`@angular/platform-server/shims` introduced in #40559, which is a
side-effect-ful entry-point), it was incorrectly marked as having all
its exports deprecated (which marks the entry-point as deprecated as
well).
This commit fixes this by ensuring that an entry-point is not marked as
having all its exports deprecated if it has no public exports.
PR Close#40737
Previously, the API list container (in the template of the
`<aio-api-list>` component) had three different CSS classes
(`.api-list-container`, `.docs-content`, `.l-content-small`) that were
all used for styling it. This seemed unnecessary and made it more difficult
to see what styles were applied to the container.
This commit removes the extra classes and consolidates the styles under
the `.api-list-container` class (which was the most descriptive one).
PR Close#40704
This commit ensures that all styles for the API list page (which are
defined in `_api-list.scss`) only apply to elements inside an
`<aio-api-list>` element. This will prevent the styles accidentally
taking effect on a different part of the app.
PR Close#40704
The `.code-anchor` class can be used anywhere where we have code
examples (including API pages and docs guides). Previously, global
styles for `.code-anchor` were defined in `_api-list.scss` (i.e. the
styles from `_api-list.scss` were also applied to `.code-anchor`
elements in other pages/components).
This commit moves the `.code-anchor` styles to `_code.scss`, which
contains other common code-related styles.
PR Close#40704
The `.symbol` CSS class (which is primarily used to denote the type of
API symbols - classes, functions, interfaces, etc.) are used in several
places:
- In the API list page (with the corresponding styles defined in
`_api-list.scss`).
- In search results (with the corresponding styles defined in
`_errors.scss`).
- In error list page (with the corresponding styles defined in
`search-results.scss`).
- In the `<aio-select>` component (with the corresponding styles defined
in `_select-menu.scss`).
Previously, global styles for `.symbol` were defined in `_api-list.scss`
(i.e. the styles from `_api-list.scss` were also applied to `.symbol`
elements in other places/components). Also, some of the SCSS files
mentioned above defined some duplicate styles for `.symbol`.
This commit moves the `.symbol` styles to a new `_api-symbols.scss`
file, which contains common symbol-related styles.
PR Close#40704
This commit removes some styles from `_api-list.scss` that are no longer
used (i.e. either their CSS selectors do not match any element in the
app or they are overridden by other rules).
PR Close#40704
This commit ensures that all styles for the TOC (which are defined in
`_toc.scss`) only apply to elements inside an `<aio-toc>` element. This
will prevent the styles accidentally taking effect on a different part
of the app.
PR Close#40704
This commit ensures that all styles for the select-menu element (which
are defined in `_select-menu.scss`) only apply to elements inside an
`<aio-select>` element. This will prevent the styles accidentally taking
effect on a different part of the app.
PR Close#40704
This commit ensures that all styles for the "Resources" page (which are
defined in `_resources.scss`) only apply to elements inside an
`<aio-resource-list>` element. This will prevent the styles accidentally
taking effect on a different part of the app.
PR Close#40704
This commit removes some styles from `_resources.scss` that are no
longer used (i.e. either their CSS selectors do not match any element in
the app or they are overridden by other rules).
PR Close#40704
This commit removes some styles from `_label.scss` that are no longer
used (i.e. their CSS selectors do not match any element in the app).
PR Close#40704
This commit removes the `_edit-page-cta.scss` file, which is no longer
used (i.e. the rules it contains do not match any element in the app).
PR Close#40704
This commit cleans up the styles in `_details.scss` by merging
together blocks that target the same elements.
It also changes the `summary` selector to `details > summary`, but that
should not make any difference in practice, since `<summary>` elements
always appear as direct childs of `<details>`.
PR Close#40704
This commit ensures that all styles for the contributor list (which are
defined in `_contributor.scss`) only apply to elements inside an
`<aio-contributor-list>` element. This will prevent the styles
accidentally taking effect on a different part of the app.
PR Close#40704
This commit removes some styles from `_contributor.scss` that are no
longer used (i.e. either their CSS selectors do not match any element in
the app or they are overridden by other rules).
PR Close#40704
This commit ensures that all styles for the code examples (which are
defined in `_code.scss`) only apply to elements inside an `<aio-code>`
element. This will prevent the styles accidentally taking effect on a
different part of the app.
PR Close#40704
This commit cleans up the styles in `_code.scss` by merging together
blocks that target the same elements.
It also normalizes the rules targeting Angular Material tabs to use
consistent selectors and use class names instead of tag names.
PR Close#40704
This commit removes some styles from `_code.scss` that are no longer
used (i.e. either their CSS selectors do not match any element in the
app or they are overridden by other rules).
PR Close#40704
Both `<aio-contributor-list>` and `<aio-resource-list>` contain
`.group-buttons` elements. Previously, global styles for
`.group-buttons` were defined in `_contributor.scss` (i.e. the styles
from `_contributor.scss` were also applied to `.group-buttons` in
`<aio-resource-list>`). Also, `_contributor.scss` and `_resources.scss`
defined some duplicate styles for `.group-buttons`.
This commit moves the `.group-buttons` styles to `_buttons.scss`, which
contains common button-related styles.
PR Close#40704
This commit ensures that all styles for the app top-menu (which are
defined in `_top-menu.scss`) only apply to elements inside an
`.app-toolbar` element. This will prevent the styles accidentally taking
effect on a different part of the app.
PR Close#40704
This commit cleans up the styles in `_top-menu.scss` by merging
together blocks that target the same elements.
It also makes similar changes to selectors in `_notification.scss` rules
that override top-menu styles (for consistency).
PR Close#40704
This commit ensures that all styles for the sidenav nav-items (which are
defined in `_sidenav.scss`) only apply to elements inside an
`<aio-nav-item>` element. This will prevent the styles accidentally
taking effect on a different part of the app.
PR Close#40704
This commit cleans up the styles in `_sidenav.scss` by merging
together blocks that target the same elements.
It also applies the equivalent changes in `_notification.scss` rules
that override sidenav styles.
PR Close#40704
This commit removes some styles from `_sidenav.scss` that are no longer
used (i.e. either their CSS selectors do not match any element in the
app or they are overridden by other rules).
PR Close#40704
This commit removes some styles from `_layout-global.scss` that are no
longer used (i.e. either their CSS selectors do not match any element in
the app or they are overridden by other rules).
PR Close#40704
This commit ensures that all styles for the page footer (which are
defined in `_footer.scss`) only apply to elements inside an
`<aio-footer>` element. This will prevent the styles accidentally taking
effect on a different part of the app.
PR Close#40704
This commit removes some styles from `_footer.scss` that are no longer
used (i.e. either their CSS selectors do not match any element in the
app or they are overridden by other rules).
PR Close#40704
This commit removes some styles from `_content-layout.scss` that are no
longer used (i.e. either their CSS selectors do not match any element in
the app or they are overridden by other rules).
PR Close#40704
This commit removes some styles for the `.heading` CSS class which do
not have any effect (either because they are overridden in other rules
or because they do not make any difference).
NOTE:
The `.heading` class is kept in the HTML to make it easier to associate
the `.heading-children` element with its corresponding `.heading`
parent.
PR Close#40427
This commit simplifies the styling of the "collapsed/expanded" icons in
sidenav nav-items with children by consolidating the CSS rules in one
block (instead of having duplicate blocks for different levels).
PR Close#40427
This commit fixes the layout and appearance of the cards shown in the
docs introduction page (`/docs`) in the following ways:
- Center the cards.
- Ensure two cards are shown per line (instead of 3 one the first line
and 1 on the second).
- Adjust their widths to ensure their content fits well in them
(given that the cards have a fixed height).
- Use more engaging styles to better indicate that the cards are
clickable (as discussed [here][1]).
[1]: https://github.com/angular/angular/pull/40427#discussion_r560688953
PR Close#40427
This commit cleans up the styles in `_card.scss` by:
- Fixing incosistenct indentation/newlines.
- Removing rules for unused selectors.
- Removing unnecessary styles.
PR Close#40427
This commit changes the layout of the main content to improve
legibility, especially on wider screens:
- Limit main content width to 50em (800px by default).
- Center main content on the page.
Co-authored-by: Stefanie Fluin <sjtrimble@gmail.com>
PR Close#40427
This commit includes some general improvements to heading styles
(font-weight, margin/padding). It also adds a horizontal separator above
`<h2>` headings to segment important sections more easily.
(As a consequence, we can remove several `<hr />` elements right before
`<h2>` headings.)
Co-authored-by: Stefanie Fluin <sjtrimble@gmail.com>
PR Close#40427
This commit improves the padding nav-menus and nav-items in the sidenav.
It also ensures that all nav-items have the same height, regardless of
their level and of whether they have children or not.
Co-authored-by: Stefanie Fluin <sjtrimble@gmail.com>
PR Close#40427
Previously, we used a box-shadow to indicate that the sidenav is
separate from the main content.
This commits updates the sidenav styling to remove the shadow and give
it a slightly different background color instead.
Co-authored-by: Stefanie Fluin <sjtrimble@gmail.com>
PR Close#40427
This commit adds a warning in the Elements guide about using
`@Component.selector` as the tag name for the registered custom element.
See also #40452 for context.
PR Close#40510
This new `base-authoring-package` captures all the settings, which
turns of potentially fatal checks, in one place. This new package is
then used as a base for all the docs-watch related packages, rather
than dotting the settings in a variety of different packages. This also
has the benefit that the standard configuration for doc-gen is fatal
on failed checks by default.
PR Close#40479
When using `docs-watch` we try to match the changed file
to a dgeni package in order to trigger a minimal set of processors.
Previously, if the changed file could not be matched we emitted an
ugly error. Now we provide a helpeful message.
PR Close#40479
We can define regions in our examples that can be referenced
and rendered in guides as code snippets. It is quite hard to ensure
that these regions are maintained correctly. One reason for this is
it is hard to know whether a region is being used or not.
This commit adds a new processor that checks for unused named
regions in examples and fails if any are found.
Fixes#19761
PR Close#40479
In the `docs-watch` job we attempt to guess what additional files need
to be processed given a change to a single file. Previously we were not
finding links to examples that were defined over multiple lines. E.g.
```
<code-pane
header="src/app/app.component.html"
region="hero-birthday-template"
path="pipes/src/app/app.component.html">
</code-pane>
```
This commit improves the regular expression to handle these cases.
PR Close#40479
This commits adds some shortcut definitions for the angular.io PWA. The
user agent can use them to assemble a context menu to be displayed by
the operating system when a user engages with the app's icon. (In
addition, shortcuts provide an easy way for users to add links to
specific pages on their home screen.)
See [here][1] for more details on the `shortcuts` property of the PWA
manifest.
The choice of pages to create shortcuts to was influenced by the
following facts/criteria:
- It seems that only the first 4 shortcuts are displayed by Chrome (at
least on my Android phone).
- Since the PWA is mostly used on mobile, I omitted pages that are less
likely to be useful for mobile users (such as pages related to CLI).
[1]: https://developer.mozilla.org/en-US/docs/Web/Manifest/shortcuts
PR Close#40393
This commit moves some properties with simple, string values in
`pwa-manifest.json` to the top (i.e. above the more lengthy `icons`
array) to make them easier to discover.
PR Close#40393
Previously we only logged a warning if we attempted to auto-link
to a doc that had no `path` property, which implies that it is private
and is not rendered.
Now we fail hard during full doc-gen, although when running the
`yarn serv-and-sync` command it should not fail if changes are
only made to guides, which is what authors who use this tool
are most likely to do.
PR Close#40404
Previously, only the first layer of sub-classes were filtered to remove
private exports. But on recursing down further levels these were not
filtered out.
PR Close#40404
This tag-def is being used in the `platform-server` source code,
and was causing warnings in the doc-gen. Adding support
prevents the warning from being shown.
Other than that this change has no effect on the generated
documentation, since the `@default` tag is not used in any
templates.
PR Close#40404
This commit updates `dgeni` to the latest version, which
will now only display the stack-trace after an error if the
logger is set to `debug`.
Fixes#39610
PR Close#40404
The previous commit introduced extra checks to verify contributors.json data and this commit contains the necessary
fixes to the problems identified by the new set of checks.
PR Close#40369
This commit adds extra steps to verify contributors.json data, such as checking `lead` and `mentor` field as well as
making sure the list is sorted alphabetically.
PR Close#40369
This commit renames contributors/check-pictures.js to contributors/validate-data.js, since this file script will also
be used to include other checks.
PR Close#40369
Currently entries in the `contributors.json` file are not sorted and new entries are typically added at the very
end of the file, which is often causing merge conflicts. This commit updates the `contributors.json` to have all
entries sorted in alphabetical order (based on GitHub handles), which should reduce the number of merge conflicts.
PR Close#40369
Providing an array to `[style]` bindings is not supported and the behavior
of the rendered style attribute is not as one might expect.
This commit removes that array example from the table to discourage its
use.
Fixes#40147
PR Close#40334
In #37182 the in-memory-web-api module was moved into this repo.
Make links in the docs point to the new location of the in-memory-web-api.
Fixes#40190
PR Close#40203
PR #34934 switched the `getting-started` docs example from using the
index of a product in the `products` array to using the product's ID
property for indentifiying each product in the `ProductDetailsComponent`
component. However, some necessary changes in the example code and the
`start-routing.md` guide were missed in #34934, resulting in broken
instructions for the readers (see #40189).
This commit is essentially a follow-up to #34934, making the remaining
changes in the example code and the guide instructions.
Fixes#40189
PR Close#40197
This commit slightly refactors the code in the `get-product` docregion
of the `getting-started` docs example to make it easier to follow.
PR Close#40197
This commit does some minor clean-up in docregions of the
`getting-started` docs example. More specifically, it:
- Removes redundant docregion markers.
- Fixes whitespace inconsistencies.
- Adds `/* ... */` to indicate that there is more code before the end of
a docregion (in order to avoid confusion).
PR Close#40197
This commit aligns the code and style in the `getting-started-v0` docs
example with that of the `getting-started` example more closely (except
for the the parts that are intentionally different between the two).
PR Close#40197
Carl Fredrik Samson
Kapunahele Wong
Daniel Díaz
George Kalpakas
Amadou Sall
DerekRTP
Dmitrij Kuba
David Shevitz
Pete Bacon Darwin
Alexey Elin
Brandon Winchester
Enea Jahollari
Dan Levy
Kristiyan Kostadinov
mgechev
Nils Mehlhorn
Jeremy Elbourn
Sam Hrncir
Nicholas Papadopoulos
Amit Gharat
Mickael Istria
Kanstantsin Kamkou
Valerij Dobler
hilmer-martin
Roman Sedov
Aristeidis Bampakos
David Pine
Alan Agius
Eliran Eliassy
Viktor Uhryn
twerske
Teri Glover
S. Iftekhar Hossain
Wataru.Kasahara
Newsha Hosseiny Nik
Justin Santa Barbara
cexbrayat
abarghoud
Tibing
bjarkler
Vytautas Petrikas
Santosh Yadav
Bill Ludwig
Andrew Kushnir
Pedro
Lincoln Baxter, III
Anuj Bhatnagar
Christian Liebel
sijmenhuizenga
Craig Spence
Harshit Chhipa
