final4lab

lib/domain/models/stock.dart

@@ -86,7 +86,7 @@ class _StocksWidgetState extends State<StocksWidget> {
             const SizedBox(height: 20),
             // ...stocks.map((e) => StockCard(stock: e)),
             ...stocks.map((e) => StockCard.fromData(e,
-                onLike: () => _showSnackBar(context),)),   // .toList()
+                onLike: () => _showSnackBar(context),)).toList(),   // .toList()
           ],
         ),
       ),
@@ -100,7 +100,7 @@ class _StocksWidgetState extends State<StocksWidget> {
           'Stock liked',
           style: Theme.of(context).textTheme.bodyLarge,
         ),
-        backgroundColor: Colors.red,
+        backgroundColor: Color(0xFFFFFFFF),
         duration: const Duration(seconds: 1),
       ));
     });
@@ -136,7 +136,16 @@ class _StockCardState extends State<StockCard> {
 
   @override
   Widget build(BuildContext context) {
-    return Card(
+    return GestureDetector(
+        onTap: () {
+          Navigator.push(
+            context,
+            MaterialPageRoute(
+              builder: (context) => DetailPage(name: widget.name, imageUrl: widget.imageUrl),
+            ),
+          );
+        },
+    child: Card(
       margin: const EdgeInsets.all(8.5),
       child: Padding(
         padding: const EdgeInsets.all(20),
@@ -172,16 +181,18 @@ class _StockCardState extends State<StockCard> {
                 setState(() {
                   isLiked = !isLiked;
                 });
+                if(isLiked) widget.onLike?.call();
               },
               child: Icon(
                 Icons.favorite,
-                color: isLiked ? Colors.red : Colors.grey,
+                color: isLiked ? Colors.red : Colors.black,
                 size: 30.0,
               ),
             ),
           ],
         ),
       ),
+    )
     );
   }
 }

lib/presentation/details_page/details_page.dart

@@ -1,9 +1,11 @@
 import 'package:flutter/material.dart';
 
 class DetailPage extends StatelessWidget {
-  final String info;
+  final String? name;
+  final String? imageUrl;
+  // final String? category;
 
-  const DetailPage({super.key, required this.info});
+  const DetailPage({super.key, required this.name, this.imageUrl});
 
   @override
   Widget build(BuildContext context) {
@@ -13,9 +15,19 @@ class DetailPage extends StatelessWidget {
       ),
       body: Padding(
         padding: const EdgeInsets.all(16.0),
-        child: Text(
-          info,
-          style: const TextStyle(fontSize: 18.0),
+        child: Column(
+          children: [
+            Text(
+            name ?? '',
+            style: const TextStyle(fontSize: 20.0),
+            ),
+            Image.network(
+              imageUrl ?? 'https://img.freepik.com/premium-vector/vector-illustration-about-concept-of-no-result-data-or-document-or-file-not-found_675567-5734.jpg',
+              // fit: BoxFit.cover,
+              height: 350.0,
+              width: double.infinity,
+            )
+          ]
         ),
       ),
     );

lib/presentation/home_page/home_page.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:fl_chart/fl_chart.dart';
 import '../StockCategory.dart';
+import '../details_page/details_page.dart';
 
 part '../../domain/models/stock.dart';
 
@@ -23,7 +24,7 @@ class _MyHomePageState extends State<MyHomePage> {
   Widget build(BuildContext context) {
     return Scaffold(
       appBar: AppBar(
-        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
+        backgroundColor: Color(0x6EFFE800), // Theme.of(context).colorScheme.inversePrimary,
         title: Text(widget.title),
       ),
       body: const StocksWidget(),