From 5bafef27b875452b858541bed7833bf7f0941ed1 Mon Sep 17 00:00:00 2001
From: Bryan Klein <zivbk1@gmail.com>
Date: Mon, 7 Oct 2019 16:26:23 -0700
Subject: [PATCH] Update to simplify and DRY the code even more.

Instead of replicating the entire button, you could just IF/ELSE the button text.
---
 .../tutorial/04-logic/02-else-blocks/text.md       | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/site/content/tutorial/04-logic/02-else-blocks/text.md b/site/content/tutorial/04-logic/02-else-blocks/text.md
index d25a7d3897..6dc2ae99f5 100644
--- a/site/content/tutorial/04-logic/02-else-blocks/text.md
+++ b/site/content/tutorial/04-logic/02-else-blocks/text.md
@@ -5,15 +5,13 @@ title: Else blocks
 Since the two conditions — `if user.loggedIn` and `if !user.loggedIn` — are mutually exclusive, we can simplify this component slightly by using an `else` block:
 
 ```html
-{#if user.loggedIn}
-	<button on:click={toggle}>
+<button on:click={toggle}>
+	{#if user.loggedIn}
 		Log out
-	</button>
-{:else}
-	<button on:click={toggle}>
+	{:else}
 		Log in
-	</button>
-{/if}
+	{/if}
+</button>
 ```
 
-> A `#` character always indicates a *block opening* tag. A `/` character always indicates a *block closing* tag. A `:` character, as in `{:else}`, indicates a *block continuation* tag. Don't worry — you've already learned almost all the syntax Svelte adds to HTML.
\ No newline at end of file
+> A `#` character always indicates a *block opening* tag. A `/` character always indicates a *block closing* tag. A `:` character, as in `{:else}`, indicates a *block continuation* tag. Don't worry — you've already learned almost all the syntax Svelte adds to HTML.