refac: styling

src/lib/components/channel/Channel.svelte

@@ -199,7 +199,7 @@
 </svelte:head>
 
 <div
-	class="h-screen max-h-[100dvh] transition-width duration-300 ease-in-out {$showSidebar
+	class="h-screen max-h-[100dvh] transition-width duration-200 ease-in-out {$showSidebar
 		? 'md:max-w-[calc(100%-260px)]'
 		: ''} w-full max-w-full flex flex-col"
 	id="channel-container"

src/lib/components/chat/Chat.svelte

@@ -1831,7 +1831,7 @@
 
 {#if !chatIdProp || (loaded && chatIdProp)}
 	<div
-		class="h-screen max-h-[100dvh] transition-width duration-300 ease-in-out {$showSidebar
+		class="h-screen max-h-[100dvh] transition-width duration-200 ease-in-out {$showSidebar
 			? '  md:max-w-[calc(100%-260px)]'
 			: ' '} w-full max-w-full flex flex-col"
 		id="chat-container"

src/lib/components/layout/Sidebar.svelte

@@ -442,8 +442,8 @@
 	class="h-screen max-h-[100dvh] min-h-screen select-none {$showSidebar
 		? 'md:relative w-[260px] max-w-[260px]'
 		: '-translate-x-[260px] w-[0px]'} {$isApp
-		? ' ml-[4.5rem] md:ml-0'
-		: 'transition-width duration-300 ease-in-out flex-shrink-0'} bg-gray-50 text-gray-900 dark:bg-gray-950 dark:text-gray-200 text-sm fixed z-50 top-0 left-0 overflow-x-hidden
+		? `ml-[4.5rem] md:ml-0 `
+		: 'transition-width duration-200 ease-in-out'}  flex-shrink-0 bg-gray-50 text-gray-900 dark:bg-gray-950 dark:text-gray-200 text-sm fixed z-50 top-0 left-0 overflow-x-hidden
         "
 	data-state={$showSidebar}
 >

src/routes/(app)/admin/+layout.svelte

@@ -26,7 +26,7 @@
 
 {#if loaded}
 	<div
-		class=" flex flex-col w-full min-h-screen max-h-screen transition-width duration-300 ease-in-out {$showSidebar
+		class=" flex flex-col w-full min-h-screen max-h-screen transition-width duration-200 ease-in-out {$showSidebar
 			? 'md:max-w-[calc(100%-260px)]'
 			: ''} max-w-full"
 	>

src/routes/(app)/playground/+layout.svelte

@@ -16,7 +16,7 @@
 </svelte:head>
 
 <div
-	class=" flex flex-col w-full h-screen max-h-[100dvh] transition-width duration-300 ease-in-out {$showSidebar
+	class=" flex flex-col w-full h-screen max-h-[100dvh] transition-width duration-200 ease-in-out {$showSidebar
 		? 'md:max-w-[calc(100%-260px)]'
 		: ''} max-w-full"
 >

src/routes/(app)/workspace/+layout.svelte

@@ -51,7 +51,7 @@
 
 {#if loaded}
 	<div
-		class=" relative flex flex-col w-full h-screen max-h-[100dvh] transition-width duration-300 ease-in-out {$showSidebar
+		class=" relative flex flex-col w-full h-screen max-h-[100dvh] transition-width duration-200 ease-in-out {$showSidebar
 			? 'md:max-w-[calc(100%-260px)]'
 			: ''} max-w-full"
 	>