From d74a00847feb6137d9e79be8111bb79c1ad0c6de Mon Sep 17 00:00:00 2001
From: Tharindu Senanayake <tharindusenanayake134@gmail.com>
Date: Mon, 23 Mar 2026 11:40:55 +0530
Subject: [PATCH 1/2] Fix: Enable GLightbox for GIF demonstrations

---
 .../develop-your-first-event-integration.md          | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/en/docs/quick-start-guides/develop-your-first-event-integration.md b/en/docs/quick-start-guides/develop-your-first-event-integration.md
index ce040ae..658e49e 100644
--- a/en/docs/quick-start-guides/develop-your-first-event-integration.md
+++ b/en/docs/quick-start-guides/develop-your-first-event-integration.md
@@ -44,7 +44,7 @@ This redirects you to the **Create New Integration in VS Code** page.
     | `username`          | `string`   |
     | `password`          | `string`   |
     
-    <a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif" alt="Add Configurations" width="80%"></a>
+    <a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif" class="glightbox"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif" alt="Add Configurations" width="80%"></a>
 
 2. Go to the **Design View** by clicking the Home icon on the top left corner and click **Add Artifact**.
 3. Select **RabbitMQ Event Handler**. Choosing the **Event Integration** from the Devant console disables the other options.
@@ -54,18 +54,18 @@ This redirects you to the **Create New Integration in VS Code** page.
 
     | Field                   | Value        |
     |-------------------------|--------------|
-    | **username**            | `username`   |
-    | **password**            | `password`   |
+    | **username** | `username`   |
+    | **password** | `password`   |
 
 7. Add `Orders` as the **Queue Name** and click **Create**. If there is no queue named `Orders` in RabbitMQ server, this will create a new queue with this name. 
 
-    <a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif" alt="Add Configurations" width="80%"></a>
+    <a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif" class="glightbox"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif" alt="Add Configurations" width="80%"></a>
 
 8. In the **Design** view, click the `onMessage` function box. It will redirect you to the flow diagram view.
 9. Click the plus icon after the **Start** node to open the node panel.
 10. Add a **Log Info** node with the **Msg** as `message.toString()`. 
 
-    <a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif" alt="Add Configurations" width="80%"></a>
+    <a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif" class="glightbox"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif" alt="Add Configurations" width="80%"></a>
 
 ## Step 4: Push to Devant
 
@@ -102,4 +102,4 @@ This redirects you to the **Create New Integration in VS Code** page.
 
 5. After successfully testing, you can promote your event integration to production by clicking the **Promote** button.
 
-Now you have gained hands-on experience in creating, configuring, deploying, and testing an event integration.
+Now you have gained hands-on experience in creating, configuring, deploying, and testing an event integration.
\ No newline at end of file

From 6c66f19d4f0e5131add8304375e05a3b81103f41 Mon Sep 17 00:00:00 2001
From: Tharindu Senanayake <tharindusenanayake134@gmail.com>
Date: Mon, 23 Mar 2026 11:45:49 +0530
Subject: [PATCH 2/2] update view

---
 .../develop-your-first-event-integration.md                   | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/en/docs/quick-start-guides/develop-your-first-event-integration.md b/en/docs/quick-start-guides/develop-your-first-event-integration.md
index 658e49e..d031df4 100644
--- a/en/docs/quick-start-guides/develop-your-first-event-integration.md
+++ b/en/docs/quick-start-guides/develop-your-first-event-integration.md
@@ -54,8 +54,8 @@ This redirects you to the **Create New Integration in VS Code** page.
 
     | Field                   | Value        |
     |-------------------------|--------------|
-    | **username** | `username`   |
-    | **password** | `password`   |
+    | **username**            | `username`   |
+    | **password**            | `password`   |
 
 7. Add `Orders` as the **Queue Name** and click **Create**. If there is no queue named `Orders` in RabbitMQ server, this will create a new queue with this name.