update class tutorial

Author: Rich-Harris

apps/svelte.dev/content/tutorial/01-svelte/07-classes-and-styles/01-classes/+assets/app-b/src/lib/App.svelte

@@ -5,8 +5,7 @@
 <div class="container">
 	Flip the card
 	<button
-		class="card"
-		class:flipped={flipped}
+		class={["card", { flipped }]}
 		onclick={() => flipped = !flipped}
 	>
 		<div class="front">

apps/svelte.dev/content/tutorial/01-svelte/07-classes-and-styles/01-classes/index.md

@@ -14,15 +14,16 @@ Like any other attribute, you can specify classes with a JavaScript attribute. H
 
 This works as expected — if you click on the card now, it'll flip.
 
-We can make it nicer though. Adding or removing a class based on some condition is such a common pattern in UI development that Svelte includes a special directive to simplify it:
+We can make it nicer though. Adding or removing a class based on some condition is such a common pattern in UI development that Svelte allows you to pass an object or array that is converted to a string by [clsx](https://github.com/lukeed/clsx/).
 
 ```svelte
 /// file: App.svelte
 <button
-	class="card"
-	+++class:flipped={flipped}+++
+	+++class={["card", { flipped }]}+++
 	onclick={() => flipped = !flipped}
 >
 ```
 
-This directive means 'add the `flipped` class whenever `flipped` is truthy'.
+This means 'always add the `"card"` class, and add the `flipped` class whenever `flipped` is truthy'.
+
+For more examples of how to combine conditional classes, [consult the `class` documentation](/docs/svelte/class).