Skip to content

Commit 77ead59

Browse files
authored
Merge pull request tomalaforge#566 from jdegand/view-transition-typos
fix: view transition typos
2 parents 107395e + 3ec53b3 commit 77ead59

File tree

1 file changed

+7
-7
lines changed

1 file changed

+7
-7
lines changed

docs/src/content/docs/challenges/angular/44-view-transition.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,16 +12,16 @@ sidebar:
1212
## Information
1313

1414
The View Transition API is a brand new API that provides a set of features that allow developers to control and manipulate the transitions and animations between views within an application.
15-
It plays a pivotal role in enhancing user experience (UX), bringing applications to life with engaging and captivating transitions to guide users through different pages or sections of the app.
15+
It plays a pivotal role in enhancing the user experience (UX), bringing applications to life with engaging and captivating transitions to guide users through different pages or sections of the app.
1616

1717
The goal of this challenge is to learn about and manipulate all types of transitions proposed by the API.
1818

1919
To use the API, Angular provides a function `withViewTransitions()` that needs to be injected inside the router config.
2020

21-
I would advise you to read the [Chrome documentation](https://developer.chrome.com/docs/web-platform/view-transitions). You will learn everything necessary to successfully complete the challenge.
21+
I would advise you to read the [Chrome documentation](https://developer.chrome.com/docs/web-platform/view-transitions). You will learn everything that is necessary to successfully complete the challenge.
2222

2323
Here, however, is a short summary:
24-
Firstly, each target DOM element has two states; an `old` one when the element is leaving the page, and a `new` one when it's entering the page:
24+
Firstly, each target DOM element has two states: an `old` one when the element is leaving the page, and a `new` one when it's entering the page:
2525

2626
```css
2727
::view-transition-old(root) {
@@ -46,7 +46,7 @@ This allows you to create an animation for this element only.
4646
Lastly, if the same element is present in both views, you can automate the transition by assigning the same **transition name**.
4747

4848
:::danger
49-
Remenber, you can have only ONE UNIQUE `view-transition-name` per page.
49+
Remember, you can have only ONE UNIQUE `view-transition-name` per page.
5050
:::
5151

5252
## Statement
@@ -63,12 +63,12 @@ To the final state shown in the following video:
6363

6464
Observe the following:
6565

66-
- The header slides in and out
67-
- Each element smoothly transitions to its new location
66+
- The header slides in and out.
67+
- Each element smoothly transitions to its new location.
6868

6969
### Level 1
7070

71-
Focus only on the first thumbnail and create a seamless and pleasing transition
71+
Focus only on the first thumbnail and create a seamless and pleasing transition.
7272

7373
### Level 2
7474

0 commit comments

Comments
 (0)