updated folder structure

app/src/styles/layout/sidebar.scss

@@ -130,13 +130,15 @@
         grid-column: 1 / -1;
       }
 
-      .widget-left-sideBar {
-        .widgets-wrapper {
+      .widgets-wrapper {
+
+        min-height: 50vh;
+        max-height: 60vh;
+        overflow: auto;
+      }
+
+      .widget-left-sideBar {
 
-          min-height: 50vh;
-          max-height: 60vh;
-          overflow: auto;
-        }
 
         .widget2D {
           overflow: auto;
@@ -1088,43 +1090,51 @@
           right: -10px;
           transform: translate(0, -50%);
         }
-        &:nth-child(1), &:nth-child(9) {
+
+        &:nth-child(1),
+        &:nth-child(9) {
           &::after {
             @include gradient-by-child(1); // First child uses the first color
           }
         }
 
-        &:nth-child(2), &:nth-child(10) {
+        &:nth-child(2),
+        &:nth-child(10) {
           &::after {
             @include gradient-by-child(2); // Second child uses the second color
           }
         }
 
-        &:nth-child(3), &:nth-child(11) {
+        &:nth-child(3),
+        &:nth-child(11) {
           &::after {
             @include gradient-by-child(3); // Third child uses the third color
           }
         }
 
-        &:nth-child(4), &:nth-child(12) {
+        &:nth-child(4),
+        &:nth-child(12) {
           &::after {
             @include gradient-by-child(4); // Fourth child uses the fourth color
           }
         }
 
-        &:nth-child(5), &:nth-child(13) {
+        &:nth-child(5),
+        &:nth-child(13) {
           &::after {
             @include gradient-by-child(5); // Fifth child uses the fifth color
           }
         }
 
-        &:nth-child(6), &:nth-child(14) {
+        &:nth-child(6),
+        &:nth-child(14) {
           &::after {
             @include gradient-by-child(6); // Fifth child uses the fifth color
           }
         }
 
-        &:nth-child(7), &:nth-child(15) {
+        &:nth-child(7),
+        &:nth-child(15) {
           &::after {
             @include gradient-by-child(7); // Fifth child uses the fifth color
           }
@@ -1160,6 +1170,7 @@
         position: relative;
         overflow: hidden;
         padding: 0;
+
         &:hover {
           .asset-name {
             opacity: 1;
@@ -1173,21 +1184,24 @@
           padding: 8px;
           width: 100%;
           font-size: var(--font-size-regular);
-          background: color-mix(
-            in srgb,
-            var(--background-color) 40%,
-            transparent
-          );
+          background: color-mix(in srgb,
+              var(--background-color) 40%,
+              transparent);
           backdrop-filter: blur(5px);
           opacity: 0;
           transition: opacity 0.3s ease;
 
           /* Added properties for ellipsis */
-          display: -webkit-box; /* Necessary for multiline truncation */
-          -webkit-line-clamp: 2; /* Number of lines to show */
-          -webkit-box-orient: vertical; /* Box orientation for the ellipsis */
-          overflow: hidden; /* Hide overflowing content */
-          text-overflow: ellipsis; /* Add ellipsis for truncated content */
+          display: -webkit-box;
+          /* Necessary for multiline truncation */
+          -webkit-line-clamp: 2;
+          /* Number of lines to show */
+          -webkit-box-orient: vertical;
+          /* Box orientation for the ellipsis */
+          overflow: hidden;
+          /* Hide overflowing content */
+          text-overflow: ellipsis;
+          /* Add ellipsis for truncated content */
         }
 
         .asset-image {
@@ -1257,4 +1271,4 @@
   .assets-wrapper {
     margin: 0;
   }
-}
+}