From 3dbb6008cc5aed064a649cc675a82cb5fef52ffb Mon Sep 17 00:00:00 2001
From: Rithik Seth <106665190+Heulitig@users.noreply.github.com>
Date: Fri, 16 Dec 2022 11:29:19 +0530
Subject: [PATCH] container syntax change (#48)

---
 event-handling.ftd | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/event-handling.ftd b/event-handling.ftd
index 53a717ad4..952edf011 100644
--- a/event-handling.ftd
+++ b/event-handling.ftd
@@ -42,8 +42,7 @@ print(os)
 -- ft.code: source of the example shown above
 lang: ftd
 
-\-- boolean open: true
-
+\-- boolean $open: true
 
 \-- ftd.column:
 padding: 20
@@ -52,12 +51,12 @@ border-radius: 5
 width: fill
 margin-bottom: 20
 
-\--- ftd.text: the heading (click to toggle)
+\-- ftd.text: the heading (click to toggle)
 $on-click$: toggle $open
 color: $fpm.color.main.text
 role: $fpm.type.copy-tight
 
-\--- ftd.text:
+\-- ftd.text:
 if: $open
 color: $fpm.color.main.text
 role: $fpm.type.copy-tight
@@ -65,7 +64,7 @@ margin-top: $fpm.space.space-2
 
 This is some **markdown text**.
 
-\--- ft.code:
+\-- ft.code:
 if: $open
 lang: py
 
@@ -73,6 +72,8 @@ import os
 
 print(os)
 
+\-- end: ftd.column
+
 
 -- ft.h1: `$on-<event-name>$: <action> <action-arguments>`
 
@@ -80,7 +81,7 @@ FTD supports a few events, like `click`, which is mapped to an "action", eg
 there is an action `toggle`, which toggles a Boolean variable. Actions take data
 also, say `toggle` needs to know what variable to toggle. 
 
-This gives us: `$on-click$: toggle open`. Here we are using a variable named 
+This gives us: `$on-click$: toggle $open`. Here we are using a mutable variable named
 `open` to keep track of if the component is in the "open state" or not.
 
 More than one event handler can be assigned to same event, and more than one event