ars/iiEsaywebUIapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(navigation): Adjust bottom padding for safe area in chats drawer

Browse Source
This commit is contained in:
cogwheel0
2025-12-15 20:17:56 +05:30
parent 5396fb8eec
commit 7619040e27
7 changed files with 495 additions and 771 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
lib/features/chat/views/chat_page.dart
View File

@@ -956,57 +956,9 @@ class _ChatPageState extends ConsumerState<ChatPage> {
required Widget child,
bool isCircular = false,
}) {
final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
// Use same high-contrast colors as the floating chat input
final backgroundColor = isDark
? Color.lerp(context.conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(context.conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = context.conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
final borderRadius = isCircular
? BorderRadius.circular(100)
: BorderRadius.circular(AppBorderRadius.pill);
// For circular buttons, ensure the entire widget is constrained to a square
if (isCircular) {
return SizedBox(
width: 44,
height: 44,
child: ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: Center(child: child),
),
),
),
);
}
return ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: child,
),
),
return FloatingAppBarPill(
isCircular: isCircular,
child: child,
);
}

258
lib/features/navigation/widgets/chats_drawer.dart
View File

@@ -1,6 +1,5 @@
import 'dart:async';
import 'dart:io' show Platform;
import 'dart:ui' show ImageFilter;
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
@@ -23,6 +22,7 @@ import '../../../core/utils/user_avatar_utils.dart';
import '../../../shared/utils/conversation_context_menu.dart';
import '../../../shared/widgets/user_avatar.dart';
import '../../../shared/widgets/model_avatar.dart';
import '../../../shared/widgets/conduit_components.dart';
import '../../../shared/widgets/responsive_drawer_layout.dart';
import '../../../core/models/model.dart';
import '../../../core/models/conversation.dart';
@@ -268,81 +268,60 @@ class _ChatsDrawerState extends ConsumerState<ChatsDrawer> {
}
Widget _buildFloatingSearchField(BuildContext context) {
final theme = Theme.of(context);
final conduitTheme = context.conduitTheme;
final isDark = theme.brightness == Brightness.dark;
final backgroundColor = isDark
? Color.lerp(conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
return ClipRRect(
borderRadius: BorderRadius.circular(AppBorderRadius.pill),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: BorderRadius.circular(AppBorderRadius.pill),
border: Border.all(color: borderColor, width: BorderWidth.thin),
return FloatingAppBarPill(
child: Material(
color: Colors.transparent,
child: TextField(
controller: _searchController,
focusNode: _searchFocusNode,
onChanged: (_) => _onSearchChanged(),
style: AppTypography.standard.copyWith(
color: conduitTheme.textPrimary,
),
child: Material(
color: Colors.transparent,
child: TextField(
controller: _searchController,
focusNode: _searchFocusNode,
onChanged: (_) => _onSearchChanged(),
style: AppTypography.standard.copyWith(
color: conduitTheme.textPrimary,
),
decoration: InputDecoration(
isDense: true,
hintText: AppLocalizations.of(context)!.searchConversations,
hintStyle: AppTypography.standard.copyWith(
color: conduitTheme.textSecondary.withValues(alpha: 0.6),
),
prefixIcon: Icon(
Platform.isIOS ? CupertinoIcons.search : Icons.search,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
prefixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
suffixIcon: _query.isNotEmpty
? IconButton(
onPressed: () {
_searchController.clear();
setState(() => _query = '');
_searchFocusNode.unfocus();
},
icon: Icon(
Platform.isIOS
? CupertinoIcons.clear_circled_solid
: Icons.clear,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
)
: null,
suffixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
filled: false,
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.sm,
),
),
decoration: InputDecoration(
isDense: true,
hintText: AppLocalizations.of(context)!.searchConversations,
hintStyle: AppTypography.standard.copyWith(
color: conduitTheme.textSecondary.withValues(alpha: 0.6),
),
prefixIcon: Icon(
Platform.isIOS ? CupertinoIcons.search : Icons.search,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
prefixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
suffixIcon: _query.isNotEmpty
? IconButton(
onPressed: () {
_searchController.clear();
setState(() => _query = '');
_searchFocusNode.unfocus();
},
icon: Icon(
Platform.isIOS
? CupertinoIcons.clear_circled_solid
: Icons.clear,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
)
: null,
suffixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
filled: false,
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.sm,
),
),
),
@@ -1700,9 +1679,7 @@ class _ChatsDrawerState extends ConsumerState<ChatsDrawer> {
}
Widget _buildFloatingBottomSection(BuildContext context) {
final theme = Theme.of(context);
final conduitTheme = context.conduitTheme;
final isDark = theme.brightness == Brightness.dark;
final authUser = ref.watch(currentUserProvider2);
final asyncUser = ref.watch(currentUserProvider);
final user = asyncUser.maybeWhen(
@@ -1722,98 +1699,81 @@ class _ChatsDrawerState extends ConsumerState<ChatsDrawer> {
final initial = initialFor(displayName);
final avatarUrl = resolveUserAvatarUrlForUser(api, user);
final backgroundColor = isDark
? Color.lerp(conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
if (user == null) return const SizedBox.shrink();
return ClipRRect(
borderRadius: BorderRadius.circular(AppBorderRadius.pill),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: Spacing.sm,
vertical: Spacing.xs,
),
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: BorderRadius.circular(AppBorderRadius.pill),
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: Row(
children: [
Container(
width: 36,
height: 36,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(
AppBorderRadius.avatar,
),
border: Border.all(
color: conduitTheme.buttonPrimary.withValues(alpha: 0.25),
width: BorderWidth.thin,
),
return FloatingAppBarPill(
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: Spacing.sm,
vertical: Spacing.xs,
),
child: Row(
children: [
Container(
width: 36,
height: 36,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(
AppBorderRadius.avatar,
),
clipBehavior: Clip.hardEdge,
child: UserAvatar(
size: 36,
imageUrl: avatarUrl,
fallbackText: initial,
border: Border.all(
color: conduitTheme.buttonPrimary.withValues(alpha: 0.25),
width: BorderWidth.thin,
),
),
const SizedBox(width: Spacing.sm),
Expanded(
child: Text(
displayName,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: AppTypography.bodySmallStyle.copyWith(
color: conduitTheme.textPrimary,
fontWeight: FontWeight.w600,
decoration: TextDecoration.none,
),
clipBehavior: Clip.hardEdge,
child: UserAvatar(
size: 36,
imageUrl: avatarUrl,
fallbackText: initial,
),
),
const SizedBox(width: Spacing.sm),
Expanded(
child: Text(
displayName,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: AppTypography.bodySmallStyle.copyWith(
color: conduitTheme.textPrimary,
fontWeight: FontWeight.w600,
decoration: TextDecoration.none,
),
),
// Notes icon (hidden when feature is disabled)
if (notesEnabled)
IconButton(
tooltip: AppLocalizations.of(context)!.notes,
onPressed: () {
Navigator.of(context).maybePop();
context.pushNamed(RouteNames.notes);
},
visualDensity: VisualDensity.compact,
icon: Icon(
Platform.isIOS
? CupertinoIcons.doc_text
: Icons.note_alt_outlined,
color: conduitTheme.iconPrimary,
size: IconSize.medium,
),
),
),
// Notes icon (hidden when feature is disabled)
if (notesEnabled)
IconButton(
tooltip: AppLocalizations.of(context)!.manage,
tooltip: AppLocalizations.of(context)!.notes,
onPressed: () {
Navigator.of(context).maybePop();
context.pushNamed(RouteNames.profile);
context.pushNamed(RouteNames.notes);
},
visualDensity: VisualDensity.compact,
icon: Icon(
Platform.isIOS
? CupertinoIcons.settings
: Icons.settings_rounded,
? CupertinoIcons.doc_text
: Icons.note_alt_outlined,
color: conduitTheme.iconPrimary,
size: IconSize.medium,
),
),
],
),
IconButton(
tooltip: AppLocalizations.of(context)!.manage,
onPressed: () {
Navigator.of(context).maybePop();
context.pushNamed(RouteNames.profile);
},
visualDensity: VisualDensity.compact,
icon: Icon(
Platform.isIOS
? CupertinoIcons.settings
: Icons.settings_rounded,
color: conduitTheme.iconPrimary,
size: IconSize.medium,
),
),
],
),
),
);

53
lib/features/notes/views/note_editor_page.dart
View File

@@ -15,6 +15,7 @@ import '../../../core/providers/app_providers.dart';
import '../../../core/widgets/error_boundary.dart';
import '../../../shared/theme/theme_extensions.dart';
import '../../../shared/utils/ui_utils.dart';
import '../../../shared/widgets/conduit_components.dart';
import '../../../shared/widgets/improved_loading_states.dart';
import '../../../shared/widgets/middle_ellipsis_text.dart';
import '../../../shared/widgets/themed_dialogs.dart';
@@ -815,55 +816,9 @@ class _NoteEditorPageState extends ConsumerState<NoteEditorPage> {
Widget child, {
bool isCircular = false,
}) {
final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
final backgroundColor = isDark
? Color.lerp(context.conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(context.conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = context.conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
final borderRadius = isCircular
? BorderRadius.circular(100)
: BorderRadius.circular(AppBorderRadius.pill);
if (isCircular) {
return SizedBox(
width: 44,
height: 44,
child: ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: Center(child: child),
),
),
),
);
}
return ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: child,
),
),
return FloatingAppBarPill(
isCircular: isCircular,
child: child,
);
}

315
lib/features/notes/views/notes_list_page.dart
View File

@@ -1,6 +1,5 @@
import 'dart:async';
import 'dart:io' show Platform;
import 'dart:ui' show ImageFilter;
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
@@ -15,7 +14,7 @@ import '../../../core/providers/app_providers.dart';
import '../../../core/services/navigation_service.dart';
import '../../../core/widgets/error_boundary.dart';
import '../../../shared/theme/theme_extensions.dart';
import '../../../shared/utils/ui_utils.dart';
import '../../../shared/widgets/conduit_components.dart';
import '../../../shared/widgets/improved_loading_states.dart';
import '../../../shared/widgets/loading_states.dart';
import '../../../shared/widgets/themed_dialogs.dart';
@@ -130,123 +129,23 @@ class _NotesListPageState extends ConsumerState<NotesListPage> {
child: Scaffold(
backgroundColor: context.conduitTheme.surfaceBackground,
extendBodyBehindAppBar: true,
appBar: PreferredSize(
preferredSize: const Size.fromHeight(kToolbarHeight + 64),
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: const [0.0, 0.4, 1.0],
colors: [
Theme.of(context).scaffoldBackgroundColor,
Theme.of(context).scaffoldBackgroundColor.withValues(
alpha: 0.85,
),
Theme.of(context).scaffoldBackgroundColor.withValues(
alpha: 0.0,
),
],
),
),
child: SafeArea(
bottom: false,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// App bar row with back button and title
SizedBox(
height: kToolbarHeight,
child: Row(
children: [
// Leading (back button)
if (canPop)
Padding(
padding: const EdgeInsets.only(
left: Spacing.inputPadding,
),
child: Center(
child: GestureDetector(
onTap: () => Navigator.of(context).maybePop(),
child: _buildAppBarPill(
context,
Icon(
UiUtils.platformIcon(
ios: CupertinoIcons.back,
android: Icons.arrow_back,
),
color: context.conduitTheme.textPrimary,
size: IconSize.appBar,
),
isCircular: true,
),
),
),
)
else
const SizedBox(width: Spacing.inputPadding),
// Title centered
Expanded(
child: Center(
child: _buildAppBarPill(
context,
Padding(
padding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.xs,
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Platform.isIOS
? CupertinoIcons.doc_text_fill
: Icons.notes_rounded,
color: context.conduitTheme.textPrimary
.withValues(alpha: 0.7),
size: IconSize.md,
),
const SizedBox(width: Spacing.sm),
Text(
l10n.notes,
style:
AppTypography.headlineSmallStyle
.copyWith(
color: context
.conduitTheme
.textPrimary,
fontWeight: FontWeight.w600,
),
),
],
),
),
),
),
),
// Trailing spacer to balance
if (canPop)
const SizedBox(
width: 44 + Spacing.inputPadding,
)
else
const SizedBox(width: Spacing.inputPadding),
],
),
),
// Search bar directly below title
Padding(
padding: const EdgeInsets.fromLTRB(
Spacing.inputPadding,
Spacing.xs,
Spacing.inputPadding,
Spacing.sm,
),
child: _buildFloatingSearchField(context),
),
],
),
appBar: FloatingAppBar(
leading: canPop ? const FloatingAppBarBackButton() : null,
title: FloatingAppBarTitle(
text: l10n.notes,
icon: Platform.isIOS
? CupertinoIcons.doc_text_fill
: Icons.notes_rounded,
),
bottomHeight: 64,
bottom: Padding(
padding: const EdgeInsets.fromLTRB(
Spacing.inputPadding,
Spacing.xs,
Spacing.inputPadding,
Spacing.sm,
),
child: _buildFloatingSearchField(context),
),
),
body: _buildBody(context),
@@ -255,140 +154,62 @@ class _NotesListPageState extends ConsumerState<NotesListPage> {
);
}
Widget _buildAppBarPill(
BuildContext context,
Widget child, {
bool isCircular = false,
}) {
final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
final backgroundColor = isDark
? Color.lerp(context.conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(context.conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = context.conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
final borderRadius = isCircular
? BorderRadius.circular(100)
: BorderRadius.circular(AppBorderRadius.pill);
if (isCircular) {
return SizedBox(
width: 44,
height: 44,
child: ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: Center(child: child),
),
),
),
);
}
return ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: child,
),
),
);
}
Widget _buildFloatingSearchField(BuildContext context) {
final theme = Theme.of(context);
final conduitTheme = context.conduitTheme;
final isDark = theme.brightness == Brightness.dark;
final l10n = AppLocalizations.of(context)!;
final backgroundColor = isDark
? Color.lerp(conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
return ClipRRect(
borderRadius: BorderRadius.circular(AppBorderRadius.pill),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: BorderRadius.circular(AppBorderRadius.pill),
border: Border.all(color: borderColor, width: BorderWidth.thin),
return FloatingAppBarPill(
child: Material(
color: Colors.transparent,
child: TextField(
controller: _searchController,
focusNode: _searchFocusNode,
onChanged: (_) => _onSearchChanged(),
style: AppTypography.standard.copyWith(
color: conduitTheme.textPrimary,
),
child: Material(
color: Colors.transparent,
child: TextField(
controller: _searchController,
focusNode: _searchFocusNode,
onChanged: (_) => _onSearchChanged(),
style: AppTypography.standard.copyWith(
color: conduitTheme.textPrimary,
),
decoration: InputDecoration(
isDense: true,
hintText: l10n.searchNotes,
hintStyle: AppTypography.standard.copyWith(
color: conduitTheme.textSecondary.withValues(alpha: 0.6),
),
prefixIcon: Icon(
Platform.isIOS ? CupertinoIcons.search : Icons.search,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
prefixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
suffixIcon: _query.isNotEmpty
? IconButton(
onPressed: () {
_searchController.clear();
setState(() => _query = '');
_searchFocusNode.unfocus();
},
icon: Icon(
Platform.isIOS
? CupertinoIcons.clear_circled_solid
: Icons.clear,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
)
: null,
suffixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
filled: false,
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.sm,
),
),
decoration: InputDecoration(
isDense: true,
hintText: l10n.searchNotes,
hintStyle: AppTypography.standard.copyWith(
color: conduitTheme.textSecondary.withValues(alpha: 0.6),
),
prefixIcon: Icon(
Platform.isIOS ? CupertinoIcons.search : Icons.search,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
prefixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
suffixIcon: _query.isNotEmpty
? IconButton(
onPressed: () {
_searchController.clear();
setState(() => _query = '');
_searchFocusNode.unfocus();
},
icon: Icon(
Platform.isIOS
? CupertinoIcons.clear_circled_solid
: Icons.clear,
color: conduitTheme.iconSecondary,
size: IconSize.input,
),
)
: null,
suffixIconConstraints: const BoxConstraints(
minWidth: TouchTarget.minimum,
minHeight: TouchTarget.minimum,
),
filled: false,
border: InputBorder.none,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.sm,
),
),
),

142
lib/features/profile/views/app_customization_page.dart
View File

@@ -1,6 +1,5 @@
import 'dart:async';
import 'dart:io' show Platform;
import 'dart:ui' show ImageFilter;
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
@@ -48,88 +47,12 @@ class AppCustomizationPage extends ConsumerWidget {
final canPop = ModalRoute.of(context)?.canPop ?? false;
final topPadding = MediaQuery.of(context).padding.top + kToolbarHeight + 24;
final theme = Theme.of(context);
final conduitTheme = context.conduitTheme;
return Scaffold(
backgroundColor: conduitTheme.surfaceBackground,
backgroundColor: context.conduitTheme.surfaceBackground,
extendBodyBehindAppBar: true,
appBar: PreferredSize(
preferredSize: const Size.fromHeight(kToolbarHeight + 8),
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: const [0.0, 0.4, 1.0],
colors: [
theme.scaffoldBackgroundColor,
theme.scaffoldBackgroundColor.withValues(alpha: 0.85),
theme.scaffoldBackgroundColor.withValues(alpha: 0.0),
],
),
),
child: SafeArea(
bottom: false,
child: SizedBox(
height: kToolbarHeight,
child: Row(
children: [
// Leading (back button)
if (canPop)
Padding(
padding: const EdgeInsets.only(left: Spacing.inputPadding),
child: Center(
child: GestureDetector(
onTap: () => Navigator.of(context).maybePop(),
child: _buildAppBarPill(
context,
Icon(
UiUtils.platformIcon(
ios: CupertinoIcons.back,
android: Icons.arrow_back,
),
color: conduitTheme.textPrimary,
size: IconSize.appBar,
),
isCircular: true,
),
),
),
)
else
const SizedBox(width: Spacing.inputPadding),
// Title centered
Expanded(
child: Center(
child: _buildAppBarPill(
context,
Padding(
padding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.xs,
),
child: Text(
l10n.appCustomization,
style: AppTypography.headlineSmallStyle.copyWith(
color: conduitTheme.textPrimary,
fontWeight: FontWeight.w600,
),
),
),
),
),
),
// Trailing spacer to balance
if (canPop)
const SizedBox(width: 44 + Spacing.inputPadding)
else
const SizedBox(width: Spacing.inputPadding),
],
),
),
),
),
appBar: FloatingAppBar(
leading: canPop ? const FloatingAppBarBackButton() : null,
title: FloatingAppBarTitle(text: l10n.appCustomization),
),
body: ListView(
physics: const BouncingScrollPhysics(
@@ -170,63 +93,6 @@ class AppCustomizationPage extends ConsumerWidget {
);
}
Widget _buildAppBarPill(
BuildContext context,
Widget child, {
bool isCircular = false,
}) {
final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
final backgroundColor = isDark
? Color.lerp(context.conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(context.conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = context.conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
final borderRadius = isCircular
? BorderRadius.circular(100)
: BorderRadius.circular(AppBorderRadius.pill);
if (isCircular) {
return SizedBox(
width: 44,
height: 44,
child: ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: Center(child: child),
),
),
),
);
}
return ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: child,
),
),
);
}
Widget _buildThemesDropdownSection(
BuildContext context,
WidgetRef ref,

141
lib/features/profile/views/profile_page.dart
View File

@@ -9,7 +9,6 @@ import 'package:url_launcher/url_launcher_string.dart';
import 'package:conduit/l10n/app_localizations.dart';
import '../../../core/widgets/error_boundary.dart';
import '../../../shared/widgets/improved_loading_states.dart';
import 'dart:ui' show ImageFilter;
import '../../../shared/utils/ui_utils.dart';
import '../../../shared/widgets/themed_dialogs.dart';
@@ -68,151 +67,19 @@ class ProfilePage extends ConsumerWidget {
Scaffold _buildScaffold(BuildContext context, {required Widget body}) {
final canPop = ModalRoute.of(context)?.canPop ?? false;
final theme = Theme.of(context);
final l10n = AppLocalizations.of(context)!;
final conduitTheme = context.conduitTheme;
return Scaffold(
backgroundColor: conduitTheme.surfaceBackground,
backgroundColor: context.conduitTheme.surfaceBackground,
extendBodyBehindAppBar: true,
appBar: PreferredSize(
preferredSize: const Size.fromHeight(kToolbarHeight + 8),
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: const [0.0, 0.4, 1.0],
colors: [
theme.scaffoldBackgroundColor,
theme.scaffoldBackgroundColor.withValues(alpha: 0.85),
theme.scaffoldBackgroundColor.withValues(alpha: 0.0),
],
),
),
child: SafeArea(
bottom: false,
child: SizedBox(
height: kToolbarHeight,
child: Row(
children: [
// Leading (back button)
if (canPop)
Padding(
padding: const EdgeInsets.only(left: Spacing.inputPadding),
child: Center(
child: GestureDetector(
onTap: () => Navigator.of(context).maybePop(),
child: _buildAppBarPill(
context,
Icon(
UiUtils.platformIcon(
ios: CupertinoIcons.back,
android: Icons.arrow_back,
),
color: conduitTheme.textPrimary,
size: IconSize.appBar,
),
isCircular: true,
),
),
),
)
else
const SizedBox(width: Spacing.inputPadding),
// Title centered
Expanded(
child: Center(
child: _buildAppBarPill(
context,
Padding(
padding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.xs,
),
child: Text(
l10n.you,
style: AppTypography.headlineSmallStyle.copyWith(
color: conduitTheme.textPrimary,
fontWeight: FontWeight.w600,
),
),
),
),
),
),
// Trailing spacer to balance
if (canPop)
const SizedBox(width: 44 + Spacing.inputPadding)
else
const SizedBox(width: Spacing.inputPadding),
],
),
),
),
),
appBar: FloatingAppBar(
leading: canPop ? const FloatingAppBarBackButton() : null,
title: FloatingAppBarTitle(text: l10n.you),
),
body: body,
);
}
Widget _buildAppBarPill(
BuildContext context,
Widget child, {
bool isCircular = false,
}) {
final theme = Theme.of(context);
final isDark = theme.brightness == Brightness.dark;
final backgroundColor = isDark
? Color.lerp(context.conduitTheme.cardBackground, Colors.white, 0.08)!
: Color.lerp(context.conduitTheme.inputBackground, Colors.black, 0.06)!;
final borderColor = context.conduitTheme.cardBorder.withValues(
alpha: isDark ? 0.65 : 0.55,
);
final borderRadius = isCircular
? BorderRadius.circular(100)
: BorderRadius.circular(AppBorderRadius.pill);
if (isCircular) {
return SizedBox(
width: 44,
height: 44,
child: ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: Center(child: child),
),
),
),
);
}
return ClipRRect(
borderRadius: borderRadius,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
child: Container(
decoration: BoxDecoration(
color: backgroundColor.withValues(alpha: 0.85),
borderRadius: borderRadius,
border: Border.all(color: borderColor, width: BorderWidth.thin),
),
child: child,
),
),
);
}
Widget _buildCenteredState(BuildContext context, Widget child) {
final topPadding = MediaQuery.of(context).padding.top + kToolbarHeight + 24;
return Padding(