From 8f21b0b4fec1bef68e460d770e5da2b9ebc3cd59 Mon Sep 17 00:00:00 2001
From: Haitao Pan <manbuzhe2009@qq.com>
Date: Mon, 30 Mar 2026 12:13:36 +0800
Subject: [PATCH] style: mirror sidebar gutters with artifact pane

---
 lib/app/app_shell_desktop.dart      | 9 ++++++++-
 lib/app/app_shell_web.dart          | 9 ++++++++-
 lib/widgets/pane_resize_handle.dart | 7 +++++--
 3 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/lib/app/app_shell_desktop.dart b/lib/app/app_shell_desktop.dart
index 771ed6e9..a261767c 100644
--- a/lib/app/app_shell_desktop.dart
+++ b/lib/app/app_shell_desktop.dart
@@ -310,6 +310,12 @@ class _AppShellState extends State<AppShell> {
                                 sidebarState == AppSidebarState.expanded
                                 ? expandedSidebarWidth
                                 : null,
+                            marginOverride: const EdgeInsets.fromLTRB(
+                              4,
+                              4,
+                              8,
+                              0,
+                            ),
                             favoriteDestinations: controller
                                 .assistantNavigationDestinations
                                 .toSet(),
@@ -346,6 +352,7 @@ class _AppShellState extends State<AppShell> {
                         if (sidebarState == AppSidebarState.expanded)
                           PaneResizeHandle(
                             axis: Axis.horizontal,
+                            extent: 8,
                             onDelta: (delta) {
                               setState(() {
                                 _sidebarExpandedWidth = _clampSidebarWidth(
@@ -357,7 +364,7 @@ class _AppShellState extends State<AppShell> {
                           ),
                         Expanded(
                           child: Padding(
-                            padding: const EdgeInsets.fromLTRB(4, 4, 4, 0),
+                            padding: const EdgeInsets.fromLTRB(0, 4, 4, 0),
                             child: AnimatedPadding(
                               duration: const Duration(milliseconds: 220),
                               curve: Curves.easeOutCubic,
diff --git a/lib/app/app_shell_web.dart b/lib/app/app_shell_web.dart
index 91d4fae0..b031a1d0 100644
--- a/lib/app/app_shell_web.dart
+++ b/lib/app/app_shell_web.dart
@@ -206,6 +206,12 @@ class _AppShellState extends State<AppShell> {
                                 _sidebarState == AppSidebarState.expanded
                                 ? expandedSidebarWidth
                                 : null,
+                            marginOverride: const EdgeInsets.fromLTRB(
+                              4,
+                              4,
+                              8,
+                              0,
+                            ),
                             favoriteDestinations: controller
                                 .assistantNavigationDestinations
                                 .toSet(),
@@ -250,6 +256,7 @@ class _AppShellState extends State<AppShell> {
                         if (_sidebarState == AppSidebarState.expanded)
                           PaneResizeHandle(
                             axis: Axis.horizontal,
+                            extent: 8,
                             onDelta: (delta) {
                               setState(() {
                                 _sidebarExpandedWidth = _clampSidebarWidth(
@@ -360,7 +367,7 @@ class _WebShellBody extends StatelessWidget {
   Widget build(BuildContext context) {
     final palette = context.palette;
     return Padding(
-      padding: const EdgeInsets.fromLTRB(4, 4, 4, 0),
+      padding: const EdgeInsets.fromLTRB(0, 4, 4, 0),
       child: DecoratedBox(
         decoration: BoxDecoration(color: palette.canvas),
         child: child,
diff --git a/lib/widgets/pane_resize_handle.dart b/lib/widgets/pane_resize_handle.dart
index 1ac04365..5775621a 100644
--- a/lib/widgets/pane_resize_handle.dart
+++ b/lib/widgets/pane_resize_handle.dart
@@ -7,10 +7,12 @@ class PaneResizeHandle extends StatefulWidget {
     super.key,
     required this.axis,
     required this.onDelta,
+    this.extent,
   });
 
   final Axis axis;
   final ValueChanged<double> onDelta;
+  final double? extent;
 
   @override
   State<PaneResizeHandle> createState() => _PaneResizeHandleState();
@@ -25,6 +27,7 @@ class _PaneResizeHandleState extends State<PaneResizeHandle> {
     final palette = context.palette;
     final isHorizontalDrag = widget.axis == Axis.horizontal;
     final highlight = _dragging || _hovered;
+    final extent = widget.extent ?? 12;
 
     return MouseRegion(
       cursor: isHorizontalDrag
@@ -41,8 +44,8 @@ class _PaneResizeHandleState extends State<PaneResizeHandle> {
           isHorizontalDrag ? details.delta.dx : details.delta.dy,
         ),
         child: SizedBox(
-          width: isHorizontalDrag ? 12 : double.infinity,
-          height: isHorizontalDrag ? double.infinity : 12,
+          width: isHorizontalDrag ? extent : double.infinity,
+          height: isHorizontalDrag ? double.infinity : extent,
           child: Center(
             child: AnimatedContainer(
               duration: const Duration(milliseconds: 140),