Skip to content

Commit 1a2b6fc

Browse files
committed
docs: improve typography
Some characters, like quotes and ellipses, are automatically replaced with their typographic counterparts on the website, but dashes remain as-is, and we want the pretty ones.
1 parent 1aafbc4 commit 1a2b6fc

File tree

6 files changed

+12
-12
lines changed

6 files changed

+12
-12
lines changed

documentation/docs/06-runtime/03-lifecycle-hooks.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ Svelte 4 contained hooks that ran before and after the component as a whole was
9494
</script>
9595
```
9696

97-
Instead of `beforeUpdate` use `$effect.pre` and instead of `afterUpdate` use `$effect` instead - these runes offer more granular control and only react to the changes you're actually interested in.
97+
Instead of `beforeUpdate` use `$effect.pre` and instead of `afterUpdate` use `$effect` instead these runes offer more granular control and only react to the changes you're actually interested in.
9898

9999
### Chat window example
100100

documentation/docs/07-misc/02-testing.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -294,7 +294,7 @@ E2E (short for 'end to end') tests allow you to test your full application throu
294294

295295
You can use the Svelte CLI to [setup Playwright](/docs/cli/playwright) either during project creation or later on. You can also [set it up with `npm init playwright`](https://playwright.dev/docs/intro). Additionally, you may also want to install an IDE plugin such as [the VS Code extension](https://playwright.dev/docs/getting-started-vscode) to be able to execute tests from inside your IDE.
296296

297-
If you've run `npm init playwright` or are not using Vite, you may need to adjust the Playwright config to tell Playwright what to do before running the tests - mainly starting your application at a certain port. For example:
297+
If you've run `npm init playwright` or are not using Vite, you may need to adjust the Playwright config to tell Playwright what to do before running the tests mainly starting your application at a certain port. For example:
298298

299299
```js
300300
/// file: playwright.config.js

documentation/docs/07-misc/06-v4-migration-guide.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,7 @@ Transitions are now local by default to prevent confusion around page navigation
137137
{/if}
138138
```
139139
140-
To make transitions global, add the `|global` modifier - then they will play when _any_ control flow block above is created/destroyed. The migration script will do this automatically for you. ([#6686](https://github.com/sveltejs/svelte/issues/6686))
140+
To make transitions global, add the `|global` modifier then they will play when _any_ control flow block above is created/destroyed. The migration script will do this automatically for you. ([#6686](https://github.com/sveltejs/svelte/issues/6686))
141141
142142
## Default slot bindings
143143
@@ -150,10 +150,10 @@ Default slot bindings are no longer exposed to named slots and vice versa:
150150

151151
<Nested let:count>
152152
<p>
153-
count in default slot - is available: {count}
153+
count in default slot is available: {count}
154154
</p>
155155
<p slot="bar">
156-
count in bar slot - is not available: {count}
156+
count in bar slot is not available: {count}
157157
</p>
158158
</Nested>
159159
```

documentation/docs/07-misc/07-v5-migration-guide.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ title: Svelte 5 migration guide
44

55
Version 5 comes with an overhauled syntax and reactivity system. While it may look different at first, you'll soon notice many similarities. This guide goes over the changes in detail and shows you how to upgrade. Along with it, we also provide information on _why_ we did these changes.
66

