From e841454bb8d8fee4d264e32f45e009af505d02b5 Mon Sep 17 00:00:00 2001
From: Umang Utkarsh <umangutkarsh0024@gmail.com>
Date: Sat, 24 Feb 2024 18:51:38 +0000
Subject: [PATCH] toggle-switch/style-add

---
 .gitignore                                                     | 1 +
 .../src/components/ToggleSwitch/ToggleSwitch.styles.scss       | 3 +++
 2 files changed, 4 insertions(+)

diff --git a/.gitignore b/.gitignore
index 8f8e496e7f..ad9e98f392 100644
--- a/.gitignore
+++ b/.gitignore
@@ -18,3 +18,4 @@ storybook-static/
 **/.storybook/jest-results.json
 **/bundle-report.html
 .env
+.gitpod.yml
diff --git a/packages/fuselage/src/components/ToggleSwitch/ToggleSwitch.styles.scss b/packages/fuselage/src/components/ToggleSwitch/ToggleSwitch.styles.scss
index f91f629f30..40faa3c1d8 100644
--- a/packages/fuselage/src/components/ToggleSwitch/ToggleSwitch.styles.scss
+++ b/packages/fuselage/src/components/ToggleSwitch/ToggleSwitch.styles.scss
@@ -17,6 +17,8 @@ $toggle-switch-border-radius: theme(
     @extend %selection-button__fake;
     width: lengths.size(2 * 20);
 
+    transition: background-color 0.3s ease;
+
     border-radius: $toggle-switch-border-radius;
   }
 
@@ -28,6 +30,7 @@ $toggle-switch-border-radius: theme(
     height: lengths.size(20) - 2 * lengths.border-width(default, rem);
 
     content: '';
+    transition: inset-inline-start 0.3s ease;
 
     border-radius: $toggle-switch-border-radius;