[Doc EN]: guide/routing.md review
#235
Conversation
Signed-off-by: Bruno Lesieur <[email protected]>
Signed-off-by: Bruno Lesieur <[email protected]>
| @@ -88,7 +88,7 @@ router: { | |||
|
|
|||
| As you can see the route named `users-id` has the path `:id?` which makes it optional, if you want to make it required, create an `index.vue` file in the `users/_id` directory. | |||
|
|
|||
| <p class="Alert Alert--info">Warning: dynamic routes are ignored by the `generate` command: [API Configuration generate](/api/configuration-generate#routes)</p> | |||
| <p class="Alert Alert--info"><b>Warning:</b> dynamic routes are ignored by the `generate` command: [API Configuration generate](/api/configuration-generate#routes)</p> | |||
There was a problem hiding this comment.
More consistency with previous « Info: » box.
en/guide/routing.md
Outdated
| @@ -115,7 +115,7 @@ Nuxt.js lets you create nested route by using the children routes of vue-router. | |||
|
|
|||
| To define the parent component of a nested route, you need to create a Vue file with the **same name as the directory** which contain your children views. | |||
|
|
|||
| <p class="Alert Alert--info">Don't forget to write `<nuxt-child/>` inside the parent component (.vue file).</p> | |||
| <p class="Alert Alert--nuxt-green"><b>Info:</b> don't forget to write `<nuxt-child/>` inside the parent component (<code>.vue</code> file).</p> | |||
There was a problem hiding this comment.
Because it's an info, maybe we can use the « Info » design and not use the « Warning » design (see above).
| @@ -213,15 +213,16 @@ router: { | |||
|
|
|||
| ## Transitions | |||
|
|
|||
| Nuxt.js uses the [<transition>](http://vuejs.org/v2/guide/transitions.html#Transitioning-Single-Elements-Components) component to let you create amazing transitions/animations between your routes. | |||
| Nuxt.js uses the [`<transition>`](http://vuejs.org/v2/guide/transitions.html#Transitioning-Single-Elements-Components) component to let you create amazing transitions/animations between your routes. | |||
There was a problem hiding this comment.
Because it's a code pattern we use the tick
|
|
||
| ### Global Settings | ||
|
|
||
| <p class="Alert Alert--info">Nuxt.js default transition name is `"page"`.</p> | ||
| <p class="Alert Alert--nuxt-green"><b>Info :</b> Nuxt.js default transition name is `"page"`.</p> |
There was a problem hiding this comment.
Because it's an info. For more consistency with previous « Info : »
|
|
||
| To add a fade transition to every page of your application, we need a CSS file that is shared across all our routes, so we start by creating a file in the `assets` folder. | ||
|
|
||
| Our global css in `assets/main.css`: | ||
|
|
There was a problem hiding this comment.
By convention, each paragraph and code block are distant from one empty line.
| @@ -247,6 +249,7 @@ More information about the transition key: [API Configuration transition](/api/p | |||
| You can also define a custom transition for only one page with the `transition` property. | |||
|
|
|||
| We add a new class in our global css in `assets/main.css`: | |||
|
|
|||
There was a problem hiding this comment.
By convention, each paragraph and code block are distant from one empty line.
| @@ -257,6 +260,7 @@ We add a new class in our global css in `assets/main.css`: | |||
| ``` | |||
|
|
|||
| then, we use the transition property to define the class name to use for this page transition: | |||
|
|
|||
There was a problem hiding this comment.
By convention, each paragraph and code block are distant from one empty line.
| @@ -280,13 +284,15 @@ export default function (context) { | |||
| ``` | |||
|
|
|||
| The middleware will be executed in series in this order: | |||
|
|
|||
There was a problem hiding this comment.
By convention, each paragraph and code block are distant from one empty line.
| 1. `nuxt.config.js` | ||
| 2. Matched layouts | ||
| 3. Matched pages | ||
|
|
||
| A middleware can be asynchronous, simply return a `Promise` or use the 2nd `callback` argument: | ||
|
|
||
| `middleware/stats.js` | ||
|
|
There was a problem hiding this comment.
By convention, each paragraph and code block are distant from one empty line.
| @@ -300,6 +306,7 @@ export default function ({ route }) { | |||
| Then, in your `nuxt.config.js`, layout or page, use the `middleware` key: | |||
|
|
|||
| `nuxt.config.js` | |||
|
|
|||
There was a problem hiding this comment.
By convention, each paragraph and code block are distant from one empty line.
Signed-off-by: Bruno Lesieur <[email protected]>
|
Hi @atinux, I suggest you this second PR on five. |
|
🙌 |
In our French translation/review we have changed some consistent things, so we suggest you do the same in the original documentation.
More details in comments.
Do not hesitate to set back the original behavior for some changes if you think they do not make sense.