Commit Graph
859 Commits
Author SHA1 Message Date
George Kalpakas 5a7eba294a fix(docs-infra): improve line-spacing between TOC items (esp. for wrapped lines) (#40802)
Previously, the line-spacing between different TOC items was almost the
same as that between wrapped lines of the same item. This made it more
diffucult to distinguish the different items.

This commit fixes this by reducing the line-spacing between wrapped
lines of the same item and keeping a larger line-spacing between
different items.

Before: ![toc line-spacing before][1]
After: ![toc line-spacing after][2]

[1]: https://user-images.githubusercontent.com/8604205/107255272-ccb81780-6a40-11eb-9612-4e7b2058417d.png
[2]: https://user-images.githubusercontent.com/8604205/107255280-cd50ae00-6a40-11eb-8f60-9ce8fba10e12.png

PR Close #40802
2021-02-16 08:39:49 -08:00
George Kalpakas 9740b1bb62 fix(docs-infra): fix sidenav top position on narrow screens (#40802)
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
2021-02-16 08:39:49 -08:00
George Kalpakas 01ed63522a fix(docs-infra): improve line-spacing between search results (esp. for wrapped lines) (#40802)
Previously, the line-spacing between different search result items was
the same as that between wrapped lines of the same result. This made it
difficult to distinguish the different results.

This commit fixes it by reducing the line-spacing between wrapped lines
of the same result item and keeping a larger line-spacing between
different results.

Before: ![search-results before][1]
After: ![search-results after][2]

[1]: https://user-images.githubusercontent.com/8604205/107229685-ca48c400-6a26-11eb-8161-0c0768b10a2d.png
[2]: https://user-images.githubusercontent.com/8604205/107229691-ccab1e00-6a26-11eb-9594-d4c37d0d72b2.png

PR Close #40802
2021-02-16 08:39:49 -08:00
George Kalpakas 2a302dd3cf fix(docs-infra): avoid page-breaks inside an image when printing (#40802)
Previously, when printing, a page-break could be inserted inside an
image (contained in a `.lightbox` element).

This commit ensures no page-breaks are inserted inside `.lightbox`
elements (which contain images).

Before: ![print-page-break before][1]
After: ![print-page-break after][2]

[1]: https://user-images.githubusercontent.com/8604205/106939709-48f0e900-6729-11eb-912c-e5cd0cb40897.png
[2]: https://user-images.githubusercontent.com/8604205/106939707-48585280-6729-11eb-8d5f-a12312f32056.png

PR Close #40802
2021-02-16 08:39:49 -08:00
George Kalpakas c98ab1f9e7 fix(docs-infra): fix search results top padding when a notification is visible (#40802)
Previously, when a notification was visible at the top of the page, the
search results pane had more top padding than necessary.

This commit fixes it by removing the extra padding.

Before: ![search-results before][1]
After: ![search-results after][2]

[1]: https://user-images.githubusercontent.com/8604205/106938100-3970a080-6727-11eb-8ae8-4e7a33af1daf.png
[2]: https://user-images.githubusercontent.com/8604205/106938103-3aa1cd80-6727-11eb-96f5-f607bde314be.png

PR Close #40802
2021-02-16 08:39:49 -08:00
George Kalpakas 93e2aea4bd fix(docs-infra): dim line-numbers in code examples (#40802)
This commit ensures that the line-numbers in code examples appear
"dimmed" to make it clearer that they are not part of the actual code.

Based on the CSS rules, it seems that the intention was to make it so,
but the color was incorrectly set on the `<ol>` elements instead of
targeting `li::marker`.

Before: ![line-numbers before][1]
After: ![line-numbers after][2]

[1]: https://user-images.githubusercontent.com/8604205/106937191-23aeab80-6726-11eb-9178-bdc067fa3d09.png
[2]: https://user-images.githubusercontent.com/8604205/106937184-227d7e80-6726-11eb-81d1-f709537b6a56.png

PR Close #40802
2021-02-16 08:39:48 -08:00
George Kalpakas 8cea3be8f7 fix(docs-infra): fix vertical alignment of contributor info items (#40802)
This commit fixes the vertical alignment of info items (i.e. links to
bio, Twitter, website) in the contributor list.

Before: ![contributor alignment before][1]
After: ![contributor alignment after][2]

[1]: https://user-images.githubusercontent.com/8604205/106926453-ca407f80-6719-11eb-9580-8614cc4f4907.png
[2]: https://user-images.githubusercontent.com/8604205/106926469-cd3b7000-6719-11eb-8ba8-c8ae01996c02.png

PR Close #40802
2021-02-16 08:39:48 -08:00
George Kalpakas 8f7fea4ad8 fix(docs-infra): clear unneeded DOM nodes in CodeExample/TabsComponent (#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
2021-02-16 08:39:48 -08:00
Kristiyan Kostadinov f2ee9d5679 refactor(docs-infra): use CDK clipboard service (#40840)
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
2021-02-16 07:43:56 -08:00
George Kalpakas 089a634053 refactor(docs-infra): use a single CSS class to target the API list container (#40704)
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
2021-02-09 10:47:19 -08:00
George Kalpakas defcd50b05 refactor(docs-infra): scope API list styles to the <aio-api-list> element (#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
2021-02-09 10:47:19 -08:00
George Kalpakas ae1a00760d refactor(docs-infra): move common .code-anchor styles to _code.scss (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 60f6e177b8 refactor(docs-infra): move common .symbol styles to _api-symbols.scss (#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
2021-02-09 10:47:19 -08:00
George Kalpakas bf63d92ea6 refactor(docs-infra): merge style rules in _api-list.scss (#40704)
This commit cleans up the styles in `_api-list.scss` by merging together
blocks that target the same elements.

PR Close #40704
2021-02-09 10:47:19 -08:00
George Kalpakas d214e79485 refactor(docs-infra): remove unused styles from _api-list.scss (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 3224c52503 refactor(docs-infra): scope TOC styles to the <aio-toc> element (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 67257aa64b refactor(docs-infra): merge style rules in _toc.scss (#40704)
This commit cleans up the styles in `_toc.scss` by merging together
blocks that target the same elements.

PR Close #40704
2021-02-09 10:47:19 -08:00
George Kalpakas b0cf35b8ff refactor(docs-infra): scope select-menu styles to the <aio-select> element (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 862fe82712 refactor(docs-infra): scope Resources styles to the <aio-resource-list> element (#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
2021-02-09 10:47:19 -08:00
George Kalpakas f1c7d2b865 refactor(docs-infra): merge style rules in _resources.scss (#40704)
This commit cleans up the styles in `_resources.scss` by merging
together blocks that target the same elements.

PR Close #40704
2021-02-09 10:47:19 -08:00
George Kalpakas 8528717892 refactor(docs-infra): remove unused styles from _resources.scss (#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
2021-02-09 10:47:19 -08:00
George Kalpakas becb8e751e refactor(docs-infra): merge style rules in _presskit.scss (#40704)
This commit cleans up the styles in `_presskit.scss` by merging together
blocks that target the same elements.

PR Close #40704
2021-02-09 10:47:19 -08:00
George Kalpakas c3a81916c9 refactor(docs-infra): merge style rules in _label.scss (#40704)
This commit cleans up the styles in `_label.scss` by merging together
blocks that target the same elements.

PR Close #40704
2021-02-09 10:47:19 -08:00
George Kalpakas 8a723daf6a refactor(docs-infra): remove unused styles from _label.scss (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 8beb9ae94f refactor(docs-infra): fix indentation in _label.scss (#40704)
This commit makes the indentation in `_label.scss` consistent with that
in most other `.scss` files in `aio/`.

PR Close #40704
2021-02-09 10:47:19 -08:00
George Kalpakas 489010c00a refactor(docs-infra): remove unused _edit-page-cta.scss file (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 59c9825be7 refactor(docs-infra): merge style rules in _details.scss (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 7d45667873 refactor(docs-infra): scope contributor-list styles to the <aio-contributor-list> element (#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
2021-02-09 10:47:19 -08:00
George Kalpakas cb4b8d9ab4 refactor(docs-infra): remove unused styles from _contributor.scss (#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
2021-02-09 10:47:19 -08:00
George Kalpakas 852010e31a refactor(docs-infra): scope code example styles to the <aio-code> element (#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
2021-02-09 10:47:19 -08:00