fix: speed up drawer open + open route (commaai#553)

based on feedback from last dev call, speeding up the transitions,
tweaking animation to be more like old connect




https://github.com/user-attachments/assets/7db41d0b-76b0-4369-af8b-8ab01acb1028

---------

Co-authored-by: Shane Smiskol <shane@smiskol.com>

Author: greatgitsby

src/components/RouteActions.tsx

@@ -24,7 +24,7 @@ const ToggleButton: VoidComponent<{
       }`}
     >
       <div
-        class={`absolute top-1 size-3 rounded-full bg-surface-container-highest transition-transform duration-500 ease-in-out ${
+        class={`absolute top-1 size-3 rounded-full bg-surface-container-highest transition-transform duration-300 ease-in-out ${
           props.active ? 'translate-x-5' : 'translate-x-1'
         }`}
       />

src/components/material/Drawer.tsx

@@ -45,7 +45,7 @@ const Drawer: ParentComponent<DrawerProps> = (props) => {
   return (
     <DrawerContext.Provider value={{ modal, open, setOpen }}>
       <nav
-        class="hide-scrollbar fixed inset-y-0 left-0 h-full touch-pan-y overflow-y-auto overscroll-y-contain transition-drawer duration-500"
+        class="hide-scrollbar fixed inset-y-0 left-0 h-full touch-pan-y overflow-y-auto overscroll-y-contain transition-drawer ease-in-out duration-300"
         style={{
           left: drawerVisible() ? 0 : `${-PEEK}px`,
           opacity: drawerVisible() ? 1 : 0.5,
@@ -58,15 +58,15 @@ const Drawer: ParentComponent<DrawerProps> = (props) => {
       </nav>
 
       <main
-        class="absolute inset-y-0 overflow-y-auto bg-background transition-drawer duration-500"
+        class="absolute inset-y-0 overflow-y-auto bg-background transition-drawer ease-in-out duration-300"
         style={{
           left: drawerVisible() ? `${drawerWidth()}px` : 0,
           width: contentWidth(),
         }}
       >
         {props.children}
         <div
-          class="absolute inset-0 z-[9999] bg-background transition-drawer duration-500"
+          class="absolute inset-0 z-[9999] bg-background transition-drawer ease-in-out duration-300"
           style={{
             'pointer-events': modal() && open() ? 'auto' : 'none',
             opacity: modal() && open() ? 0.5 : 0,