From c69c4c63bf46ac743e82a2f551bc23994da52d43 Mon Sep 17 00:00:00 2001
From: Brandon Harvey <8107750+bharvey88@users.noreply.github.com>
Date: Tue, 26 May 2026 21:15:09 -0500
Subject: [PATCH] Fix mangled automation list on Button Controlled LEDs page
(#871)
CloudCannon's edit split the 1-5 numbered "Build the automation" list
into two lists that restarted numbering at "Set up the trigger," and
reindented the bullets inside both annotate blocks to 10 spaces, which
python-markdown rendered as a joined paragraph with literal dashes.
Restore the continuous 1-5 list, move the add-automation gif inside
step 2 with 4-space continuation indent, and fix the annotate block
indentation back to 4 spaces so the choices render as proper bullets
and the annotation tooltips work. Preserves the Next Steps / Light
Effects button added in #866.
Supersedes #865, which had the same fix but conflicted after later
edits to the file.
---
.../automations/button-controlled-leds.md | 39 ++++++++++---------
1 file changed, 21 insertions(+), 18 deletions(-)
diff --git a/docs/products/ESPHome-Starter-Kit/automations/button-controlled-leds.md b/docs/products/ESPHome-Starter-Kit/automations/button-controlled-leds.md
index be9a127791..f9ed1a8482 100644
--- a/docs/products/ESPHome-Starter-Kit/automations/button-controlled-leds.md
+++ b/docs/products/ESPHome-Starter-Kit/automations/button-controlled-leds.md
@@ -20,32 +20,35 @@ This tutorial uses the Button module and the RGB & Buzzer module connected to th
ESPHome Device Builder has a new GUI for building automations, so you can wire a trigger to an action without hand-writing YAML. The trigger is the *when* of the automation, the thing that makes it fire. The action is the *then do*, what happens when it fires. If you've built automations in Home Assistant, this is the same mental model.
-1. Open your starter kit device in ESPHome Device Builder and click **Edit**. If you need a refresher on the editor, see the [Device Builder Tour](/products/ESPHome-Starter-Kit/learning-the-basics/device-builder-tour/#editor).
-2. In the editor's left pane, expand the **Automations** dropdown and click **Add Automation**.
+1. Open your starter kit device in ESPHome Device Builder and click **Edit**. If you need a refresher on the editor, see the [Device Builder Tour](/products/ESPHome-Starter-Kit/learning-the-basics/device-builder-tour/#editor).
+2. In the editor's left pane, expand the **Automations** dropdown and click **Add Automation**.
-
+ 
-1. Set up the trigger:
+3. Set up the trigger:
-
+
- - **What should this automation react to?** → **A configured component**
- - **Which configured component?** → **Button Module (binary_sensor.gpio)**
- - **Which trigger?** → **Binary Sensor → On Click** (1)
+ - **What should this automation react to?** → **A configured component**
+ - **Which configured component?** → **Button Module (binary_sensor.gpio)**
+ - **Which trigger?** → **Binary Sensor → On Click** (1)
-
- 1. The trigger dropdown also offers **On Double Click**, **On Multi Click**, **On Press**, **On Release**, **On State**, and **On State Change** for other button gestures. Swap any of these in once you're comfortable with the On Click flow.
-2. Click **Continue**. You land on the **Binary Sensor → On Click** editor with the **Target** already set to your Button module.
-3. Set up the action:
+
+ 1. The trigger dropdown also offers **On Double Click**, **On Multi Click**, **On Press**, **On Release**, **On State**, and **On State Change** for other button gestures. Swap any of these in once you're comfortable with the On Click flow.
- - Under **Actions**, click **+ Add action**.
- - In the **Add action** dialog, stay on the **By target** tab and choose **Light → Toggle** under the RGB LED group.
- - On the new action, click the **ID** dropdown and select **RGB LEDs**. (1)
+4. Click **Continue**. You land on the **Binary Sensor → On Click** editor with the **Target** already set to your Button module.
+5. Set up the action:
-
- 1. The **ID** dropdown only needs changing if your device also has an **Onboard RGB LED** component configured. If **RGB LEDs** is the only light, it's already selected.
+
+
+ - Under **Actions**, click **+ Add action**.
+ - In the **Add action** dialog, stay on the **By target** tab and choose **Light → Toggle** under the RGB LED group.
+ - On the new action, click the **ID** dropdown and select **RGB LEDs**. (1)
+
+
+
+ 1. The **ID** dropdown only needs changing if your device also has an **Onboard RGB LED** component configured. If **RGB LEDs** is the only light, it's already selected.
??? note "What the GUI built in YAML"