started layout adjusting

src/index.css

@@ -7,7 +7,7 @@ html{
 }
 
 *{
-  transition: all .3s;
+  transition: all .2s;
 }
 
 body {
@@ -24,6 +24,13 @@ code {
     monospace;
 }
 
+@layer utilities {
+  .aside-scroll-design {
+    @apply [&::-webkit-scrollbar]:w-2 [&::-webkit-scrollbar-track]:bg-gray-100 [&::-webkit-scrollbar-thumb]:bg-gray-300 dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 [&::-webkit-scrollbar-track]:rounded-full [&::-webkit-scrollbar-thumb]:rounded-full
+  }
+}
+
+
 @layer components {
   .change-text::after{
     content: '';
@@ -38,6 +45,10 @@ code {
     animation: pop-modal .1s linear 0s forwards;
   }
 
+  .pop-modal-down{
+    animation: pop-modal-down .1s linear 0s forwards;
+  }
+
 
   /* ANIMATIONS */
   @keyframes text-change {
@@ -58,4 +69,11 @@ code {
     0%{margin-top: 20px; opacity: 0;}
     100%{margin-top: 0; opacity: 1;}
   }
+
+  @keyframes pop-modal-down {
+    /* 0%{left: -200%;}
+    100%{left: 0%;} */
+    0%{margin-bottom: 20px; opacity: 0;}
+    100%{margin-bottom: 0; opacity: 1;}
+  }
 }