From 20bd55cb54535d2372efb8bbe229d2b0a2f4cec7 Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Mon, 4 Nov 2024 16:34:58 +0530
Subject: [PATCH 1/9] remove deprecated dropshadows

---
 lib/styles/definitions.scss | 85 +------------------------------------
 1 file changed, 1 insertion(+), 84 deletions(-)

diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index ba1350e88..c1914131c 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,91 +67,8 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
-%dropshadow-3dp {
-  box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
-    0 3px 3px -2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-4dp {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
-    0 1px 10px 0 rgba(0, 0, 0, 0.12);
-}
-%dropshadow-5dp {
-  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
-    0 1px 14px 0 rgba(0, 0, 0, 0.12);
-}
+
 %dropshadow-6dp {
   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14),
     0 1px 18px 0 rgba(0, 0, 0, 0.12);
 }
-%dropshadow-7dp {
-  box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
-    0 2px 16px 1px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-8dp {
-  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-    0 3px 14px 2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-9dp {
-  box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
-    0 3px 16px 2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-10dp {
-  box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
-    0 4px 18px 3px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-11dp {
-  box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
-    0 4px 20px 3px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-12dp {
-  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
-    0 5px 22px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-13dp {
-  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
-    0 5px 24px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-14dp {
-  box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
-    0 5px 26px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-15dp {
-  box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
-    0 6px 28px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-16dp {
-  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
-    0 6px 30px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-17dp {
-  box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
-    0 6px 32px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-18dp {
-  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
-    0 7px 34px 6px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-19dp {
-  box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
-    0 7px 36px 6px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-20dp {
-  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
-    0 8px 38px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-21dp {
-  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
-    0 8px 40px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-22dp {
-  box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
-    0 8px 42px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-23dp {
-  box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
-    0 9px 44px 8px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-24dp {
-  box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
-    0 9px 46px 8px rgba(0, 0, 0, 0.12);
-}

From 72f3284e218a71329b72df02b1f778fee092b6c7 Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Tue, 5 Nov 2024 13:12:59 +0530
Subject: [PATCH 2/9] Revert "remove deprecated dropshadows"

This reverts commit 20bd55cb54535d2372efb8bbe229d2b0a2f4cec7.
---
 lib/styles/definitions.scss | 85 ++++++++++++++++++++++++++++++++++++-
 1 file changed, 84 insertions(+), 1 deletion(-)

diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index c1914131c..ba1350e88 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,8 +67,91 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
-
+%dropshadow-3dp {
+  box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
+    0 3px 3px -2px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-4dp {
+  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
+    0 1px 10px 0 rgba(0, 0, 0, 0.12);
+}
+%dropshadow-5dp {
+  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
+    0 1px 14px 0 rgba(0, 0, 0, 0.12);
+}
 %dropshadow-6dp {
   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14),
     0 1px 18px 0 rgba(0, 0, 0, 0.12);
 }
+%dropshadow-7dp {
+  box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
+    0 2px 16px 1px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-8dp {
+  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+    0 3px 14px 2px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-9dp {
+  box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
+    0 3px 16px 2px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-10dp {
+  box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
+    0 4px 18px 3px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-11dp {
+  box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
+    0 4px 20px 3px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-12dp {
+  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
+    0 5px 22px 4px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-13dp {
+  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
+    0 5px 24px 4px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-14dp {
+  box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
+    0 5px 26px 4px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-15dp {
+  box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
+    0 6px 28px 5px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-16dp {
+  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+    0 6px 30px 5px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-17dp {
+  box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
+    0 6px 32px 5px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-18dp {
+  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
+    0 7px 34px 6px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-19dp {
+  box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
+    0 7px 36px 6px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-20dp {
+  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
+    0 8px 38px 7px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-21dp {
+  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
+    0 8px 40px 7px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-22dp {
+  box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
+    0 8px 42px 7px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-23dp {
+  box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
+    0 9px 44px 8px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-24dp {
+  box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
+    0 9px 46px 8px rgba(0, 0, 0, 0.12);
+}

From 00b5e2adb2277720df1b64ec7091cabf655c8cc3 Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Tue, 5 Nov 2024 13:15:46 +0530
Subject: [PATCH 3/9] comment instead of delete

---
 .gitignore                  |   1 +
 lib/styles/definitions.scss | 168 ++++++++++++++++++------------------
 package.json                |   5 +-
 3 files changed, 89 insertions(+), 85 deletions(-)

diff --git a/.gitignore b/.gitignore
index 9e4bc7763..ce1a2c15e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,3 +22,4 @@ docs/jsdocs.js
 .idea
 kolibri-design-system.iml
 docs/pages/playground.vue
+package.json
diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index ba1350e88..87198dc49 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,91 +67,91 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
-%dropshadow-3dp {
-  box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
-    0 3px 3px -2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-4dp {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
-    0 1px 10px 0 rgba(0, 0, 0, 0.12);
-}
-%dropshadow-5dp {
-  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
-    0 1px 14px 0 rgba(0, 0, 0, 0.12);
-}
+// %dropshadow-3dp {
+//   box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
+//     0 3px 3px -2px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-4dp {
+//   box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
+//     0 1px 10px 0 rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-5dp {
+//   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
+//     0 1px 14px 0 rgba(0, 0, 0, 0.12);
+// }
 %dropshadow-6dp {
   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14),
     0 1px 18px 0 rgba(0, 0, 0, 0.12);
 }
-%dropshadow-7dp {
-  box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
-    0 2px 16px 1px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-8dp {
-  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-    0 3px 14px 2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-9dp {
-  box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
-    0 3px 16px 2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-10dp {
-  box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
-    0 4px 18px 3px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-11dp {
-  box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
-    0 4px 20px 3px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-12dp {
-  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
-    0 5px 22px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-13dp {
-  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
-    0 5px 24px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-14dp {
-  box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
-    0 5px 26px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-15dp {
-  box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
-    0 6px 28px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-16dp {
-  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
-    0 6px 30px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-17dp {
-  box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
-    0 6px 32px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-18dp {
-  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
-    0 7px 34px 6px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-19dp {
-  box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
-    0 7px 36px 6px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-20dp {
-  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
-    0 8px 38px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-21dp {
-  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
-    0 8px 40px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-22dp {
-  box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
-    0 8px 42px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-23dp {
-  box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
-    0 9px 44px 8px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-24dp {
-  box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
-    0 9px 46px 8px rgba(0, 0, 0, 0.12);
-}
+// %dropshadow-7dp {
+//   box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
+//     0 2px 16px 1px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-8dp {
+//   box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+//     0 3px 14px 2px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-9dp {
+//   box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
+//     0 3px 16px 2px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-10dp {
+//   box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
+//     0 4px 18px 3px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-11dp {
+//   box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
+//     0 4px 20px 3px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-12dp {
+//   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
+//     0 5px 22px 4px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-13dp {
+//   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
+//     0 5px 24px 4px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-14dp {
+//   box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
+//     0 5px 26px 4px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-15dp {
+//   box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
+//     0 6px 28px 5px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-16dp {
+//   box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+//     0 6px 30px 5px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-17dp {
+//   box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
+//     0 6px 32px 5px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-18dp {
+//   box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
+//     0 7px 34px 6px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-19dp {
+//   box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
+//     0 7px 36px 6px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-20dp {
+//   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
+//     0 8px 38px 7px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-21dp {
+//   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
+//     0 8px 40px 7px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-22dp {
+//   box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
+//     0 8px 42px 7px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-23dp {
+//   box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
+//     0 9px 44px 8px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-24dp {
+//   box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
+//     0 9px 46px 8px rgba(0, 0, 0, 0.12);
+// }
diff --git a/package.json b/package.json
index 2b2c2aa16..ec2afaa15 100644
--- a/package.json
+++ b/package.json
@@ -83,5 +83,8 @@
   },
   "browserslist": [
     "extends browserslist-config-kolibri"
-  ]
+  ],
+  "volta": {
+    "node": "10.24.1"
+  }
 }

From 5c54cbf8a5f009ef9bd055fba2adbbe1c015aa4c Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Tue, 5 Nov 2024 13:33:01 +0530
Subject: [PATCH 4/9] Revert "comment instead of delete"

This reverts commit 00b5e2adb2277720df1b64ec7091cabf655c8cc3.
---
 .gitignore                  |   1 -
 lib/styles/definitions.scss | 168 ++++++++++++++++++------------------
 package.json                |   5 +-
 3 files changed, 85 insertions(+), 89 deletions(-)

diff --git a/.gitignore b/.gitignore
index ce1a2c15e..9e4bc7763 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,4 +22,3 @@ docs/jsdocs.js
 .idea
 kolibri-design-system.iml
 docs/pages/playground.vue
-package.json
diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index 87198dc49..ba1350e88 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,91 +67,91 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
-// %dropshadow-3dp {
-//   box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
-//     0 3px 3px -2px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-4dp {
-//   box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
-//     0 1px 10px 0 rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-5dp {
-//   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
-//     0 1px 14px 0 rgba(0, 0, 0, 0.12);
-// }
+%dropshadow-3dp {
+  box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
+    0 3px 3px -2px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-4dp {
+  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
+    0 1px 10px 0 rgba(0, 0, 0, 0.12);
+}
+%dropshadow-5dp {
+  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
+    0 1px 14px 0 rgba(0, 0, 0, 0.12);
+}
 %dropshadow-6dp {
   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14),
     0 1px 18px 0 rgba(0, 0, 0, 0.12);
 }
-// %dropshadow-7dp {
-//   box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
-//     0 2px 16px 1px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-8dp {
-//   box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-//     0 3px 14px 2px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-9dp {
-//   box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
-//     0 3px 16px 2px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-10dp {
-//   box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
-//     0 4px 18px 3px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-11dp {
-//   box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
-//     0 4px 20px 3px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-12dp {
-//   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
-//     0 5px 22px 4px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-13dp {
-//   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
-//     0 5px 24px 4px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-14dp {
-//   box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
-//     0 5px 26px 4px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-15dp {
-//   box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
-//     0 6px 28px 5px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-16dp {
-//   box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
-//     0 6px 30px 5px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-17dp {
-//   box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
-//     0 6px 32px 5px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-18dp {
-//   box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
-//     0 7px 34px 6px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-19dp {
-//   box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
-//     0 7px 36px 6px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-20dp {
-//   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
-//     0 8px 38px 7px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-21dp {
-//   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
-//     0 8px 40px 7px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-22dp {
-//   box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
-//     0 8px 42px 7px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-23dp {
-//   box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
-//     0 9px 44px 8px rgba(0, 0, 0, 0.12);
-// }
-// %dropshadow-24dp {
-//   box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
-//     0 9px 46px 8px rgba(0, 0, 0, 0.12);
-// }
+%dropshadow-7dp {
+  box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
+    0 2px 16px 1px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-8dp {
+  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+    0 3px 14px 2px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-9dp {
+  box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
+    0 3px 16px 2px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-10dp {
+  box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
+    0 4px 18px 3px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-11dp {
+  box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
+    0 4px 20px 3px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-12dp {
+  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
+    0 5px 22px 4px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-13dp {
+  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
+    0 5px 24px 4px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-14dp {
+  box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
+    0 5px 26px 4px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-15dp {
+  box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
+    0 6px 28px 5px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-16dp {
+  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+    0 6px 30px 5px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-17dp {
+  box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
+    0 6px 32px 5px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-18dp {
+  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
+    0 7px 34px 6px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-19dp {
+  box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
+    0 7px 36px 6px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-20dp {
+  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
+    0 8px 38px 7px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-21dp {
+  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
+    0 8px 40px 7px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-22dp {
+  box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
+    0 8px 42px 7px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-23dp {
+  box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
+    0 9px 44px 8px rgba(0, 0, 0, 0.12);
+}
+%dropshadow-24dp {
+  box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
+    0 9px 46px 8px rgba(0, 0, 0, 0.12);
+}
diff --git a/package.json b/package.json
index ec2afaa15..2b2c2aa16 100644
--- a/package.json
+++ b/package.json
@@ -83,8 +83,5 @@
   },
   "browserslist": [
     "extends browserslist-config-kolibri"
-  ],
-  "volta": {
-    "node": "10.24.1"
-  }
+  ]
 }

From 12a2e474bae1c46f4357ff1dcdecfb35f21c1afc Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Tue, 5 Nov 2024 13:34:05 +0530
Subject: [PATCH 5/9] Update definitions.scss

---
 lib/styles/definitions.scss | 170 ++++++++++++++++++------------------
 1 file changed, 85 insertions(+), 85 deletions(-)

diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index ba1350e88..f57ec4889 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,91 +67,91 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
-%dropshadow-3dp {
-  box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
-    0 3px 3px -2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-4dp {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
-    0 1px 10px 0 rgba(0, 0, 0, 0.12);
-}
-%dropshadow-5dp {
-  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
-    0 1px 14px 0 rgba(0, 0, 0, 0.12);
-}
+// %dropshadow-3dp {
+//   box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
+//     0 3px 3px -2px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-4dp {
+//   box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14),
+//     0 1px 10px 0 rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-5dp {
+//   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14),
+//     0 1px 14px 0 rgba(0, 0, 0, 0.12);
+// }
 %dropshadow-6dp {
   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14),
     0 1px 18px 0 rgba(0, 0, 0, 0.12);
-}
-%dropshadow-7dp {
-  box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
-    0 2px 16px 1px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-8dp {
-  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-    0 3px 14px 2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-9dp {
-  box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
-    0 3px 16px 2px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-10dp {
-  box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
-    0 4px 18px 3px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-11dp {
-  box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
-    0 4px 20px 3px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-12dp {
-  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
-    0 5px 22px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-13dp {
-  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
-    0 5px 24px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-14dp {
-  box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
-    0 5px 26px 4px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-15dp {
-  box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
-    0 6px 28px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-16dp {
-  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
-    0 6px 30px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-17dp {
-  box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
-    0 6px 32px 5px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-18dp {
-  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
-    0 7px 34px 6px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-19dp {
-  box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
-    0 7px 36px 6px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-20dp {
-  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
-    0 8px 38px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-21dp {
-  box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
-    0 8px 40px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-22dp {
-  box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
-    0 8px 42px 7px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-23dp {
-  box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
-    0 9px 44px 8px rgba(0, 0, 0, 0.12);
-}
-%dropshadow-24dp {
-  box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
-    0 9px 46px 8px rgba(0, 0, 0, 0.12);
-}
+// }
+// %dropshadow-7dp {
+//   box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
+//     0 2px 16px 1px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-8dp {
+//   box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+//     0 3px 14px 2px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-9dp {
+//   box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14),
+//     0 3px 16px 2px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-10dp {
+//   box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14),
+//     0 4px 18px 3px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-11dp {
+//   box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14),
+//     0 4px 20px 3px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-12dp {
+//   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14),
+//     0 5px 22px 4px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-13dp {
+//   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14),
+//     0 5px 24px 4px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-14dp {
+//   box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14),
+//     0 5px 26px 4px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-15dp {
+//   box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14),
+//     0 6px 28px 5px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-16dp {
+//   box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+//     0 6px 30px 5px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-17dp {
+//   box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14),
+//     0 6px 32px 5px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-18dp {
+//   box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14),
+//     0 7px 34px 6px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-19dp {
+//   box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14),
+//     0 7px 36px 6px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-20dp {
+//   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14),
+//     0 8px 38px 7px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-21dp {
+//   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14),
+//     0 8px 40px 7px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-22dp {
+//   box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14),
+//     0 8px 42px 7px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-23dp {
+//   box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14),
+//     0 9px 44px 8px rgba(0, 0, 0, 0.12);
+// }
+// %dropshadow-24dp {
+//   box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
+//     0 9px 46px 8px rgba(0, 0, 0, 0.12);
+// }

From 8baa4ff4e4b70bb2b4ad0cd867675497df1d290a Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Tue, 5 Nov 2024 13:36:02 +0530
Subject: [PATCH 6/9] Update definitions.scss

---
 lib/styles/definitions.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index f57ec4889..87198dc49 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -82,7 +82,7 @@ $core-time: 0.15s;
 %dropshadow-6dp {
   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14),
     0 1px 18px 0 rgba(0, 0, 0, 0.12);
-// }
+}
 // %dropshadow-7dp {
 //   box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14),
 //     0 2px 16px 1px rgba(0, 0, 0, 0.12);

From 78ca7482323fbb5fbad92ff761fe197cc2d3efa5 Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Thu, 14 Nov 2024 07:26:15 +0530
Subject: [PATCH 7/9] add comment .

adding a comment indicating uncommenting needs to be discussed with the designers first
---
 .gitignore                  | 1 +
 lib/styles/definitions.scss | 2 ++
 package.json                | 5 ++++-
 3 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/.gitignore b/.gitignore
index 9e4bc7763..ce1a2c15e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,3 +22,4 @@ docs/jsdocs.js
 .idea
 kolibri-design-system.iml
 docs/pages/playground.vue
+package.json
diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index 87198dc49..5cacfc4e1 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,6 +67,8 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
+//NOTE: uncommenting needs to be discussed with designers and should be aligned with the guidelines.
+
 // %dropshadow-3dp {
 //   box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
 //     0 3px 3px -2px rgba(0, 0, 0, 0.12);
diff --git a/package.json b/package.json
index 2b2c2aa16..e1f6c73d8 100644
--- a/package.json
+++ b/package.json
@@ -83,5 +83,8 @@
   },
   "browserslist": [
     "extends browserslist-config-kolibri"
-  ]
+  ],
+  "volta": {
+    "node": "18.20.5"
+  }
 }

From 2476511b4529634c5c36d74511cc5b6c096ea3dc Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Thu, 14 Nov 2024 20:36:31 +0530
Subject: [PATCH 8/9] Revert "add comment ."

This reverts commit 78ca7482323fbb5fbad92ff761fe197cc2d3efa5.
---
 .gitignore                  | 1 -
 lib/styles/definitions.scss | 2 --
 package.json                | 5 +----
 3 files changed, 1 insertion(+), 7 deletions(-)

diff --git a/.gitignore b/.gitignore
index ce1a2c15e..9e4bc7763 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,4 +22,3 @@ docs/jsdocs.js
 .idea
 kolibri-design-system.iml
 docs/pages/playground.vue
-package.json
diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index 5cacfc4e1..87198dc49 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,8 +67,6 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
-//NOTE: uncommenting needs to be discussed with designers and should be aligned with the guidelines.
-
 // %dropshadow-3dp {
 //   box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
 //     0 3px 3px -2px rgba(0, 0, 0, 0.12);
diff --git a/package.json b/package.json
index e1f6c73d8..2b2c2aa16 100644
--- a/package.json
+++ b/package.json
@@ -83,8 +83,5 @@
   },
   "browserslist": [
     "extends browserslist-config-kolibri"
-  ],
-  "volta": {
-    "node": "18.20.5"
-  }
+  ]
 }

From 0f4810a1480f1a9004988b19759a4008fada5d0b Mon Sep 17 00:00:00 2001
From: lokesh-varma125 <lokesh.personal28@gmail.com>
Date: Thu, 14 Nov 2024 20:37:24 +0530
Subject: [PATCH 9/9] Update definitions.scss

---
 lib/styles/definitions.scss | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/lib/styles/definitions.scss b/lib/styles/definitions.scss
index 87198dc49..5cacfc4e1 100644
--- a/lib/styles/definitions.scss
+++ b/lib/styles/definitions.scss
@@ -67,6 +67,8 @@ $core-time: 0.15s;
   box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
     0 3px 1px -2px rgba(0, 0, 0, 0.12);
 }
+//NOTE: uncommenting needs to be discussed with designers and should be aligned with the guidelines.
+
 // %dropshadow-3dp {
 //   box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14),
 //     0 3px 3px -2px rgba(0, 0, 0, 0.12);