@@ -1,4 +1,4 @@
-import { createEffect, on, Show, Suspense, type ParentProps } from "solid-js"
+import { Show, Suspense, type ParentProps } from "solid-js"
 import { createStore } from "solid-js/store"
 import { createMediaQuery } from "@solid-primitives/media"
 import { ResizeHandle } from "@opencode/ui/resize-handle"
@@ -26,26 +26,13 @@ export default function Layout(props: ParentProps) {
   const [state, setState] = createStore<{
     tabsWidth: number
     tabsMount: HTMLElement | undefined
-    tabsAnimating: boolean
   }>({
     tabsWidth: 260,
     tabsMount: undefined,
-    tabsAnimating: false,
   })
 
   const verticalTabs = () => preferences.appearance.tabLayout() === "vertical" && !mobile()
 
-  // Animate only open/close; resize drags must track the pointer.
-  createEffect(
-    on(
-      preferences.appearance.sidebarOpen,
-      () => {
-        if (verticalTabs()) setState("tabsAnimating", true)
-      },
-      { defer: true },
-    ),
-  )
-
   command.register("sidebar", () =>
     verticalTabs()
       ? [
@@ -87,19 +74,9 @@ export default function Layout(props: ParentProps) {
               id="vertical-tabs-sidebar"
               data-slot="vertical-tabs-sidebar"
               data-state={preferences.appearance.sidebarOpen() ? "open" : "closed"}
-              classList={{
-                "relative h-full min-h-0 shrink-0": true,
-                "transition-[width] duration-[240ms] ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none":
-                  state.tabsAnimating,
-              }}
+              class="relative h-full min-h-0 shrink-0"
               style={{ width: preferences.appearance.sidebarOpen() ? `${state.tabsWidth}px` : "0px" }}
               inert={!preferences.appearance.sidebarOpen()}
-              onTransitionEnd={(event) => {
-                if (event.target === event.currentTarget) setState("tabsAnimating", false)
-              }}
-              onTransitionCancel={(event) => {
-                if (event.target === event.currentTarget) setState("tabsAnimating", false)
-              }}
             >
               <div class="absolute inset-0 overflow-hidden">
                 <div
 
@@ -71,11 +71,10 @@ function useCollapsedSlot() {
   }
 }
 
-const slotClass =
-  "flex shrink-0 justify-end overflow-hidden transition-[width] duration-[240ms] ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none"
+const slotClass = "flex shrink-0 justify-end overflow-hidden"
 
-// Floats over the top of every screen, centered on the session header's 48px row. Slides in from the content's start
-// edge as the sidebar closes.
+// Floats over the top of every screen, centered on the session header's 48px row. Appears at the content's start edge
+// when the sidebar closes.
 export function CollapsedSidebarToggle() {
   const slot = useCollapsedSlot()
 
@@ -94,7 +93,7 @@ export function CollapsedSidebarToggle() {
   )
 }
 
-// Reserves the floating toggle's room in a header, pushing its contents along as the toggle slides in. `start` is where
+// Reserves the floating toggle's room in a header, pushing its contents along while the toggle is shown. `start` is where
 // the space begins, in pixels from the content area's start edge, so every header's contents line up after the toggle.
 export function CollapsedSidebarToggleSpace(props: { start?: number; class?: string }) {
   const slot = useCollapsedSlot()
Original file line number	Diff line number	Diff line change
`@@ -71,11 +71,10 @@ function useCollapsedSlot() {`
`71`	`71`	`}`
`72`	`72`	`}`
`73`	`73`
`74`		`-const slotClass =`
`75`		`- "flex shrink-0 justify-end overflow-hidden transition-[width] duration-[240ms] ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none"`
	`74`	`+const slotClass = "flex shrink-0 justify-end overflow-hidden"`
`76`	`75`
`77`		`-// Floats over the top of every screen, centered on the session header's 48px row. Slides in from the content's start`
`78`		`-// edge as the sidebar closes.`
	`76`	`+// Floats over the top of every screen, centered on the session header's 48px row. Appears at the content's start edge`
	`77`	`+// when the sidebar closes.`
`79`	`78`	`export function CollapsedSidebarToggle() {`
`80`	`79`	`const slot = useCollapsedSlot()`
`81`	`80`
`@@ -94,7 +93,7 @@ export function CollapsedSidebarToggle() {`
`94`	`93`	`)`
`95`	`94`	`}`
`96`	`95`
`97`		-// Reserves the floating toggle's room in a header, pushing its contents along as the toggle slides in. `start` is where
	`96`	+// Reserves the floating toggle's room in a header, pushing its contents along while the toggle is shown. `start` is where
`98`	`97`	`// the space begins, in pixels from the content area's start edge, so every header's contents line up after the toggle.`
`99`	`98`	`export function CollapsedSidebarToggleSpace(props: { start?: number; class?: string }) {`
`100`	`99`	`const slot = useCollapsedSlot()`