admin/marco.pms.mobileapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Improve comment action buttons layout and spacing in ContactDetailScreen

Browse Source
This commit is contained in:
Vaibhav Surve 2025-09-30 11:56:32 +05:30
parent 38ae9e3571
commit dbd4a42b7a
1 changed files with 59 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

97
lib/view/directory/contact_detail_screen.dart
View File

@ -430,17 +430,15 @@ class _ContactDetailScreenState extends State<ContactDetailScreen> {
return AnimatedContainer( return AnimatedContainer(
duration: const Duration(milliseconds: 300), duration: const Duration(milliseconds: 300),
padding: MySpacing.xy(8, 7), padding: MySpacing.xy(12, 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: isEditing ? Colors.indigo[50] : Colors.white, color: isEditing ? Colors.indigo[50] : Colors.white,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(5),
border: Border.all( border: Border.all(
color: isEditing ? Colors.indigo : Colors.grey.shade300, color: isEditing ? Colors.indigo : Colors.grey.shade300,
width: 1.2, width: 1.2,
), ),
boxShadow: const [
BoxShadow(color: Colors.black12, blurRadius: 4, offset: Offset(0, 2))
],
), ),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
@ -468,10 +466,16 @@ class _ContactDetailScreenState extends State<ContactDetailScreen> {
), ),
), ),
// Action buttons // Action buttons
// Action buttons (reduced spacing between delete & edit)
Row( Row(
mainAxisSize: MainAxisSize.min,
children: [ children: [
// 🔹 Restore button for inactive comments
if (!comment.isActive) if (!comment.isActive)
IconButton( IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
icon: const Icon(Icons.restore, icon: const Icon(Icons.restore,
color: Colors.green, size: 20), color: Colors.green, size: 20),
tooltip: "Restore", tooltip: "Restore",
@ -492,41 +496,58 @@ class _ContactDetailScreenState extends State<ContactDetailScreen> {
barrierDismissible: false, barrierDismissible: false,
); );
}, },
) ),
else
IconButton( // 🔹 Delete + Edit icons for active comments (tightened spacing)
icon: if (comment.isActive)
const Icon(Icons.delete, color: Colors.red, size: 20), Row(
tooltip: "Delete", mainAxisSize: MainAxisSize.min,
onPressed: () async { children: [
await Get.dialog( IconButton(
ConfirmDialog( visualDensity: VisualDensity.compact,
title: "Delete Comment", padding: EdgeInsets.zero,
message: constraints: const BoxConstraints(),
"Are you sure you want to delete this comment?", icon: const Icon(Icons.delete,
confirmText: "Delete", color: Colors.red, size: 20),
confirmColor: Colors.red, tooltip: "Delete",
icon: Icons.delete_forever, onPressed: () async {
onConfirm: () async { await Get.dialog(
await directoryController.deleteComment( ConfirmDialog(
comment.id, contactId); title: "Delete Comment",
}, message:
"Are you sure you want to delete this comment?",
confirmText: "Delete",
confirmColor: Colors.red,
icon: Icons.delete_forever,
onConfirm: () async {
await directoryController.deleteComment(
comment.id, contactId);
},
),
barrierDismissible: false,
);
},
),
const SizedBox(
width:
4), // 👈 reduce icon gap here (was ~12 by default)
IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
icon: Icon(
isEditing ? Icons.close : Icons.edit,
size: 20,
color: Colors.indigo,
), ),
barrierDismissible: false, tooltip: isEditing ? "Cancel Edit" : "Edit",
); onPressed: () {
}, directoryController.editingCommentId.value =
isEditing ? null : comment.id;
},
),
],
), ),
IconButton(
icon: Icon(
isEditing ? Icons.close : Icons.edit,
size: 20,
color: Colors.indigo,
),
onPressed: () {
directoryController.editingCommentId.value =
isEditing ? null : comment.id;
},
),
], ],
), ),
], ],