commit 20640be858a358ca9299dd7139c738b54a47488c parent 4dff95225f394412a3c0b930a4daef15f4002f5f Author: maydayv7 <maydayv7@gmail.com> Date: Tue, 9 Dec 2025 00:33:36 +0530 Fix UI inconsistencies Diffstat:
24 files changed, 186 insertions(+), 192 deletions(-)
diff --git a/lib/ui/pages/create_file_page.dart b/lib/ui/pages/create_file_page.dart @@ -184,7 +184,7 @@ class _CreateFilePageState extends State<CreateFilePage> { return Scaffold( backgroundColor: theme.scaffoldBackgroundColor, - appBar: CustomAppBar( + appBar: CommonAppBar( title: 'Create Files', showBack: true, leading: IconButton( diff --git a/lib/ui/pages/define_brand_page.dart b/lib/ui/pages/define_brand_page.dart @@ -143,7 +143,7 @@ class _DefineBrandPageState extends State<DefineBrandPage> { Widget build(BuildContext context) { return Scaffold( backgroundColor: Variables.background, - appBar: CustomAppBar( + appBar: CommonAppBar( title: "", showBack: true, leading: IconButton( diff --git a/lib/ui/pages/home_page.dart b/lib/ui/pages/home_page.dart @@ -369,7 +369,7 @@ class _HomePageState extends State<HomePage> { : _allProjects; return Scaffold( - backgroundColor: theme.scaffoldBackgroundColor, + backgroundColor: Variables.background, body: _isLoading ? const Center(child: CircularProgressIndicator()) @@ -411,7 +411,7 @@ class _HomePageState extends State<HomePage> { color: theme.colorScheme.primaryContainer, shape: BoxShape.circle, border: Border.all( - color: theme.scaffoldBackgroundColor, + color: Variables.background, width: 1.25, ), ), @@ -887,10 +887,11 @@ class _SeeAllPageState extends State<_SeeAllPage> { color: theme.colorScheme.onSurface, ), ), - backgroundColor: theme.scaffoldBackgroundColor, + backgroundColor: Variables.background, elevation: 0, iconTheme: IconThemeData(color: theme.colorScheme.onSurface), ), + backgroundColor: Variables.background, body: _isLoading ? const Center(child: CircularProgressIndicator()) diff --git a/lib/ui/pages/image_analysis_page.dart b/lib/ui/pages/image_analysis_page.dart @@ -149,7 +149,7 @@ class _ImageAnalysisPageState extends State<ImageAnalysisPage> { final colorScheme = Theme.of(context).colorScheme; return Scaffold( backgroundColor: Variables.surfaceBackground, - appBar: CustomAppBar( + appBar: CommonAppBar( title: "Image Analysis", showBack: true, leading: IconButton( @@ -259,7 +259,6 @@ class _ImageAnalysisPageState extends State<ImageAnalysisPage> { color: Variables.chipText, ) : null, - onDelete: () {}, ), ); }).toList(), @@ -304,8 +303,8 @@ class _ImageAnalysisPageState extends State<ImageAnalysisPage> { ), floatingActionButton: FloatingActionButton.extended( onPressed: _showSourceSelector, - backgroundColor: colorScheme.primary, - foregroundColor: colorScheme.onPrimary, + backgroundColor: Colors.grey[900], + foregroundColor: Colors.white, icon: const Icon(Icons.add_photo_alternate), label: Text( _selectedImage == null ? "Select Image" : "Change Image", diff --git a/lib/ui/pages/image_details_page.dart b/lib/ui/pages/image_details_page.dart @@ -405,7 +405,6 @@ class _ImageDetailsPageState extends State<ImageDetailsPage> { color: Variables.chipText, ) : null, - onDelete: () {}, ), ); }).toList(), @@ -427,7 +426,7 @@ class _ImageDetailsPageState extends State<ImageDetailsPage> { // Prevents the main screen from pushing up when the keyboard opens resizeToAvoidBottomInset: false, backgroundColor: Variables.surfaceBackground, - appBar: CustomAppBar( + appBar: CommonAppBar( showBack: true, leading: IconButton( icon: const Icon( @@ -839,7 +838,6 @@ class _ImageDetailsPageState extends State<ImageDetailsPage> { .map( (tag) => TagChip( label: tag, - onDelete: () {}, icon: null, ), ) diff --git a/lib/ui/pages/image_save_page.dart b/lib/ui/pages/image_save_page.dart @@ -434,7 +434,7 @@ class _ImageSavePageState extends State<ImageSavePage> { return Scaffold( resizeToAvoidBottomInset: false, backgroundColor: Variables.surfaceBackground, - appBar: CustomAppBar( + appBar: CommonAppBar( title: titleText, leading: IconButton( icon: const Icon( diff --git a/lib/ui/pages/project_board_page.dart b/lib/ui/pages/project_board_page.dart @@ -158,18 +158,17 @@ class _ProjectBoardPageState extends State<ProjectBoardPage> { Widget build(BuildContext context) { if (_currentProject == null) { return const Scaffold( - backgroundColor: Variables.surfaceBackground, + backgroundColor: Variables.background, body: Center(child: CircularProgressIndicator()), ); } return Scaffold( - backgroundColor: Variables.surfaceBackground, + backgroundColor: Variables.background, appBar: TopBar( currentProjectId: _currentProject!.id!, onBack: () => Navigator.pop(context), onProjectChanged: _onProjectChanged, - onSettingsPressed: () {}, isAlternateView: _showAlternateView, onLayoutToggle: () { setState(() { diff --git a/lib/ui/pages/project_detail_page.dart b/lib/ui/pages/project_detail_page.dart @@ -9,7 +9,7 @@ import 'package:creekui/services/project_service.dart'; import 'package:creekui/ui/styles/variables.dart'; import 'package:creekui/ui/widgets/empty_state.dart'; import 'package:creekui/ui/widgets/section_header.dart'; -import 'package:creekui/ui/widgets/app_bar.dart'; +import 'package:creekui/ui/widgets/top_bar.dart'; import 'package:creekui/ui/widgets/dialog.dart'; import 'package:creekui/ui/widgets/text_field.dart'; import 'package:creekui/ui/pages/settings_page.dart'; @@ -160,7 +160,7 @@ class _ProjectDetailPageState extends State<ProjectDetailPage> { Widget build(BuildContext context) { if (_isLoading) { return const Scaffold( - backgroundColor: Variables.surfaceBackground, + backgroundColor: Variables.background, body: Center(child: CircularProgressIndicator()), ); } @@ -168,46 +168,23 @@ class _ProjectDetailPageState extends State<ProjectDetailPage> { if (_project == null) return const Scaffold(body: SizedBox()); return Scaffold( - backgroundColor: Variables.surfaceBackground, - appBar: CustomAppBar( - title: _project!.title, - showBack: true, - leading: IconButton( - icon: const Icon( - Icons.arrow_back, - size: 20, - color: Variables.textPrimary, - ), - onPressed: () { - if (Navigator.canPop(context)) { - Navigator.pop(context); - } else { - Navigator.pushReplacement( - context, - MaterialPageRoute(builder: (_) => const HomePage()), - ); - } - }, - ), - actions: [ - IconButton( - icon: SvgPicture.asset( - 'assets/icons/settings-line.svg', - width: 24, - height: 24, - colorFilter: const ColorFilter.mode( - Variables.textPrimary, - BlendMode.srcIn, - ), - ), - onPressed: () { - Navigator.push( - context, - MaterialPageRoute(builder: (_) => const SettingsPage()), - ); - }, - ), - ], + backgroundColor: Variables.background, + appBar: TopBar( + currentProjectId: widget.projectId, + titleOverride: _project!.title, + hideSecondRow: true, + hideSelector: true, + showSettings: true, + onBack: () { + if (Navigator.canPop(context)) { + Navigator.pop(context); + } else { + Navigator.pushReplacement( + context, + MaterialPageRoute(builder: (_) => const HomePage()), + ); + } + }, ), body: RefreshIndicator( onRefresh: _loadData, diff --git a/lib/ui/pages/project_file_page.dart b/lib/ui/pages/project_file_page.dart @@ -310,7 +310,6 @@ class _ProjectFilePageState extends State<ProjectFilePage> { ); }, hideSecondRow: true, - onSettingsPressed: () {}, onLayoutToggle: () {}, isAlternateView: false, ), @@ -359,6 +358,7 @@ class _ProjectFilePageState extends State<ProjectFilePage> { controller: _searchController, hintText: "Search your files", onChanged: (v) => setState(() => _search = v.trim()), + backgroundColor: Variables.background, ), const SizedBox(height: 24), // All Files diff --git a/lib/ui/pages/project_tag_page.dart b/lib/ui/pages/project_tag_page.dart @@ -133,7 +133,7 @@ class _ProjectTagPageState extends State<ProjectTagPage> { } return Scaffold( - backgroundColor: Variables.surfaceBackground, + backgroundColor: Variables.background, appBar: TopBar( currentProjectId: widget.projectId, titleOverride: widget.tag.toUpperCase(), diff --git a/lib/ui/pages/settings_page.dart b/lib/ui/pages/settings_page.dart @@ -56,7 +56,7 @@ class _SettingsPageState extends State<SettingsPage> { final bool hasChanges = _nameController.text.trim() != _originalName; return Scaffold( backgroundColor: Colors.white, - appBar: const CustomAppBar(title: "Settings"), + appBar: const CommonAppBar(title: "Settings"), body: _isLoading ? const Center(child: CircularProgressIndicator()) diff --git a/lib/ui/pages/share_handler_page.dart b/lib/ui/pages/share_handler_page.dart @@ -120,7 +120,7 @@ class _ShareHandlerPageState extends State<ShareHandlerPage> { Widget build(BuildContext context) { return Scaffold( backgroundColor: Variables.background, - appBar: const CustomAppBar(title: "Processing", showBack: false), + appBar: const CommonAppBar(title: "Processing", showBack: false), body: Center( child: _hasError diff --git a/lib/ui/pages/share_to_file_page.dart b/lib/ui/pages/share_to_file_page.dart @@ -282,7 +282,7 @@ class _ShareToFilePageState extends State<ShareToFilePage> { Widget build(BuildContext context) { return Scaffold( backgroundColor: Variables.surfaceBackground, - appBar: CustomAppBar( + appBar: CommonAppBar( title: 'Files', leading: IconButton( icon: const Icon(Icons.arrow_back, color: Variables.textPrimary), diff --git a/lib/ui/pages/share_to_moodboard_page.dart b/lib/ui/pages/share_to_moodboard_page.dart @@ -72,7 +72,7 @@ class _ShareToMoodboardPageState extends State<ShareToMoodboardPage> { Widget build(BuildContext context) { return Scaffold( backgroundColor: Variables.surfaceBackground, - appBar: CustomAppBar( + appBar: CommonAppBar( title: "MoodBoards", leading: IconButton( icon: const Icon(Icons.arrow_back, color: Variables.textPrimary), diff --git a/lib/ui/pages/stylesheet_page.dart b/lib/ui/pages/stylesheet_page.dart @@ -202,7 +202,7 @@ class _StylesheetPageState extends State<StylesheetPage> { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: Variables.surfaceBackground, + backgroundColor: Variables.background, appBar: TopBar( currentProjectId: _currentProjectId, onBack: () => Navigator.of(context).pop(), @@ -214,7 +214,6 @@ class _StylesheetPageState extends State<StylesheetPage> { _logoPaths = []; _loadSavedStylesheet(); }), - onSettingsPressed: () {}, ), body: _isLoading @@ -267,13 +266,10 @@ class _StylesheetPageState extends State<StylesheetPage> { crossAxisAlignment: CrossAxisAlignment.start, children: [ Center( - child: SizedBox( - width: 200, - child: PrimaryButton( - text: "Regenerate Stylesheet", - iconPath: 'assets/icons/generate_icon.svg', - onPressed: _generateStylesheet, - ), + child: PrimaryButton( + text: "Regenerate Stylesheet", + iconPath: 'assets/icons/generate_icon.svg', + onPressed: _generateStylesheet, ), ), const SizedBox(height: 24), diff --git a/lib/ui/widgets/app_bar.dart b/lib/ui/widgets/app_bar.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:creekui/ui/styles/variables.dart'; -class CustomAppBar extends StatelessWidget implements PreferredSizeWidget { +class CommonAppBar extends StatelessWidget implements PreferredSizeWidget { final String? title; final Widget? titleWidget; final bool showBack; @@ -11,7 +11,7 @@ class CustomAppBar extends StatelessWidget implements PreferredSizeWidget { final double? leadingWidth; final bool centerTitle; - const CustomAppBar({ + const CommonAppBar({ super.key, this.title, this.titleWidget, @@ -29,7 +29,7 @@ class CustomAppBar extends StatelessWidget implements PreferredSizeWidget { title: titleWidget ?? (title != null ? Text(title!, style: Variables.headerStyle) : null), - backgroundColor: Variables.surfaceBackground, + backgroundColor: Variables.background, elevation: 0, centerTitle: centerTitle, leadingWidth: leadingWidth ?? (showBack ? 50 : 0), diff --git a/lib/ui/widgets/bottom_bar.dart b/lib/ui/widgets/bottom_bar.dart @@ -1,3 +1,4 @@ +import 'dart:math'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:creekui/ui/styles/variables.dart'; @@ -17,26 +18,26 @@ class BottomBar extends StatelessWidget { required this.projectId, }); - void _onItemTapped(BuildContext context, BottomBarItem item) { + void _onTap(BuildContext context, BottomBarItem item) { if (item == currentTab) return; - Widget page; + Widget nextPage; switch (item) { case BottomBarItem.moodboard: - page = ProjectBoardPage(projectId: projectId); + nextPage = ProjectBoardPage(projectId: projectId); break; case BottomBarItem.stylesheet: - page = StylesheetPage(projectId: projectId); + nextPage = StylesheetPage(projectId: projectId); break; case BottomBarItem.files: - page = ProjectFilePage(projectId: projectId); + nextPage = ProjectFilePage(projectId: projectId); break; } Navigator.pushReplacement( context, PageRouteBuilder( - pageBuilder: (_, __, ___) => page, + pageBuilder: (context, anim1, anim2) => nextPage, transitionDuration: Duration.zero, reverseTransitionDuration: Duration.zero, ), @@ -45,78 +46,82 @@ class BottomBar extends StatelessWidget { @override Widget build(BuildContext context) { + // Safe Area Padding + final double safeBottom = MediaQuery.of(context).padding.bottom; + final double effectiveBottomPadding = max(safeBottom, 24.0); + return Container( - height: 80, // Fixed height for consistency - decoration: BoxDecoration( + decoration: const BoxDecoration( color: Variables.background, - border: Border(top: BorderSide(color: Variables.borderSubtle)), + border: Border( + top: BorderSide(color: Variables.borderSubtle, width: 1), + ), ), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceAround, - children: [ - _NavBarItem( - iconPath: 'assets/icons/moodboard_icon.svg', - label: 'Moodboard', - isActive: currentTab == BottomBarItem.moodboard, - onTap: () => _onItemTapped(context, BottomBarItem.moodboard), - ), - _NavBarItem( - iconPath: 'assets/icons/stylesheet.svg', - label: 'Stylesheet', - isActive: currentTab == BottomBarItem.stylesheet, - onTap: () => _onItemTapped(context, BottomBarItem.stylesheet), - ), - _NavBarItem( - iconPath: 'assets/icons/files_icon.svg', - label: 'Files', - isActive: currentTab == BottomBarItem.files, - onTap: () => _onItemTapped(context, BottomBarItem.files), - ), - ], + padding: EdgeInsets.only(bottom: effectiveBottomPadding, top: 12), + child: SizedBox( + height: 54, + child: Row( + children: [ + Expanded( + child: _buildNavItem( + context, + BottomBarItem.moodboard, + "Moodboard", + "assets/icons/moodboard_icon.svg", + ), + ), + Expanded( + child: _buildNavItem( + context, + BottomBarItem.stylesheet, + "Stylesheet", + "assets/icons/stylesheet_icon.svg", + ), + ), + Expanded( + child: _buildNavItem( + context, + BottomBarItem.files, + "Files", + "assets/icons/files_icon.svg", + ), + ), + ], + ), ), ); } -} - -class _NavBarItem extends StatelessWidget { - final String iconPath; - final String label; - final bool isActive; - final VoidCallback onTap; - const _NavBarItem({ - required this.iconPath, - required this.label, - required this.isActive, - required this.onTap, - }); - - @override - Widget build(BuildContext context) { - final color = isActive ? Variables.iconActive : Variables.iconInactive; + Widget _buildNavItem( + BuildContext context, + BottomBarItem item, + String label, + String assetPath, + ) { + final bool isSelected = item == currentTab; + final Color color = + isSelected ? Variables.textPrimary : Variables.textDisabled; - return InkWell( - onTap: onTap, - borderRadius: BorderRadius.circular(8), - child: Padding( - padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8), + return GestureDetector( + onTap: () => _onTap(context, item), + behavior: HitTestBehavior.opaque, + child: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, - mainAxisSize: MainAxisSize.min, children: [ SvgPicture.asset( - iconPath, + assetPath, width: 24, height: 24, colorFilter: ColorFilter.mode(color, BlendMode.srcIn), ), - const SizedBox(height: 4), + const SizedBox(height: 6), Text( label, style: Variables.captionStyle.copyWith( color: color, - fontWeight: isActive ? FontWeight.w600 : FontWeight.w500, - fontSize: 10, + fontSize: 11, + fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal, ), ), ], diff --git a/lib/ui/widgets/dialog.dart b/lib/ui/widgets/dialog.dart @@ -11,8 +11,7 @@ class ShowDialog extends StatelessWidget { final VoidCallback onPrimaryPressed; final String secondaryButtonText; final VoidCallback? onSecondaryPressed; - final bool - isDestructive; // Makes primary button red if true (future enhancement) + final bool isDestructive; final bool isLoading; const ShowDialog({ @@ -97,6 +96,7 @@ class ShowDialog extends StatelessWidget { text: primaryButtonText, onPressed: onPrimaryPressed, isLoading: isLoading, + backgroundColor: isDestructive ? Colors.red : null, ), ), ], diff --git a/lib/ui/widgets/file_card.dart b/lib/ui/widgets/file_card.dart @@ -30,7 +30,7 @@ class FileCard extends StatelessWidget { return GestureDetector( onTap: onTap, child: Container( - height: 100, + height: 110, decoration: BoxDecoration( color: Variables.background, borderRadius: BorderRadius.circular(Variables.radiusMedium), @@ -91,21 +91,13 @@ class FileCard extends StatelessWidget { overflow: TextOverflow.ellipsis, ), const SizedBox(height: 4), - Row( - children: [ - Text(dimensions, style: Variables.captionStyle), - const SizedBox(width: 8), - Container( - width: 3, - height: 3, - decoration: const BoxDecoration( - color: Variables.textDisabled, - shape: BoxShape.circle, - ), - ), - const SizedBox(width: 8), - Text(timeAgo, style: Variables.captionStyle), - ], + Text(dimensions, style: Variables.captionStyle), + const SizedBox(height: 2), + Text( + timeAgo, + style: Variables.captionStyle.copyWith( + color: Variables.textSecondary, + ), ), ], ), diff --git a/lib/ui/widgets/primary_button.dart b/lib/ui/widgets/primary_button.dart @@ -7,6 +7,7 @@ class PrimaryButton extends StatelessWidget { final VoidCallback? onPressed; final bool isLoading; final String? iconPath; + final Color? backgroundColor; const PrimaryButton({ super.key, @@ -14,6 +15,7 @@ class PrimaryButton extends StatelessWidget { this.onPressed, this.isLoading = false, this.iconPath, + this.backgroundColor, }); @override @@ -23,7 +25,7 @@ class PrimaryButton extends StatelessWidget { child: ElevatedButton( onPressed: isLoading ? null : onPressed, style: ElevatedButton.styleFrom( - backgroundColor: Variables.textPrimary, + backgroundColor: backgroundColor ?? Variables.textPrimary, foregroundColor: Colors.white, padding: const EdgeInsets.symmetric(vertical: 12), shape: RoundedRectangleBorder( diff --git a/lib/ui/widgets/search_bar.dart b/lib/ui/widgets/search_bar.dart @@ -5,12 +5,14 @@ class CommonSearchBar extends StatelessWidget { final TextEditingController controller; final ValueChanged<String>? onChanged; final String hintText; + final Color? backgroundColor; const CommonSearchBar({ super.key, required this.controller, this.onChanged, this.hintText = 'Search', + this.backgroundColor, }); @override @@ -34,7 +36,7 @@ class CommonSearchBar extends StatelessWidget { minHeight: 18, ), filled: true, - fillColor: Variables.surfaceSubtle, + fillColor: backgroundColor ?? Variables.surfaceSubtle, border: OutlineInputBorder( borderRadius: BorderRadius.circular(Variables.radiusSmall), borderSide: BorderSide.none, diff --git a/lib/ui/widgets/selection_overlay_painter.dart b/lib/ui/widgets/selection_overlay_painter.dart @@ -15,7 +15,24 @@ class SelectionOverlayPainter extends CustomPainter { @override void paint(Canvas canvas, Size size) { - // 1. Draw the Selection Border + // 1. Dim the rest of image + final backgroundPath = + Path()..addRect(Rect.fromLTWH(0, 0, size.width, size.height)); + final selectionPath = Path()..addRect(rect); + final dimmedPath = Path.combine( + PathOperation.difference, + backgroundPath, + selectionPath, + ); + + final dimPaint = + Paint() + ..color = Colors.black.withOpacity(0.5) + ..style = PaintingStyle.fill; + + canvas.drawPath(dimmedPath, dimPaint); + + // 2. Draw Selection Border final paint = Paint() ..color = Variables.selectionBorder @@ -25,7 +42,7 @@ class SelectionOverlayPainter extends CustomPainter { // Use a dash effect for the selection box _drawDashedRect(canvas, rect, paint); - // 2. If Resizing, Draw Handles + // 3. If Resizing, Draw Handles if (isResizing) { final handlePaint = Paint() @@ -52,7 +69,7 @@ class SelectionOverlayPainter extends CustomPainter { canvas.drawCircle(handle, handleRadius, handleBorderPaint); } - // 3. Draw Center Handle (Move) + // 4. Draw Center Handle (Move) final centerPaint = Paint() ..color = Variables.accentMagic.withOpacity(0.5) diff --git a/lib/ui/widgets/tag_chip.dart b/lib/ui/widgets/tag_chip.dart @@ -3,15 +3,10 @@ import 'package:creekui/ui/styles/variables.dart'; class TagChip extends StatelessWidget { final String label; - final VoidCallback onDelete; + final VoidCallback? onDelete; final Widget? icon; - const TagChip({ - super.key, - required this.label, - required this.onDelete, - this.icon, - }); + const TagChip({super.key, required this.label, this.onDelete, this.icon}); @override Widget build(BuildContext context) { @@ -32,15 +27,17 @@ class TagChip extends StatelessWidget { color: Variables.textPrimary, ), ), - const SizedBox(width: 8), - GestureDetector( - onTap: onDelete, - child: const Icon( - Icons.close, - size: 16, - color: Variables.textPrimary, + if (onDelete != null) ...[ + const SizedBox(width: 8), + GestureDetector( + onTap: onDelete, + child: const Icon( + Icons.close, + size: 16, + color: Variables.textPrimary, + ), ), - ), + ], ], ), ); diff --git a/lib/ui/widgets/top_bar.dart b/lib/ui/widgets/top_bar.dart @@ -15,9 +15,11 @@ class TopBar extends StatefulWidget implements PreferredSizeWidget { final VoidCallback? onLayoutPressed; final VoidCallback? onFilterPressed; final VoidCallback? onAIPressed; - final bool? isAlternateView; // For toggle state - final VoidCallback? onLayoutToggle; // For toggle callback - final bool hideSecondRow; // Hide the second row (dropdown, buttons, etc.) + final bool? isAlternateView; + final VoidCallback? onLayoutToggle; + final bool hideSecondRow; + final bool hideSelector; + final bool showSettings; const TopBar({ super.key, @@ -32,6 +34,8 @@ class TopBar extends StatefulWidget implements PreferredSizeWidget { this.isAlternateView, this.onLayoutToggle, this.hideSecondRow = false, + this.hideSelector = false, + this.showSettings = true, }); @override @@ -39,9 +43,7 @@ class TopBar extends StatefulWidget implements PreferredSizeWidget { @override Size get preferredSize => - hideSecondRow - ? const Size.fromHeight(48.0) // Height for single row - : const Size.fromHeight(88.0); // Height for two rows + hideSecondRow ? const Size.fromHeight(48.0) : const Size.fromHeight(88.0); } class _TopBarState extends State<TopBar> { @@ -189,20 +191,26 @@ class _TopBarState extends State<TopBar> { ) : const SizedBox(), ), + // Settings Icon - if (!widget.hideSecondRow) - GestureDetector( - onTap: _openSettings, - behavior: HitTestBehavior.opaque, - child: Container( - padding: const EdgeInsets.all(4), - child: SvgPicture.asset( - 'assets/icons/settings-line.svg', - width: 24, - height: 24, - colorFilter: const ColorFilter.mode( - Variables.textPrimary, - BlendMode.srcIn, + if (widget.showSettings) + Material( + color: Colors.transparent, + child: InkWell( + onTap: _openSettings, + borderRadius: BorderRadius.circular(24), + child: Container( + width: 48, + height: 48, + alignment: Alignment.center, + child: SvgPicture.asset( + 'assets/icons/settings-line.svg', + width: 24, + height: 24, + colorFilter: const ColorFilter.mode( + Variables.textPrimary, + BlendMode.srcIn, + ), ), ), ), @@ -221,7 +229,8 @@ class _TopBarState extends State<TopBar> { Row( children: [ // Global Dropdown - if (!_isLoading && + if (!widget.hideSelector && + !_isLoading && _currentProject != null && _rootProject != null) PopupMenuButton<ProjectModel>(