From a9d818dec4dfe121149cf2ae3e74c879122cd886 Mon Sep 17 00:00:00 2001
From: Marcos <marcos.lapuente@gmail.com>
Date: Thu, 21 May 2026 17:34:50 +0200
Subject: [PATCH] feat: Add border color support to NoteCard and DraggableNote
 for enhanced visual distinction

---
 lib/screens/home_screen.dart | 11 ++++++++++-
 lib/widgets/note_card.dart   | 14 ++++++++++++--
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/lib/screens/home_screen.dart b/lib/screens/home_screen.dart
index 2d7c553..d1b786e 100644
--- a/lib/screens/home_screen.dart
+++ b/lib/screens/home_screen.dart
@@ -313,6 +313,10 @@ class _HomeScreenState extends State<HomeScreen> {
     final int crossAxisCount = math.max((width / 250).floor().round(), 2);
     final List<Note> visibleNotes = _getFilteredNotes();
     final Category? currentCategory = _currentCategory();
+    final Map<String, Color> categoryBorderColors = <String, Color>{
+      for (final Category category in _categories)
+        if (category.colorValue != null) category.id: Color(category.colorValue!),
+    };
 
     final Widget body = _isLoading
         ? const Center(child: CircularProgressIndicator())
@@ -371,6 +375,7 @@ class _HomeScreenState extends State<HomeScreen> {
 
                                       final Widget draggableNote = _DraggableNote(
                                         note: filteredNotes[index],
+                                        borderColor: categoryBorderColors[filteredNotes[index].categoryId],
                                         dataIndex: _notes.indexOf(
                                           filteredNotes[index],
                                         ),
@@ -564,6 +569,7 @@ class _HomeScreenState extends State<HomeScreen> {
 class _DraggableNote extends StatelessWidget {
   const _DraggableNote({
     required this.note,
+    this.borderColor,
     required this.dataIndex,
     required this.cellWidth,
     required this.requiresLongPressToDrag,
@@ -576,6 +582,7 @@ class _DraggableNote extends StatelessWidget {
   });
 
   final Note note;
+  final Color? borderColor;
   final int dataIndex;
   final double cellWidth;
   final bool requiresLongPressToDrag;
@@ -611,6 +618,7 @@ class _DraggableNote extends StatelessWidget {
                 note: note,
                 onTap: () {},
                 isDragging: true,
+                borderColor: borderColor,
               ),
             ),
           ),
@@ -629,7 +637,7 @@ class _DraggableNote extends StatelessWidget {
           decoration: BoxDecoration(
             color: const Color.fromRGBO(24, 25, 26, 1),
             borderRadius: BorderRadius.circular(12),
-            border: Border.all(color: Colors.white24, width: 1),
+            border: Border.all(color: borderColor ?? Colors.white24, width: 1),
           ),
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
@@ -673,6 +681,7 @@ class _DraggableNote extends StatelessWidget {
         note: note,
         onTap: onTap,
         isDragging: isDragging,
+        borderColor: borderColor,
       ),
     );
 
diff --git a/lib/widgets/note_card.dart b/lib/widgets/note_card.dart
index 9ee06a3..fc03d47 100644
--- a/lib/widgets/note_card.dart
+++ b/lib/widgets/note_card.dart
@@ -8,11 +8,18 @@ import 'package:notas/models/note.dart';
 // like MasonryGridView or Draggable feedback). Visual styling only.
 
 class NoteCard extends StatefulWidget {
-  const NoteCard({super.key, required this.note, this.onTap, this.isDragging = false});
+  const NoteCard({
+    super.key,
+    required this.note,
+    this.onTap,
+    this.isDragging = false,
+    this.borderColor,
+  });
 
   final Note note;
   final VoidCallback? onTap;
   final bool isDragging;
+  final Color? borderColor;
 
   @override
   State<NoteCard> createState() => _NoteCardState();
@@ -55,7 +62,10 @@ class _NoteCardState extends State<NoteCard> {
           decoration: BoxDecoration(
             color: const Color.fromRGBO(24, 25, 26, 1),
             borderRadius: BorderRadius.circular(12),
-            border: Border.all(color: Colors.white24, width: 1),
+            border: Border.all(
+              color: widget.borderColor ?? Colors.white24,
+              width: 1,
+            ),
           ),
           child: LayoutBuilder(
             builder: (BuildContext context, BoxConstraints constraints) {