@@ -108,11 +108,11 @@ class _ToolsScreenState extends State<ToolsScreen> {
108108 padding: const EdgeInsets .all (16.0 ),
109109 sliver: SliverGrid (
110110 gridDelegate:
111- const SliverGridDelegateWithMaxCrossAxisExtent (
112- maxCrossAxisExtent : 180 , // More responsive grid
113- crossAxisSpacing: 16 ,
114- mainAxisSpacing: 16 ,
115- childAspectRatio: 0.85 , // Adjusted aspect ratio
111+ const SliverGridDelegateWithFixedCrossAxisCount (
112+ crossAxisCount : 2 ,
113+ crossAxisSpacing: 12 ,
114+ mainAxisSpacing: 12 ,
115+ childAspectRatio: 0.9 ,
116116 ),
117117 delegate: SliverChildListDelegate ([
118118 _buildToolCard (
@@ -346,80 +346,52 @@ class _ToolsScreenState extends State<ToolsScreen> {
346346 onTap: onTap,
347347 borderRadius: BorderRadius .circular (16 ),
348348 child: Padding (
349- padding: const EdgeInsets .all (16 .0 ),
349+ padding: const EdgeInsets .all (12 .0 ),
350350 child: Column (
351351 mainAxisAlignment: MainAxisAlignment .start,
352352 crossAxisAlignment: CrossAxisAlignment .center,
353353 children: [
354- // Row for icon and info button
355- Row (
356- mainAxisAlignment: MainAxisAlignment .spaceBetween,
357- children: [
358- Container (
359- padding: const EdgeInsets .all (12 ),
360- decoration: BoxDecoration (
361- color: backgroundColor,
362- borderRadius: BorderRadius .circular (12 ),
363- boxShadow: [
364- BoxShadow (
365- color: iconColor.withValues (alpha: 0.2 ),
366- blurRadius: 6 ,
367- offset: const Offset (0 , 2 ),
368- ),
369- ],
354+ Container (
355+ padding: const EdgeInsets .all (8 ),
356+ decoration: BoxDecoration (
357+ color: backgroundColor,
358+ borderRadius: BorderRadius .circular (8 ),
359+ boxShadow: [
360+ BoxShadow (
361+ color: iconColor.withValues (alpha: 0.2 ),
362+ blurRadius: 4 ,
363+ offset: const Offset (0 , 1 ),
370364 ),
371- child: Icon (icon, color: iconColor, size: 32 ),
372- ),
373- // Info icon in top right
374- IconButton (
375- icon: const Icon (Icons .info_outline, size: 20 ),
376- color: Colors .grey[400 ],
377- onPressed: () {
378- showDialog (
379- context: context,
380- builder: (BuildContext context) {
381- return AlertDialog (
382- backgroundColor: AppTheme .secondaryDark,
383- title: Text (
384- title,
385- style: const TextStyle (
386- color: Colors .white,
387- fontWeight: FontWeight .bold,
388- ),
389- ),
390- content: Text (
391- description,
392- style: TextStyle (
393- color: Colors .grey[300 ],
394- fontSize: 14 ,
395- ),
396- ),
397- actions: [
398- TextButton (
399- onPressed: () => Navigator .of (context).pop (),
400- child: const Text (
401- 'OK' ,
402- style: TextStyle (color: AppTheme .primaryBlue),
403- ),
404- ),
405- ],
406- );
407- },
408- );
409- },
365+ ],
366+ ),
367+ child: Icon (icon, color: iconColor, size: 24 ),
368+ ),
369+ const SizedBox (height: 8 ),
370+ Flexible (
371+ child: Text (
372+ title,
373+ style: TextStyle (
374+ fontSize: 14 ,
375+ fontWeight: FontWeight .bold,
376+ color: isExitButton ? Colors .red : Colors .white,
410377 ),
411- ],
378+ textAlign: TextAlign .center,
379+ maxLines: 2 ,
380+ overflow: TextOverflow .ellipsis,
381+ ),
412382 ),
413- const SizedBox (height: 16 ),
414- // Title with full display (no overflow)
415- Text (
416- title,
417- style: TextStyle (
418- fontSize: 16 ,
419- fontWeight: FontWeight .w600,
420- color: isExitButton ? Colors .red : Colors .white,
383+ const SizedBox (height: 4 ),
384+ Flexible (
385+ child: Text (
386+ description,
387+ style: TextStyle (
388+ fontSize: 11 ,
389+ color: isExitButton ? Colors .redAccent : Colors .grey[400 ],
390+ ),
391+ textAlign: TextAlign .center,
392+ maxLines: 2 ,
393+ overflow: TextOverflow .ellipsis,
421394 ),
422- textAlign: TextAlign .center,
423395 ),
424396 ],
425397 ),
0 commit comments