7-
You don't have to migrate to the new syntax right away - Svelte 5 still supports the old Svelte 4 syntax, and you can mix and match components using the new syntax with components using the old and vice versa. We expect many people to be able to upgrade with only a few lines of code changed initially. There's also a [migration script](#Migration-script) that helps you with many of these steps automatically.
7+
You don't have to migrate to the new syntax right away Svelte 5 still supports the old Svelte 4 syntax, and you can mix and match components using the new syntax with components using the old and vice versa. We expect many people to be able to upgrade with only a few lines of code changed initially. There's also a [migration script](#Migration-script) that helps you with many of these steps automatically.
88

99
## Reactivity syntax changes
1010

@@ -23,7 +23,7 @@ In Svelte 4, a `let` declaration at the top level of a component was implicitly
2323
Nothing else changes. `count` is still the number itself, and you read and write directly to it, without a wrapper like `.value` or `getCount()`.
2424

2525
> [!DETAILS] Why we did this
26-
> `let` being implicitly reactive at the top level worked great, but it meant that reactivity was constrained - a `let` declaration anywhere else was not reactive. This forced you to resort to using stores when refactoring code out of the top level of components for reuse. This meant you had to learn an entirely separate reactivity model, and the result often wasn't as nice to work with. Because reactivity is more explicit in Svelte 5, you can keep using the same API outside the top level of components. Head to [the tutorial](/tutorial) to learn more.
26+
> `let` being implicitly reactive at the top level worked great, but it meant that reactivity was constrained a `let` declaration anywhere else was not reactive. This forced you to resort to using stores when refactoring code out of the top level of components for reuse. This meant you had to learn an entirely separate reactivity model, and the result often wasn't as nice to work with. Because reactivity is more explicit in Svelte 5, you can keep using the same API outside the top level of components. Head to [the tutorial](/tutorial) to learn more.
2727
2828
### $: → $derived/$effect
2929

@@ -120,7 +120,7 @@ In Svelte 5, the `$props` rune makes this straightforward without any additional
120120
121121
## Event changes
122122

123-
Event handlers have been given a facelift in Svelte 5. Whereas in Svelte 4 we use the `on:` directive to attach an event listener to an element, in Svelte 5 they are properties like any other (in other words - remove the colon):
123+
Event handlers have been given a facelift in Svelte 5. Whereas in Svelte 4 we use the `on:` directive to attach an event listener to an element, in Svelte 5 they are properties like any other (in other words remove the colon):
124124

125125
```svelte
126126
<script>
@@ -154,7 +154,7 @@ Since they're just properties, you can use the normal shorthand syntax...
154154

155155
In Svelte 4, components could emit events by creating a dispatcher with `createEventDispatcher`.
156156

157-
This function is deprecated in Svelte 5. Instead, components should accept _callback props_ - which means you then pass functions as properties to these components:
157+
This function is deprecated in Svelte 5. Instead, components should accept _callback props_ which means you then pass functions as properties to these components:
158158

159159
```svelte
160160
<!--- file: App.svelte --->
@@ -462,7 +462,7 @@ In Svelte 4, you would pass data to a `<slot />` and then retrieve it with `let:
462462
463463
## Migration script
464464

465-
By now you should have a pretty good understanding of the before/after and how the old syntax relates to the new syntax. It probably also became clear that a lot of these migrations are rather technical and repetitive - something you don't want to do by hand.
465+
By now you should have a pretty good understanding of the before/after and how the old syntax relates to the new syntax. It probably also became clear that a lot of these migrations are rather technical and repetitive something you don't want to do by hand.
466466

467467
We thought the same, which is why we provide a migration script to do most of the migration automatically. You can upgrade your project by using `npx sv migrate svelte-5`. This will do the following things:
468468

documentation/docs/07-misc/99-faq.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ There are several [UI component libraries](/packages#component-libraries) as wel
6969

7070
## How do I test Svelte apps?
7171

72-
How your application is structured and where logic is defined will determine the best way to ensure it is properly tested. It is important to note that not all logic belongs within a component - this includes concerns such as data transformation, cross-component state management, and logging, among others. Remember that the Svelte library has its own test suite, so you do not need to write tests to validate implementation details provided by Svelte.
72+
How your application is structured and where logic is defined will determine the best way to ensure it is properly tested. It is important to note that not all logic belongs within a component this includes concerns such as data transformation, cross-component state management, and logging, among others. Remember that the Svelte library has its own test suite, so you do not need to write tests to validate implementation details provided by Svelte.
7373

7474
A Svelte application will typically have three different types of tests: Unit, Component, and End-to-End (E2E).
7575

documentation/docs/99-legacy/10-legacy-on.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ The following modifiers are available:
4343

4444
- `preventDefault` — calls `event.preventDefault()` before running the handler
4545
- `stopPropagation` — calls `event.stopPropagation()`, preventing the event reaching the next element
46-
- `stopImmediatePropagation` - calls `event.stopImmediatePropagation()`, preventing other listeners of the same event from being fired.
46+
- `stopImmediatePropagation` calls `event.stopImmediatePropagation()`, preventing other listeners of the same event from being fired.
4747
- `passive` — improves scrolling performance on touch/wheel events (Svelte will add it automatically where it's safe to do so)
4848
- `nonpassive` — explicitly set `passive: false`
4949
- `capture` — fires the handler during the _capture_ phase instead of the _bubbling_ phase

0 commit comments

Comments
 (0)