chore: update padding in navigation rail (#2919)

This commit is contained in:
ggurdin 2025-06-03 16:12:20 -04:00 committed by GitHub
parent 01d797e53f
commit 844155b01e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 75 additions and 40 deletions

View file

@ -7,7 +7,10 @@ import 'app_config.dart';
abstract class FluffyThemes {
static const double columnWidth = 380.0;
static const double navRailWidth = 80.0;
// #Pangea
// static const double navRailWidth = 80.0;
static const double navRailWidth = 72.0;
// Pangea#
static bool isColumnModeByWidth(double width) =>
width > columnWidth * 2 + navRailWidth;

View file

@ -3,7 +3,6 @@ import 'package:flutter/material.dart';
import 'package:badges/badges.dart';
import 'package:matrix/matrix.dart';
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/widgets/hover_builder.dart';
import 'package:fluffychat/widgets/unread_rooms_badge.dart';
import '../../config/themes.dart';
@ -35,14 +34,27 @@ class NaviRailItem extends StatelessWidget {
Widget build(BuildContext context) {
final theme = Theme.of(context);
final borderRadius = BorderRadius.circular(AppConfig.borderRadius);
// #Pangea
// final borderRadius = BorderRadius.circular(AppConfig.borderRadius);
final borderRadius = BorderRadius.circular(10.0);
final isColumnMode = FluffyThemes.isColumnMode(context);
final width = isColumnMode
? FluffyThemes.navRailWidth
: FluffyThemes.navRailWidth - 8.0;
// Pangea#
final icon = isSelected ? selectedIcon ?? this.icon : this.icon;
final unreadBadgeFilter = this.unreadBadgeFilter;
return HoverBuilder(
builder: (context, hovered) {
// #Pangea
// return SizedBox(
// height: 72,
return SizedBox(
height: 72,
width: FluffyThemes.navRailWidth,
height: width - (isColumnMode ? 16.0 : 12.0),
width: width,
// width: FluffyThemes.navRailWidth,
// Pangea#
child: Stack(
children: [
Positioned(
@ -53,7 +65,7 @@ class NaviRailItem extends StatelessWidget {
// #Pangea
// width: isSelected ? 8 : 0,
width: isSelected
? FluffyThemes.isColumnMode(context)
? isColumnMode
? 8
: 4
: 0,
@ -74,16 +86,25 @@ class NaviRailItem extends StatelessWidget {
scale: hovered ? 1.1 : 1.0,
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
child: Material(
borderRadius: borderRadius,
// #Pangea
// color: isSelected
// ? theme.colorScheme.primaryContainer
// : theme.colorScheme.surfaceContainerHigh,
color: backgroundColor ??
(isSelected
? theme.colorScheme.primaryContainer
: theme.colorScheme.surfaceContainerHigh),
// #Pangea
// child: Material(
// borderRadius: borderRadius,
// color: isSelected
// ? theme.colorScheme.primaryContainer
// : theme.colorScheme.surfaceContainerHigh,
child: Container(
alignment: Alignment.center,
decoration: BoxDecoration(
color: backgroundColor ??
(isSelected
? theme.colorScheme.primaryContainer
: theme.colorScheme.surfaceContainerHigh),
borderRadius: borderRadius,
),
margin: EdgeInsets.symmetric(
horizontal: isColumnMode ? 16.0 : 12.0,
vertical: isColumnMode ? 8.0 : 6.0,
),
// Pangea#
child: Tooltip(
message: toolTip,

View file

@ -44,6 +44,10 @@ class SpacesNavigationRail extends StatelessWidget {
final isHomepage = path.contains('homepage');
final isCommunities = path.contains('communities');
final isColumnMode = FluffyThemes.isColumnMode(context);
final width = isColumnMode
? FluffyThemes.navRailWidth
: FluffyThemes.navRailWidth - 8.0;
// return StreamBuilder(
return Material(
child: SafeArea(
@ -69,9 +73,7 @@ class SpacesNavigationRail extends StatelessWidget {
return SizedBox(
// #Pangea
// width: FluffyThemes.navRailWidth,
width: isColumnMode
? FluffyThemes.navRailWidth
: FluffyThemes.navRailWidth * 0.75,
width: width,
// Pangea#
child: Column(
children: [
@ -112,7 +114,8 @@ class SpacesNavigationRail extends StatelessWidget {
mxContent: snapshot.data?.avatarUrl,
name: snapshot.data?.displayName ??
client.userID!.localpart,
size: 45,
size:
width - (isColumnMode ? 32.0 : 24.0),
),
),
],
@ -135,14 +138,18 @@ class SpacesNavigationRail extends StatelessWidget {
!isCommunities,
// Pangea#
onTap: onGoToChats,
icon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.forum_outlined),
),
selectedIcon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.forum),
),
// #Pangea
// icon: const Padding(
// padding: EdgeInsets.all(10.0),
// child: Icon(Icons.forum_outlined),
// ),
// selectedIcon: const Padding(
// padding: EdgeInsets.all(10.0),
// child: Icon(Icons.forum),
// ),
icon: const Icon(Icons.forum_outlined),
selectedIcon: const Icon(Icons.forum),
// Pangea#
toolTip: L10n.of(context).chats,
unreadBadgeFilter: (room) => true,
);
@ -163,10 +170,7 @@ class SpacesNavigationRail extends StatelessWidget {
clearActiveSpace?.call();
context.go('/rooms/communities');
},
icon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.groups),
),
icon: const Icon(Icons.groups),
toolTip: L10n.of(context).findYourPeople,
// Pangea#
);
@ -194,6 +198,9 @@ class SpacesNavigationRail extends StatelessWidget {
borderRadius: BorderRadius.circular(
AppConfig.borderRadius / 2,
),
// #Pangea
size: width - (isColumnMode ? 32.0 : 24.0),
// Pangea#
),
);
},
@ -202,14 +209,18 @@ class SpacesNavigationRail extends StatelessWidget {
NaviRailItem(
isSelected: isSettings,
onTap: () => context.go('/rooms/settings'),
icon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.settings_outlined),
),
selectedIcon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.settings),
),
// #Pangea
// icon: const Padding(
// padding: EdgeInsets.all(10.0),
// child: Icon(Icons.settings_outlined),
// ),
// selectedIcon: const Padding(
// padding: EdgeInsets.all(10.0),
// child: Icon(Icons.settings),
// ),
icon: const Icon(Icons.settings_outlined),
selectedIcon: const Icon(Icons.settings),
// Pangea#
toolTip: L10n.of(context).settings,
),
],