style: mirror sidebar gutters with artifact pane

This commit is contained in:
Haitao Pan 2026-03-30 12:13:36 +08:00
parent 7f82958935
commit 8f21b0b4fe
3 changed files with 21 additions and 4 deletions

View File

@ -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,

View File

@ -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,

View File

@ -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),