From 101b021c5f1e0532337e9fb48bd359e3a5a74949 Mon Sep 17 00:00:00 2001
From: Hare <kei.hiracchi.0928@gmail.com>
Date: Thu, 1 Oct 2026 12:54:09 +0900
Subject: [PATCH] fix: anchor sidebar pin button at bottom left

---
 tools/web-ux/browser-tests/console_history_shell_test.ts | 6 ++++++
 web/workspace/src/lib/workspace/sidebar/sidebar.css      | 2 +-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/tools/web-ux/browser-tests/console_history_shell_test.ts b/tools/web-ux/browser-tests/console_history_shell_test.ts
index 29a9b522e..37311df44 100644
--- a/tools/web-ux/browser-tests/console_history_shell_test.ts
+++ b/tools/web-ux/browser-tests/console_history_shell_test.ts
@@ -88,6 +88,8 @@ async function checkSidebarSlide(page: Page, mobile: boolean, opening: boolean):
       panelWidth: frame.querySelector(".sidebar-frame__bevel")!.getBoundingClientRect().width,
       mainWidth: main.getBoundingClientRect().width,
       mainHeight: main.getBoundingClientRect().height,
+      pinLeft: frame.querySelector(".sidebar-fold-button")!.getBoundingClientRect().left - frame.getBoundingClientRect().left,
+      pinBottom: frame.getBoundingClientRect().bottom - frame.querySelector(".sidebar-fold-button")!.getBoundingClientRect().bottom,
     });
     const before = sample();
     if (mobile) {
@@ -113,6 +115,10 @@ async function checkSidebarSlide(page: Page, mobile: boolean, opening: boolean):
   assert(result.durations.length >= (mobile ? 1 : 2), `missing sidebar motion: ${JSON.stringify({ mobile, opening, result })}`);
   assert(result.durations.every((duration) => duration === 220));
   const { before, middle, after } = result;
+  for (const sample of [before, middle, after]) {
+    assert(Math.abs(sample.pinLeft - 8) <= 1, "Pin must stay at the sidebar's left edge");
+    assert(Math.abs(sample.pinBottom - 16) <= 1, "Pin must stay at the sidebar's bottom edge");
+  }
   assert(opening ? before.x < middle.x && middle.x < after.x : before.x > middle.x && middle.x > after.x,
     `sidebar must slide horizontally through an intermediate position: ${JSON.stringify(result)}`);
   assertEquals(before.width, after.width, "sidebar contents must slide without reflowing");
diff --git a/web/workspace/src/lib/workspace/sidebar/sidebar.css b/web/workspace/src/lib/workspace/sidebar/sidebar.css
index 27ff7d434..e222b9bcd 100644
--- a/web/workspace/src/lib/workspace/sidebar/sidebar.css
+++ b/web/workspace/src/lib/workspace/sidebar/sidebar.css
@@ -134,7 +134,7 @@
   }
   .sidebar-control-row {
     display: flex;
-    justify-content: flex-end;
+    justify-content: flex-start;
     gap: var(--space-1);
   }
   .sidebar-control-row {