Added theme, reworked UI

lib/pages/stats/stats_page.dart

@@ -3,9 +3,9 @@ import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:tunas/domains/charts/chart_bloc.dart';
 import 'package:tunas/pages/stats/widgets/account_counters.dart';
 import 'package:tunas/pages/stats/widgets/categories_totals_chart.dart';
-import 'package:tunas/pages/stats/widgets/main_counter.dart';
+import 'package:tunas/pages/stats/widgets/global_counter.dart';
 import 'package:tunas/pages/stats/widgets/monthly_categories_total_chart.dart';
-import 'package:tunas/pages/stats/widgets/monthly_total_chart.dart';
+import 'package:tunas/pages/stats/widgets/global_total_chart.dart';
 import 'package:tunas/pages/stats/widgets/profit_indicator.dart';
 import 'package:tunas/pages/stats/widgets/year_selector.dart';
 import 'package:tunas/repositories/account/account_repository.dart';
@@ -31,7 +31,7 @@ class StatsPage extends StatelessWidget {
                       children: [
                         Expanded(
                           flex: 2,
-                          child: MainCounter(value: state.globalTotal)
+                          child: GlobalCounter(value: state.globalTotal)
                         ),
                         Expanded(
                           flex: 1,

lib/pages/stats/widgets/account_counters.dart

@@ -6,7 +6,7 @@ class AccountCounter extends StatelessWidget {
 
   const AccountCounter({super.key, required this.accountsTotals});
 
-  List<Row> _renderAccountTotals() {
+  List<Row> _renderAccountTotals(BuildContext context) {
     return accountsTotals.entries.toList().map((entry) => Row(
       mainAxisAlignment: MainAxisAlignment.spaceBetween,
       children: [
@@ -21,7 +21,7 @@ class AccountCounter extends StatelessWidget {
           style: TextStyle(
             fontFamily: 'NovaMono',
             fontSize: 15,
-            color: entry.value > 0 ? const Color.fromARGB(255, 0, 255, 8) : Colors.red
+            color: entry.value > 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error
         )),
       ],
     )).toList();
@@ -33,13 +33,22 @@ class AccountCounter extends StatelessWidget {
       padding: const EdgeInsets.all(10),
       margin: const EdgeInsets.all(20),
       decoration: BoxDecoration(
-        borderRadius: BorderRadius.circular(5),
-        color: Colors.blue
+        borderRadius: BorderRadius.circular(15),
+        color: Theme.of(context).colorScheme.primaryContainer,
+        boxShadow: [
+          BoxShadow(
+            color: Theme.of(context).colorScheme.shadow,
+            blurRadius: 10,
+            offset: const Offset(2, 2),
+            spreadRadius: 0.1,
+            blurStyle: BlurStyle.normal,
+          )
+        ]
       ),
       alignment: Alignment.centerRight,
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.end,
-        children: _renderAccountTotals(),
+        children: _renderAccountTotals(context),
       ),
     );
   }

lib/pages/stats/widgets/categories_totals_chart.dart

@@ -39,7 +39,10 @@ class CategoriesTotalsChart extends StatelessWidget {
               Container(
                 height: 10,
                 width: 10,
-                color: categoriesColors[item.label],
+                decoration: BoxDecoration(
+                  color: categoriesColors[item.label],
+                  borderRadius: BorderRadius.circular(15)
+                ),
               ),
               Container(width: 5),
               Text(item.label),
@@ -64,8 +67,17 @@ class CategoriesTotalsChart extends StatelessWidget {
         padding: const EdgeInsets.all(10),
         margin: const EdgeInsets.all(20),
         decoration: BoxDecoration(
-          borderRadius: BorderRadius.circular(5),
-          color: Colors.blue
+          borderRadius: BorderRadius.circular(15),
+          color: Theme.of(context).colorScheme.primaryContainer,
+          boxShadow: [
+            BoxShadow(
+              color: Theme.of(context).colorScheme.shadow,
+              blurRadius: 10,
+              offset: const Offset(2, 2),
+              spreadRadius: 0.1,
+              blurStyle: BlurStyle.normal,
+            )
+          ]
         ),
         child: Row(
           children: [
@@ -87,7 +99,7 @@ class CategoriesTotalsChart extends StatelessWidget {
               padding: const EdgeInsets.all(10),
               decoration: BoxDecoration(
                 borderRadius: BorderRadius.circular(5),
-                color: Colors.blueGrey
+                color: Theme.of(context).colorScheme.secondaryContainer
               ),
               child: SingleChildScrollView(
                 scrollDirection: Axis.vertical,

lib/pages/stats/widgets/global_counter.dart

@@ -0,0 +1,39 @@
+import 'package:flutter/material.dart';
+import 'package:intl/intl.dart';
+
+class GlobalCounter extends StatelessWidget {
+  final double value;
+
+  const GlobalCounter({super.key, required this.value});
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: const EdgeInsets.all(10),
+      margin: const EdgeInsets.all(20),
+      decoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(15),
+        color: Theme.of(context).colorScheme.primaryContainer,
+        boxShadow: [
+          BoxShadow(
+            color: Theme.of(context).colorScheme.shadow,
+            blurRadius: 10,
+            offset: const Offset(2, 2),
+            spreadRadius: 0.1,
+            blurStyle: BlurStyle.normal,
+          )
+        ]
+      ),
+      alignment: Alignment.centerRight,
+      child: Text(
+        NumberFormat('000.00 €', 'fr_FR').format(value),
+        style: TextStyle(
+          fontFamily: 'NovaMono',
+          fontSize: 60,
+          fontWeight: FontWeight.w500,
+          color: value > 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error
+        ),
+      ),
+    );
+  }
+}

lib/pages/stats/widgets/global_total_chart.dart

@@ -18,9 +18,7 @@ class GlobalTotalChart extends StatelessWidget {
 
     return Padding(
       padding: const EdgeInsets.only(
-        left: 12,
         bottom: 12,
-        right: 20,
         top: 20,
       ),
       child: AspectRatio(
@@ -31,7 +29,7 @@ class GlobalTotalChart extends StatelessWidget {
               lineTouchData: LineTouchData(
                 touchTooltipData: LineTouchTooltipData(
                   maxContentWidth: 100,
-                  tooltipBgColor: Colors.black,
+                  tooltipBgColor: Theme.of(context).colorScheme.primaryContainer,
                   getTooltipItems: (touchedSpots) {
                     return touchedSpots.map((LineBarSpot touchedSpot) {
                       final textStyle = TextStyle(
@@ -52,13 +50,18 @@ class GlobalTotalChart extends StatelessWidget {
               ),
               lineBarsData: [
                 LineChartBarData(
-                  color: Colors.pink,
+                  color: Theme.of(context).colorScheme.primary,
                   spots: monthlyTotals,
                   isCurved: true,
                   isStrokeCapRound: true,
                   barWidth: 3,
                   belowBarData: BarAreaData(
-                    show: false,
+                    show: true,
+                    gradient: LinearGradient(
+                      colors: [Theme.of(context).colorScheme.primary, Theme.of(context).colorScheme.secondary]
+                        .map((color) => color.withOpacity(0.2))
+                        .toList(),
+                    ),
                   ),
                   dotData: const FlDotData(show: false),
                 ),

lib/pages/stats/widgets/main_counter.dart

@@ -1,30 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:intl/intl.dart';
-
-class MainCounter extends StatelessWidget {
-  final double value;
-
-  const MainCounter({super.key, required this.value});
-
-  @override
-  Widget build(BuildContext context) {
-    return Container(
-      padding: const EdgeInsets.all(10),
-      margin: const EdgeInsets.all(20),
-      decoration: BoxDecoration(
-        borderRadius: BorderRadius.circular(5),
-        color: Colors.blue
-      ),
-      alignment: Alignment.centerRight,
-      child: Text(
-        NumberFormat('000.00 €', 'fr_FR').format(value),
-        style: TextStyle(
-          fontFamily: 'NovaMono',
-          fontSize: 60,
-          fontWeight: FontWeight.w500,
-          color: value > 0 ? const Color.fromARGB(255, 0, 255, 8) : Colors.red
-        ),
-      ),
-    );
-  }
-}

lib/pages/stats/widgets/monthly_categories_total_chart.dart

@@ -100,10 +100,10 @@ class MonthlyCategoriesTotalChart extends StatelessWidget {
                       Color color = Colors.black;
                       if (rodIndex == 0) {
                         value = "+$value";
-                        color = Colors.green;
+                        color = Theme.of(context).colorScheme.primary;
                       } else {
                         value = "-$value";
-                        color = Colors.red;
+                        color = Theme.of(context).colorScheme.error;
                       }
 
                       return BarTooltipItem(

lib/pages/stats/widgets/profit_indicator.dart

@@ -13,7 +13,7 @@ class ProfitIndicator extends StatelessWidget {
       margin: const EdgeInsets.fromLTRB(0, 0, 20, 0),
       padding: const EdgeInsets.fromLTRB(10, 5, 10, 5),
       decoration: BoxDecoration(
-        color: Colors.blue,
+        color: Theme.of(context).colorScheme.primaryContainer,
         borderRadius: BorderRadius.circular(5)
       ),
       child: Text(
@@ -22,7 +22,7 @@ class ProfitIndicator extends StatelessWidget {
           fontFamily: 'NovaMono',
           fontSize: 20,
           fontWeight: FontWeight.w500,
-          color: profit > 0 ? const Color.fromARGB(255, 0, 255, 8) : Colors.red
+          color: profit > 0 ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error
         ),
       )
     );

lib/pages/stats/widgets/year_selector.dart

@@ -12,8 +12,8 @@ class YearSelector extends StatelessWidget {
         margin: const EdgeInsets.fromLTRB(20, 0, 0, 0),
         padding: const EdgeInsets.fromLTRB(5, 0, 5, 0),
         decoration: BoxDecoration(
-          color: Colors.blue,
-          borderRadius: BorderRadius.circular(5)
+          color: Theme.of(context).colorScheme.primaryContainer,
+          borderRadius: BorderRadius.circular(5),
         ),
         child: Row(
           children: [